@charset "UTF-8";
/*
Theme Name: SHIGAJOB-求人サイト
Author: kdf
Description: SHIGAJOB-求人サイト
Version:1.5
License: GNU General Public License v2 or later
License URI: LICENSE
*/


body {
margin: 0;
font-family: "Noto Sans JP", sans-serif;
font-size: 16px;
-webkit-text-size-adjust: 100%;
font-weight: 400;
line-height: 1.6em;
background: #ffffff;
color: #333333;
background: inherit;
text-align: justify;
letter-spacing: 0.04em;
}

body,html{padding: 0 ;margin: 0!important}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
}

*{
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

/* テキスト */
h1{font-size: 1.75em;}
h2 {font-size: 1.5em;}
h3 {font-size: 1.25em}
h4 {font-size: 1.125em}
h5 {font-size: 1em}
h6 {font-size: 0.875em}

h1,h2,h3,h4,h5,h6{margin:0 0 10px;}

@media only screen and (max-width:520px){
h1 {font-size: 1.25em;}
h2 {font-size: 1.125em;}
h3 {font-size: 1em}
h4 {font-size: 1em}
}

.mincho{
font-family: "游明朝","Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,メイリオ,Meiryo,serif;
font-weight: 300;
}

.maru{
font-family: "M PLUS Rounded 1c", sans-serif;
font-weight: 500;
font-style: normal;
}


button, input, label, select, textarea{
font-family: inherit;
font-size: 1em;
}

img{max-width: 100%;height: auto;}
a img{
transition: .6s ease;
-webkit-transition: .6s ease;
-ms-transition: .6s ease;}
a img:hover{opacity: .7;}

ul{padding: 0;margin: 0}
ul li{list-style:none}
a{text-decoration: none;color: #333333;}
p{margin:0 0 1em;}
.bold{font-weight:600}
.sp{display: none!important;}
.ipSp{display: none!important;}

@media only screen and (max-width:768px){
.ip{display: none!important;}
.ipSp{display: inherit!important;}
}

@media only screen and (max-width:480px){
.sp{display: inherit!important;}
.pc{display: none!important;}
p{font-size: 0.875em;}
}

.d-flex{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
justify-content: space-between;
}

.d-flex-around{justify-content: space-around;}
.d-flex-start{justify-content: flex-start;}
.d-flex-end{justify-content: flex-end;}
.d-flex-center{justify-content: center;}
.align-center{align-items: center;}
.align-end{align-items: end;}
.flex-reverse{flex-wrap: wrap-reverse;}
.text-center {text-align: center;}
.text-right{text-align: right;}
.text-justify{text-align: justify;}

p.text-center,.text-center p{line-height: 1.8em;}

.col2{width: 48%;}
.col3{width: 30%;margin-right: 5%;margin-bottom: 30px;}
.col3:nth-of-type(3n){margin-right: 0;}

@media only screen and (max-width:768px){
.col2{width: 100%;}
.col3{width: 48%;margin-right: 0;}
.col3:nth-of-type(2n){margin-right: 0;}
.col2:last-child,
.col3:last-child{margin-bottom: 0;}
}

@media only screen and (max-width:520px){
.col3{width: 100%;}
}


.clear{clear: both;}
.bold{font-weight:bold;}
.normal{font-weight: normal!important;}
.pink{color: #ff6e96}
.red{color: #d0121b}
.orange{color: #f18e1d}
.yellow{color: #f7b52c}
.green{color: #47ac49}
.blue{color: #3071b9}
.white{color: #ffffff}
.black{color:#333333}
.darkgray{color: #e6e6e6;}


/* ------------------------------------------------
外枠
------------------------------------------------
*/ 

.container-inner{
max-width: 1480px;
padding: 0 40px;
margin: 0 auto;
}

/* #wrapper{background: #e6e6e6;} */

#page{padding-bottom: 100px;}
.fixity{padding-bottom: 100px;}

@media only screen and (max-width:1400px){
.container-inner{padding: 0 20px;}
}

@media only screen and (max-width:480px){
#page,
.fixity{padding-bottom: 50px;}
}


/* margin */
.mb-1{margin-bottom: 10px;}
.mb-2{margin-bottom: 20px;}
.mb-3{margin-bottom: 30px;}
.mb-4{margin-bottom: 40px;}
.mb-5{margin-bottom: 50px;}
.mb-6{margin-bottom: 60px;}
.mb-7{margin-bottom: 70px;}
.mb-8{margin-bottom: 80px;}
.mb-9{margin-bottom: 90px;}
.mb-10{margin-bottom: 100px;}

@media only screen and (max-width:520px){
.mb-5{margin-bottom: 30px;}
.mb-6{margin-bottom: 40px;}
.mb-7{margin-bottom: 50px;}
.mb-8{margin-bottom: 60px;}
.mb-9{margin-bottom: 70px;}
.mb-10{margin-bottom: 80px;}
}


/* ------------------------------------------------
共通箇所
------------------------------------------------
*/

/* ------------------------------------------------
header 
------------------------------------------------
*/ 

header{
padding: 20px 0;
background: #d0121b;
position: sticky;
top: 0;
z-index: 220;
width: 100%;
}

#header-logo{
width: 220px;
height: auto;
z-index: 210;
line-height: 0;
}

header .d-flex{align-items: center;}

header ul.grand-menu{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
}

header ul.grand-menu li{
font-size: 0.875em;
font-weight: 600;
margin-left: 22px;
}

header ul.grand-menu li a{
color: #ffffff;
padding: 0.2em 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
align-items: center;
transition: ease .3s;
border-bottom: 2px solid rgb(255,255,255,0);
}

header ul.grand-menu li a:hover{
border-bottom: 2px solid #ffffff;
}


header ul.grand-menu li a img{
width: 30px;
margin-right: 5px;
}


header #nav-wrapper{display: none;}

@media only screen and (max-width:1200px){
header ul.grand-menu li{
margin-left: 15px;
font-size: 0.75em;
}

header ul.grand-menu li a img{width: 28px;}
}

@media only screen and (max-width:1000px){
header ul.grand-menu li a{
display: grid;
justify-items: center;
}

header ul.grand-menu li a img{margin-right: 0;}
}


@media only screen and (max-width:768px){

header #nav-wrapper{display: inherit;}

#header-logo{width: 150px;}
header{padding: 10px 0;}


/* ハンバーガー */
.ham {
position: relative;
width: 28px;
height: 16px;
cursor: pointer;
display: inherit;
z-index: 999;
}

.ham_l {
position: absolute;
width: 28px;
height: 2px;
left: 0;
background: #ffffff;
transition: all .4s;
}

.ham_l-1 {top: 0;}
.ham_l-2 {top: 8px;}
.ham_l-3 {top: 16px;}

.open .ham_l-1 {
transform: rotate(-45deg);
top: 11px;
background: #3071b9;
}

.open .ham_l-2 {opacity: 0;}
.open .ham_l-3 {
transform: rotate(45deg);
top: 11px;
background: #3071b9;
}


/* メニュー  */
.side-nav,
.search-nav{
position: fixed;
top: 0;
width: 80%;
height: 100vh;
padding: 50px 20px 30px;
background: #ffffff;
transition: all .4s;
z-index: 220;
right: -100%;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
}


.side-nav.open,
.search-nav.open {
right: 0;
}

/* 背景 */
.black-bg {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100vh;
background: #333333;
opacity: 0;
visibility: hidden;
transition: all 0.5s;
z-index: 210;
cursor: pointer;
}

.black-bg.open {
opacity: 0.6;
visibility: visible;
}

.header-nav { display: none; }

header ul.grand-menu{
justify-content: center
}


header ul.grand-menu li{
font-size: 14px;
line-height: 1;
}

header ul.grand-menu-sp li{
font-size: 8px;
margin: 0 10px 0 0;
}

header ul.grand-menu-sp a:hover img{
opacity: 1;
}

header ul.grand-menu-sp li a img{
width: 30px;
margin: 0;
}

header ul.grand-menu-sp li a{
display: block;
text-align: center;
line-height: 1.4em;
}

.search-icon{
font-size: 8px;
text-align: center;
color: #ffffff;
margin-right: 15px;
cursor: pointer;
z-index: 999;
line-height: 1.4em;
}

.search-icon img{
transition: opacity .3s ease;
width: 28px;
height: 30px;
}

.search-icon.open img{
opacity: 0;
}

.search-icon::before,
.search-icon::after{
content: "";
position: absolute;
top: 50%;
right: 48px;
width: 0;
height: 2px;
background: #3071b9;
opacity: 0;
transition: all .3s ease;
}

.search-icon::before{
transform: translate(-50%, -50%) rotate(45deg);
}

.search-icon::after{
transform: translate(-50%, -50%) rotate(-45deg);
}

.search-icon.open::before,
.search-icon.open::after{
width: 28px;
opacity: 1;
}


header ul.grand-menu li a{
padding: 0;
border-bottom: none;
}

header ul.grand-menu li a:hover{
border-bottom: none;
}

.side-nav ul.grand-menu{
display: block;
border: 1px solid #333333;

border-radius: 5px;
}

.side-nav ul.grand-menu li{
border-bottom: 1px solid #333333;
margin: 0;
}

.side-nav ul.grand-menu li:last-of-type{
border: none;
}

.side-nav ul.grand-menu li a{
color: #333333;
padding: 15px;
display: block;
}

.mypage-menu{margin-bottom: 30px;}

.mypage-menu li{
font-size: 14px;
width: 47%;
text-align: center;
}

.mypage-menu li a{
color: #3071b9;
display: block;
border: 2px solid #3071b9;
border-radius: 5px;
padding: 6px;
}

.mypage-menu li:last-of-type a{
color: #ffffff;
background-color: #3071b9;
}

}


@media only screen and (max-width:480px){
#header-logo{width: 120px;}

header ul li{
font-size: 12px;
line-height: 1em;
}

header ul.grand-menu-sp li,
.search-icon{
font-size: 6px;
}

.search-icon img{
width: 24px;
}

}



/* ------------------------------------------------
footer
------------------------------------------------
*/ 

footer .footer-logo{width: 250px;}

footer .footer-nav{
align-items: center;
padding: 30px 0;
}

footer .footer-nav ul li{
font-size: 0.875em;
font-weight: 600;
margin: 0 15px;
}

footer .footer-nav ul li a{
color: #717071;
}

footer .footer-contact{
width: 280px;
}

.footer-area{
background: #3071b9;
padding: 20px 0;
}

p.copyright,
.footer-area li a{
font-size: 0.875em;
color: #ffffff;
line-height: 1.4em;
margin-bottom: 0;
}

.float-btn{
position: fixed;
z-index: 2;
right: 80px;
bottom: 100px;
width: 150px;
}



@media only screen and (max-width: 1200px){
footer p,footer .footer-nav ul li{font-size: 13px;}
footer .footer-nav ul{margin-top: 10px;}
footer .footer-contact{
margin-top: 20px;
}

.float-btn{right: 30px;width: 120px;}
}

@media only screen and (max-width: 768px){
footer .footer-nav {justify-content: flex-start;}
footer .footer-nav .d-flex{width: 100%;margin-top: 15px;}
.float-btn{
width: 90px;
}


}

@media only screen and (max-width: 620px){
footer .footer-logo{
width: 220px;
}
footer .footer-nav ul li,p.copyright{font-size: 0.75em;}

footer .footer-nav ul li{
width: 31%;
margin: 0;
}

footer .footer-contact{
width: 240px;
}

}

@media only screen and (max-width: 480px){
footer .footer-nav ul li{
width: 45%;
margin: 0 0 10px;
}

.float-btn{
display: none;
}

}




/* ------------------------------------------------
ボタン
------------------------------------------------
*/ 
.btn{
font-size: 1.25em;
text-align: center;
font-weight: 600;
margin-bottom: 20px;
}

.btn a{
display: block;
border-radius: 15px;
padding: 15px;
background: #ffffff;
border: 3px solid #3071b9;
transition: ease .4s;
}

.btn-rB a{
text-align: center;
color: #ffffff;
background: #3071b9;
border: 3px solid #3071b9;
}

.btn a:hover{
background: rgb(18,116,204,0.2);
}

.btn-rB a:hover{
background: #717071;
border: 3px solid #717071;
}


@media only screen and (max-width: 520px){
.btn{font-size: 1em;}
}


/* ------------------------------------------------
背景・カラム
------------------------------------------------
*/ 

.wrapper-back{
position: relative;
background: #e6e6e6;
}

.col--l{
margin-bottom: 180px;
padding-bottom: 0!important
}


.col--l .content{
width: 71.429%;
position: relative;
}

.content-wrapper{
background: #ffffff;
padding: 40px;
}

.group .side-area{
width: 25%;
padding: 20px;
border-radius: 20px;
background: #ffffff;
}


.wrapper-back .main-inner{
background-image: url(./images/post/backP01.png);
background-repeat: repeat-y;
background-position: center 100px;
}

.col--l .main-inner{padding-bottom: 300px;}


/* 各ページの人気の求人 */
.wrapper-back .job-popular{
padding: 0 0 80px;
}

.wrapper-back .job-popular{
background: #ffffff;
}

.single .wrapper-back .job-popular{
background: #e6e6e6;
}

.wrapper-back .job-popular .site-area-2::before{
background-image: url(./images/post/backP03.png);
}

.wrapper-back .job-popular .site-area-3::before{
background-image: url(./images/common/footer_back02.png);
}

/* 求人ページのみ */
.single .col--l .main-inner{padding-bottom: 400px;}

.single .wrapper-back .job-popular .site-area-2::before{
background-image: url(./images/top/backB03.png);
}

.single .wrapper-back .job-popular .site-area-3::before{
background-image: url(./images/common/footer_back.png);
}

/* 類似の求人追加 */
.job-resemble{
background: #ffffff;
padding: 0 0 220px;
}

.job-resemble .site-area-4::before{
background-image: url(./images/post/backP05.png);
top: -330px;
height: 400px;
}

@media only screen and (max-width: 1400px){
.col--l{
margin-bottom: 120px;
}


.wrapper-back .job-popular{
padding: 0 0 100px;
}
}

@media only screen and (max-width: 1000px){
.col--l{
margin-bottom: 70px;
}


.wrapper-back .job-popular .site-area-2::before{
background-image: url(./images/post/backP03Sp.png);
}

.wrapper-back .job-popular .site-area-3::before{
background-image: url(./images/common/footer_back02Sp.png);
}

.single .col--l .main-inner{padding-bottom: 250px;}

.single .wrapper-back .job-popular .site-area-2::before{
background-image: url(./images/top/backB03Sp.png);
}

.single .wrapper-back .job-popular .site-area-3::before{
background-image: url(./images/common/footer_backSp.png);
}

.job-resemble .site-area-4::before{
background-image: url(./images/post/backP05Sp.png);
left: 0;
top: -170px;
height: 240px;
}
}


@media only screen and (max-width: 920px){
.col--l .content{width: 100%;}
.content-wrapper{padding: 30px 20px;}
.group .side-area{display: none;}
}


@media only screen and (max-width: 768px){
.col--l .main-inner{padding-bottom: 200px;}
}


@media only screen and (max-width: 480px){
.col--l{margin-bottom: 40px;}
.col--l .main-inner{padding-bottom: 120px;}
.single .col--l .main-inner{padding-bottom: 140px;}
.wrapper-back .job-popular{padding: 0 0 80px;}
.job-resemble{padding: 0 0 100px;}
.job-resemble .site-area-4::before{
top: -90px;
height: 120px;
}
}


/* ------------------------------------------------
検索フォーム
------------------------------------------------
*/ 



/* --------------検索画面-------------- */

/* label整列*/
.label-wrap {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 10px 20px;
max-height: 0;
overflow: hidden;
transition: ease .4s ;
}

.label-wrap.open {
max-height: 700px;
}

/* タイトル */
.search-tit {
background: #e6e6e6;
padding: 10px 30px;
border-radius: 10px;
cursor: pointer;
position: relative;
margin-bottom: 10px;
}

.search-tit::after {
content: "＋";
position: absolute;
right: 10px;
top: 50%;
transform: translateY(-50%);
width: 24px;
height: 24px;
border-radius: 50%;
background: #717071;
color: #ffffff;
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
}

.search-tit.open::after {
content: "－";
}


/* チェック */
.search-content label {
font-size: 0.875em;
line-height: 1;
border: 1px solid #595757;
padding: 10px 8px;
border-radius: 10px;
cursor: pointer;
}

.search-content label input{
width: 14px;
margin: 3px;
}


.search-content label.active {
background: #bddbe5;
border: 1px solid #595757;
}

.search-btn-area{
margin-top: 30px;
}

#site-content-top .search-btn-area{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}


/* 検索フォームボタン */
.search-content input[type="submit"],
.search-content input[type="reset"]{
font-size: 1.375em;
font-weight: 600;
display: block;
padding: 20px;
width: 47.5%;
background: #3071b9;
border: 5px solid #3071b9;
color: #ffffff;
border-radius: 10px;
cursor: pointer;
transition: ease .4s;
}

.search-content input[type="submit"]:hover,
.search-content input[type="reset"]:hover{
transform: scale(1.05);
}

/* 検索リセットボタン */
.search-content input[type="reset"]{
color: #1274cc;
background: #97d1fc;
border: 5px solid #97d1fc;
}


@media only screen and (max-width: 520px){
.search-content input[type="submit"], 
.search-content input[type="reset"]{
font-size: 1.125em;
border: 3px solid #3071b9;
padding: 10px;
margin-bottom: 20px;
}

.search-content input[type="reset"]{
border: 3px solid #97d1fc;
}

.search-content input[type="submit"], 
.search-content input[type="reset"]{
width: 100%;
}


}

@media only screen and (max-width: 480px){
	
.search-tit{
font-size: 0.875em;
padding: 10px 20px;
}

.search-content label{
font-size: 0.75em;
line-height: 1.4em;
border: 1px solid;
border-radius: 6px;
padding: 5px;
}
}



/* ------------------------------------------------
side
------------------------------------------------
*/ 


/* 検索 */
.searchArea-free {margin-top: 20px;}

.searchArea-free input{
width: 100%;
border: 1px solid #333333;
padding: 5px;
border-radius: 20px;
}

.side-area .search-content{margin: 0 0 50px;}

.side-area input[type="submit"],
.side-area input[type="reset"]{
font-size: 1.125em;
padding: 10px;
border: 3px solid #3071b9;
border-radius: 10px;
width: 100%;
margin-bottom: 25px;
}

.side-area input[type="reset"]{
border: 3px solid #97d1fc;

}

.side-area .searchArea {
margin-top: 15px;
}

.side-area label{
font-size: 0.75em;
border-radius: 6px;
padding:6px 4px;
}

.side-area label input{
width: 10px;
}



/* 検索にタイトルを追加 */
.side-area h3{
font-size: 1.125em;
display: block;
margin: 40px 0 20px;
padding: 12px 20px;
font-weight: 600;
color: #ffffff;
background: #b4b4b5;
border-left: 10px solid #d0121b;
position: relative;
}

.side-area h3::after{
content: "";
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
width: 0;
height: 0;
border-top: 30px solid transparent;
border-bottom: 30px solid transparent;
border-right: 30px solid #ffffff; /* 親背景色 */
}

.side-area .tab-place h3{
background: #2f5a9e
}

.side-area .tab-industry h3{
background: #47ac49;
}

.side-area .tab-commitment h3{
background: #f18e1d;
}

.side-area .tab-place h4{
background: #c3e8f4;
}

.side-area .tab-industry h4{
background: #cce2a3;
}

.side-area .tab-commitment h4{
background: #facb8c;
}

.side-area .btn{
font-size: 1.25em;
font-family: "M PLUS Rounded 1c", sans-serif;
font-weight: 600;
font-style: normal;
}

.side-area .btn a{
color: #3071b9;
border: 3px solid #3071b9;
transition: ease .4s;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
align-items: center;
padding: 7px;
}

.side-area a:hover{
background: rgb(18,116,204,0.2);
}

.side-area .btn a::before{
content: "";
background-size: contain;
background-repeat: no-repeat;
display: inline-block;
padding-left: 50px;
height: 52px;
margin-right: 10px;
margin-left: 30px;
}

.side-area .btn-qanda{font-size: 2.5em;}

.side-area .btn-qanda a::before{
background-image: url(./images/common/side_qanda.svg);
margin-right: 20px;
}

.btn-con a::before{
background-image: url(./images/common/side_contact.svg);
}

@media only screen and (max-width: 1200px){
.side-area .btn{font-size: 1em;}

.side-area .btn a::before{
padding-left: 30px;
height: 32px;
margin-left: 15px;
}

.sidebar-default .btn-nt a{padding: 10px 7px;}
}


@media only screen and (max-width: 1100px) and (min-width: 769px) {
.side-area h3{
font-size: 0.875em;
padding: 10px 15px;
}
}



/* ------------------------------------------------
content
------------------------------------------------
*/


/*----------------------------
パンくず
----------------------------*/
ul.breadcrumb{
font-size: 0.8em;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
padding: 50px 0 20px;
}

ul.breadcrumb li:not(:first-child){
margin-left: 28px;
position: relative;
}

ul.breadcrumb li:not(:first-child)::before{
content: "";
position: absolute;
top: 45%;
left: -20px;
display: block;
width: 5px;
height: 1px;
background: #333333;
padding-left: 5px;
}

ul.breadcrumb li:last-child::after{content: ""}


@media only screen and (max-width:768px){
ul.breadcrumb{
font-size: 0.677em;
justify-content: flex-start;
padding: 30px 0 12px;
}

.col--l ul.breadcrumb li:not(:first-child)::before{
background: #333333;
}

}


/*----------------------------
pagination
----------------------------*/
.pagination {text-align: center;}

.nav-links{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
justify-content: center;
flex-wrap: wrap;
}

.pagination .page-numbers {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
align-items: center;
justify-content: center;
width: 35px;
height: 35px;
margin: 0 15px 20px 0;
color: #717071;
background: #ffffff;
border: 1px solid #717071;
border-radius: 5px;
line-height: 0;
}

.pagination a:hover{
transition: .3s;
background: #3071b9;
border: 1px solid #3071b9;
color: #ffffff;
}

.pagination .current {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
align-items: center;
justify-content: center;
width: 35px;
height: 35px;
color: #ffffff;
background: #3071b9;
border: 1px solid #3071b9;
border-radius: 5px;
}

.pagination .dots {background: transparent;}


/*----------------------------
コンテンツ
----------------------------*/


/* ------アニメーション設定------ */
.fadein{
opacity: 0;
transform: translate3d(0, 40px, 0);
}

.fadein.is-active{
opacity: 1;
transform: translate3d(0, 0, 0);
transition: 1s;
}


/* ------タイトル------ */
.main-tit{
font-size: 1.5em;
color: #d0121b;
margin-bottom: 30px;
}

.page-tit{
font-family: "M PLUS Rounded 1c", sans-serif;
font-weight: 500;
font-style: normal;
font-size: 2em;
text-align: center;
margin-bottom: 50px;
}


.post-tit{
font-size: 1.375em;
line-height: 1.5em;
border-left: 10px solid #d0121b;
padding: 15px 0;
margin-bottom: 20px;
padding: 6px 10px;
}


@media only screen and (max-width: 520px){
.main-tit{
font-size: 1.25em;
margin-bottom: 20px;
}

.blog-tit{
font-size: 1.125em;
margin: 10px 0;
}

.page-tit{
font-size: 1.125em;
margin-bottom: 30px;
}

.post-tit{
font-size: 1.25em;
margin: 12px 0 20px;}
}


/* ------投稿------ */
.search-page-tit{
font-size: 2em;
color: #ffffff;
font-weight: 400;
text-align: center;
letter-spacing: 0.08em;
margin: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
justify-content: center;
align-items: center;
}

.search-page-tit:before,
.search-page-tit::after{
content: "";
background-image: url(./images/common/search.svg);
display: inline-block;
background-repeat: no-repeat;
background-size: contain;
width: 25px;
height: 25px;
margin: 0 10px;
}

.search-page-tit:before{
transform: rotate(270deg);
}


@media only screen and (max-width: 1100px){

.search-page-tit{bottom: 20px;}

}


@media only screen and (max-width: 520px){

.search-page-tit{font-size: 1.25em;}
.search-page-tit:before,
.search-page-tit::after{
width: 15px;
height: 15px;
margin: 0 5px;
}

}

/* 求人内容 */
.post-heading .col2{position: relative;}

.job-update-date{
text-align: right;
margin-top: 20px;
}

.post-heading-text{
border-top:5px dotted #3071b9;
border-bottom: 5px dotted #3071b9;
padding: 15px;
margin-bottom: 30px;
font-weight: 600;
}

.post-heading-text p{margin: 0;}

@media only screen and (max-width: 768px){
.post-heading-text{
margin: 30px 0;
}

}

.post-heading .ipSp{
	position: relative;
}

/* NEWアイコン */
.newIcon{
font-size: 1em;
font-weight: 600;
color: #ffffff;
display: inline-block;
position: absolute;
top: 0;
left: 0;
width: 0;
height: 0;
border-top: 65px solid #d0121b;
border-right: 65px solid transparent;
}

.newIcon::before{
content: "NEW";
position: absolute;
top: -54px;
left: 4px;
color: #ffffff;
font-weight: bold;
transform: rotate(-45deg);
}

/* PICK UPアイコン */
.pickUpIcon{
font-size: 0.75em;
font-weight: 600;
color: #ffffff;
display: inline-block;
position: absolute;
top: 0;
left: 0;
width: 0;
height: 0;
border-top: 65px solid #f18e1d;
border-right: 65px solid transparent;
}

.pickUpIcon::before{
content: "PICK UP";
position: absolute;
line-height: 1;
text-align: center;
top: -55px;
left: 5px;
color: #ffffff;
font-weight: bold;
transform: rotate(-45deg);
}


/* タイトル */
.job-content h3{
font-size: 1.125em;
font-weight: 600;
color: #ffffff;
background: #3071b9;
border-radius: 50px 0 0 50px;
padding: 10px 10px 10px 20px;
margin-bottom: 20px;
display: flex;
align-items: center;
position: relative;
}

.job-content h3 span {
padding: 0 10px 0 0;
white-space: nowrap;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
align-items: center;
}

.job-content h3::before{
content: "";
background: #ffffff;
width: 10px;
height: 10px;
border-radius: 50%;
position: absolute;
right: 10px;
}

.job-content h3::after {
content: "";
background: #ffffff;
height: 2px;
flex: 1;
}


/* カテゴリー・タグ */
.post-item{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}

.post-item li{
font-size: 0.75em;
color:#d0121b;
text-align: center;
display: inline-block;
display: block;
line-height: 1em;
margin: 0 10px 10px 0;
}

.post-item li a{
display: block;
padding: 5px;
transition: ease .4s;
}

.post-categoris,
.post-tags{
justify-content: flex-start;
}

.post-categoris li a{
color: #ffffff;
background: #d0121b;
border: 1px solid #d0121b;
}

.post-categoris li a:hover{
background: #f1b8bb;
border: 1px solid #f1b8bb;
}

.post-tags li a{
color:#d0121b;
border: 1px solid #d0121b
}

.post-tags li.tag-temporary-employee a{
color: #ffffff;
border: 1px solid #3071b9;
background: #3071b9;
}

.post-tags li.tag-temporary-employee a:hover{
border: 1px solid #92c6ec;
background: #92c6ec;
}

.post-tags li a:hover{
color: #ffffff;
border: 1px solid #f18e1d;
background: #f18e1d;
}


/* おすすめポイント */
.job-about h3 span{
line-height: 1;
}

.job-about h3 span img{
height: 32px;
}

.job-about dl{
margin-bottom: 1em;
}

.job-about dl dt{
font-size: 1.125em;
font-weight: 600;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
align-items: center;
}

.job-about dl dt:before{
content: "";
background-image: url(./images/post/point.svg);
background-size: contain;
background-repeat: no-repeat;
display: inline-block;
padding-left: 25px;
height: 25px;
margin-right: 5px;
vertical-align: middle;
}

.job-about dl dd{
padding-left: 30px;
}


@media only screen and (max-width: 768px){
.job-about h3 span img{
height: 23px;
}

.post-item{margin: 30px 0;}
.job-about .col2{margin-top: 20px;}
}

@media only screen and (max-width: 620px){
.job-posting h3 span::before{
width: 20px;
height: 20px;
}

.job-posting table th,
.job-posting table td{
padding: 8px;
}

.job-posting table th:before{
width: 20px;
height: 20px;
margin-right: 3px;
}
	
.job-content h3{
font-size: 1.125em;
padding: 8px 8px 8px 14px;
}

.job-content h3::before{
right: 7px;
}

.job-posting h3 span::before{
width: 15px;
height: 15px;
}
}

@media only screen and (max-width: 520px) {
.job-posting table th:before {
width: 22px;
height: 22px;
}

.job-posting table th {
font-size: 0.6em;
line-height: 1.4em;
}

.job-posting table td {
font-size: 0.825em;
}

}


@media only screen and (max-width: 480px){
.job-about dl dt{
font-size: 1em;
}

.job-about dl dt:before{
padding-left: 18px;
height: 18px;
}

.job-about dl dd{
font-size: 0.875em;
padding-left: 26px;
line-height: 1.4em;
}

}


/* 募集内容 */
.job-posting td,
.job-posting dd{
white-space:pre-wrap;
}

.job-posting table{
border-collapse: collapse;
width: 100%;
table-layout: fixed; 
margin-bottom: 40px;
}

.job-posting h3 span::before{
content: "";
background-image: url(./images/common/search.svg);
background-size: contain;
background-repeat: no-repeat;
display: inline-block;
width: 22px;
height: 22px;
margin-right: 5px;
}

.job-posting table ul{
display: grid;
}

.job-posting table th,
.job-posting table td{
font-size: 0.9375em;
line-height: 1.5em;
border: 1px solid #333333;
padding: 10px;
}

.job-posting table th{
width: 25%;
background: #e6e6e6;
}

.job-posting table th:before{
content: "";
display: inline-block;
background-repeat: no-repeat;
width: 25px;
height: 25px;
margin-right: 5px;
background-size: contain;
vertical-align: middle;
}

.job-posting table th.icon01::before{
background-image: url(./images/post/icon01.svg);
}

.job-posting table th.icon02::before{
background-image: url(./images/post/icon02.svg);
}

.job-posting table th.icon03::before{
background-image: url(./images/post/icon03.svg);
}

.job-posting table th.icon04::before{
background-image: url(./images/post/icon04.svg);
}

.job-posting table th.icon05::before{
background-image: url(./images/post/icon05.svg);
}

.job-posting table th.icon06::before{
background-image: url(./images/post/icon06.svg);
}

.job-posting table th.icon07::before{
background-image: url(./images/post/icon07.svg);
}

.job-posting table th.icon08::before{
background-image: url(./images/post/icon08.svg);
}

.job-posting table th.icon09::before{
background-image: url(./images/post/icon09.svg);
}

.job-posting table th.icon10::before{
background-image: url(./images/post/icon10.svg);
}

.job-posting table th.icon11::before{
background-image: url(./images/post/icon11.svg);
}

.job-posting table th.icon12::before{
background-image: url(./images/post/icon12.svg);
}

.job-posting table th.icon13::before{
background-image: url(./images/post/icon13.svg);
}

.job-posting table th.icon14::before{
background-image: url(./images/post/icon14.svg);
}

.job-posting table th.icon15::before{
background-image: url(./images/post/icon15.svg);
}

.job-posting table th.icon16::before{
background-image: url(./images/post/icon16.svg);
}

.job-posting table .f-b{
font-weight: 600;
font-size: 1.25em;
}

.job-posting table .small{
font-size: 13px;
line-height: 1.2em;
}

.job-posting .workplace-area td{
white-space:normal
}

.job-posting .workplace-area ul{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
justify-content: flex-start;
}

.job-posting .workplace-area ul li{
font-size: 10px;
width: calc(100%/5);
display: grid;
text-align: center;
margin: 10px 0;
}

.job-posting .workplace-area ul li img{
width: 68px;
margin: 0 auto;
}

@media only screen and (max-width: 1200px){
.job-posting .workplace-area ul li{
width: calc(100%/4);
}
}

@media only screen and (max-width: 768px){
.job-posting table th{
width: 20%;
text-align: center;
}

.job-posting table th:before{
display: block;
margin: 0 auto;
}

.job-posting table .small{
font-size: 12px;
}

.job-posting .workplace-area ul li{
width: calc(100%/3);
}
}

@media only screen and (max-width: 520px){
.job-posting table th{
font-size: 0.45em;
line-height: 1.4em;
}
.job-posting table td{
font-size: 0.625em;
}

.job-posting table th, 
.job-posting table td{
padding: 7px;
}

.job-posting table th:before{
width: 16px;
height: 16px;
}

.job-posting table .bold{
font-size: 1.125em;
}

}

@media only screen and (max-width: 480px){
.job-posting .workplace-area ul li{
width: calc(100%/2);
}
}



.btn-area .btn a{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
align-items: center;
justify-content: center;
padding: 10px 15px;
}

.btn-area .btn a:before{
content: "";
background-image: url(./images/common/arrowR.svg);
width: 40px;
height: 40px;
display: inline-block;
background-repeat: no-repeat;
background-size: contain;
margin-right: 5px;
}

.btn-area .btn:nth-of-type(2) a:before{
transform: rotate(90deg);
}

.btn-area .btn-rB a{padding: 19px 15px;}

.btn-area .btn-rB a:before{
content: none;
}



/*----------------------------
求人-検索結果 一覧
----------------------------*/
.post-list{
margin-bottom: 40px;
position: relative;
}

.post-list a{
border: 3px solid #3071b9;
border-radius: 20px;
padding: 25px;
transition: ease .4s;
}

.post-list a:hover{
background: rgb(18,116,204,0.1);
}

.post-list .post-info{width: 30.094%;}

.post-list .post-thumbnail{position: relative;}
.post-list .post-thumbnail img:hover{opacity: 1;}



.post-list  .post-description{width: 67%;}

.post-description h3{
border-bottom: 4px dotted #333333;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
line-clamp: 2;
overflow: hidden;
padding-bottom: 0.2em;
margin-bottom: 0.5em;
}

.post-list h3{
font-size: 1.125em;
}

.post-list .post-description ul{
margin-bottom: 10px;
}

.post-list .post-description ul li{
font-size: 0.875em;
font-weight: 600;
line-height: 1.4em;
border-bottom: 2px solid #3071b9;
padding: 6px 0;
white-space: pre-wrap;
}

.post-description ul li{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
align-items: center;
}

.post-list .post-description ul li:last-of-type{
font-size: 1.125em;
border: none;
}

.post-description ul li::before{
content: "";
background-image: url(./images/post/icon04.svg);
display: inline-block;
background-repeat: no-repeat;
padding-left: 25px;
height: 25px;
margin-right: 5px;
background-size: contain;
vertical-align: middle;
}

.post-description ul li:nth-of-type(2):before{
background-image: url(./images/post/icon05.svg);
}

.post-description ul li:nth-of-type(3):before{
background-image: url(./images/post/icon02.svg);
}

.post-description ul li:nth-of-type(4):before{
background-image: url(./images/post/icon08.svg);
}

.post-description ul li:nth-of-type(5):before{
background-image: url(./images/post/icon07.svg);
}

.post-description ul li.post-job{
display: block;
width: 100%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}


.post-description-more{
text-align: right;
}

.post-description p{
font-size: 0.75em;
margin-bottom: 0;
}

.jobmore{
text-align: center;
color: #d0121b;
display: inline-block;
border: 2px solid #d0121b;
border-radius: 10px;
padding: 5px 20px;
margin-bottom: 0.2em;
}

.btn-form{font-size: 1.5em;}

.btn-form a{
color: #d0121b;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
align-items: center;
justify-content: center;
}

.btn-form a::before{
content: "";
background-image: url(./images/common/registration.svg);
background-size: contain;
background-repeat: no-repeat;
display: inline-block;
padding-left: 150px;
height: 24px;
margin-right: 10px;
}


@media only screen and (max-width:620px){
.post-list .post-info,
.post-list .post-description{width: 100%;}
.post-list .post-info{margin-bottom: 10px;}
.btn-form{font-size: 1.25em;}
.btn-form a::before{padding-left: 135px;height: 31px;}
}

@media only screen and (max-width:480px){
.post-list a{padding: 15px;}
.post-list h3{font-size: 1.125em; }
.post-list .post-description ul li{padding: 8px 0;}
.post-list .post-description ul li:last-of-type{justify-content: flex-end;}
.jobmore{display: block;}
.btn-form{font-size: 1em;}
.btn-form a::before{padding-left: 110px;height: 17px;margin-right: 0;}
}


/*----------------------------
求人-検索結果
----------------------------*/
.archive-post{width: 24.5%;position: relative;transition: ease .4s;}

.archive-post .post-thumbnail{line-height: 0;}
.archive-post img:hover{opacity: 1;}

.archive-post h3{
font-size: 0.875em;
height: 49px;
line-height: 1.5em;
}

.archive-post h4{
font-size: 0.875em;
line-height: 1.5em;
margin-bottom: 0.5em;
}

.archive-post h4 span{
font-size: 10px;
color: #ffffff;
background: #47ac49;
padding: 2px 3px 2px 5px;
margin-right: 7px;
}

.archive-post .post-description{
background: #ffffff;
padding: 10px;
}

.archive-post .post-description ul li{
font-size: 0.75em;
line-height: 1.4em;
margin-bottom: 0.2em;
}

.archive-post .post-description p{
font-size: 1.125em;
font-weight: 600;
line-height: 1;
text-align: right;
margin-left: 5px;
}

.moreBtn{
line-height: 1.5em;
color: #ffffff;
padding: 8px 15px;
background: #3071b9;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
justify-content: flex-end;
align-items: center;
transition: ease .4s;
}

.moreBtn:after{
content: "";
background-image: url(./images/common/arrow.svg);
display: inline-block;
background-repeat: no-repeat;
background-size: contain;
width: 13px;
height: 13px;
margin-left: 8px;
}

.archive-post:hover .moreBtn{
background: #92c6ec;
}

@media only screen and (max-width: 480px){
.moreBtn{padding: 8px;font-size: 0.875em;}
.moreBtn:after{
width: 10px;
height: 10px;
}

}



/*----------------------------
お知らせ 一覧
----------------------------*/
.news-list h3{
border-bottom: 4px dotted #333333;
padding-bottom: 0.5em;
}

.news-list a{
display: block;
border: 3px solid #d0121b;
border-radius: 20px;
padding: 20px;
margin-bottom: 30px;
transition: ease .4s;
}

.news-list a:hover{
background: rgb(195,13,35,0.1);
}

.news-list p:last-of-type{
font-size: 0.875em;
text-align: right;
margin-top: 10px;
}

.news-list p{margin-bottom: 0;}



/* --------------------------------------------------------------------------------------------------------------------------------------------
*
各ページ
*
--------------------------------------------------------
------------------------------------------------------------------------------------
*/


/* ------------------------------------------------
top
------------------------------------------------
*/ 


/*---------動画----------*/
.vid-contents{
position: relative;
z-index: -2;
line-height: 0;
}

.vid-contents video {
width: 100%;
text-align: center;
margin: auto;
}




#site-content-top h1{
font-family: "M PLUS Rounded 1c", sans-serif;
font-size: 2.25em;
font-weight: 500;
color: #ffffff;
background-image: url(./images/top/backB.png);
background-position: top;
background-repeat: no-repeat;
background-size: cover;
position: absolute;
top: -55px;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%,-50%);
width: 100vw;
height: 390px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
justify-content: center;
align-items: center;
z-index: -1;
}

#site-content-top h1:before{
content: "";
background-image: url(./images/common/search.svg);
display: inline-block;
background-repeat: no-repeat;
background-size: contain;
width: 50px;
height: 50px;
margin-right: 10px;
}


@media only screen and (max-width: 1400px){
#site-content-top h1{
background-image: url(./images/top/backBSp.png);
height: 300px;
}
}

@media only screen and (max-width: 1000px){
#site-content-top .search-content{
padding: 60px 0 0;
}

#site-content-top h1{
font-size: 2em;
height: 240px;
top: -50px;
}
}

@media only screen and (max-width: 768px){
#site-content-top h1{
font-size: 1.5em;
height: 200px;
}

#site-content-top h1:before{
width: 30px;
height: 30px;
}
}

@media only screen and (max-width: 480px){
#site-content-top h1{
font-size: 1.25em;
background-image: url(./images/top/backBSp02.png);
height: 130px;
top: -30px;
}

#site-content-top h1:before{
width: 22px;
height: 22px;
}

#site-content-top .search-content{
padding: 50px 0 0;
}

}




/*----------------------------
検索
----------------------------*/

.top-container-inner{
	max-width: 1050px;
}


/* 外枠 */
.search-form-wrap {
border-radius: 0 0 50px 50px;
background: #ffffff;
border: 16px solid #ffffff;
transition: 0.3s;
position: relative;
margin-bottom: 50px;
}

.search-form-wrap.place {
border-color: #2f5a9e;
}

.search-form-wrap.industry {
border-color: #47ac49;
}

.search-form-wrap.commitment {
border-color: #f18e1d;
}


/* タブ */
.search-tabs {
display: flex;
gap: 10px;
}

.search-tabs button {
font-size: 1.25em;
font-family: "M PLUS Rounded 1c", sans-serif;
font-weight: 500;
padding: 8px 15px;
flex: 1;
color: #ffffff;
border-radius: 16px 16px 0 0 ;
background: #ffffff;
border: 2px solid #ffffff;
cursor: pointer;
line-height: 0;
}

.search-tabs button:nth-of-type(1).active{
border: 2px solid #2f5a9e;
background: #2f5a9e;
}

.search-tabs button:nth-of-type(2).active{
border: 2px solid #47ac49;
background: #47ac49;
}

.search-tabs button:nth-of-type(3).active{
border: 2px solid #f18e1d;
background: #f18e1d;
}

.search-tabs button img{
width: 60%;
}

.search-tabs button img:last-of-type{
display: none;
}

.search-tabs button.active img:first-of-type{
display: none;
}

.search-tabs button.active img:last-of-type {
display: inline;
}



/* 検索フォーム */
.search-form-wrap form {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 18px;
padding: 25px;
}

.searchArea {width: 100%;}


/* 勤務地（画像） */
.place-group {
display: none;
}

.search-form-wrap.place .place-group {
display: flex;
gap: 20px;
align-items: flex-start;
}

.place-image {
width: 50%;
flex-shrink: 0;
}

.place-fields {
flex: 1;
}


#site-content-top .search-content h2{
background-image: url(./images/top/backR.png);
}

.search-workplace{width: 48%;}

.search-form-wrap h3,
.search-form-wrap .searchArea-free{display: none;}


/* 勤務地だけ1列 */
.search-form-wrap.place form {
grid-template-columns: 1fr;
}

.search-form-wrap.place .searchArea{
margin-bottom: 20px;
}


#clear-message {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: rgba(51, 51, 51, 0.9);
color: #ffffff;
padding: 60px 100px;
border-radius: 8px;
font-size: 16px;
z-index: 999999;
opacity: 0;
text-align: center;
visibility: hidden;
transition: opacity .3s ease;
}

#clear-message.show {
opacity: 1;
visibility: visible;
}


@media only screen and (max-width: 768px){
.search-tabs button{padding: 5px;}
.search-form-wrap{ border: 15px solid #ffffff;}
.search-form-wrap form { grid-template-columns: 1fr;}
.search-form-wrap.place .place-group {display: block;}
.place-image {width: 100%;margin-bottom: 15px;}
.search-form-wrap form{padding: 15px;}
}

@media only screen and (max-width: 520px){
.search-tabs button{ border-radius: 8px 8px 0 0;}
.search-tabs button img{width: 95%;}

.search-form-wrap{
border-radius: 0 0 30px 30px;
border: 10px solid #ffffff;
margin-bottom: 20px;
}

#clear-message {
padding: 50px 20px;
width: 80%;
}
}

@media only screen and (max-width: 480px){
.search-form-wrap.place .searchArea{margin-bottom: 12px;}
}


/* 検索フォームボタン */
#site-content-top .search-btn-area{
position: absolute;
bottom: -140px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
width: calc(100% + 30px);
}

/* 一覧ボタン */
.line-up-btn{
font-size: 1.25em;
font-weight: 600;
max-width: 350px;
width: 100%;
text-align: center;
margin: 50px auto 0;
}

.line-up-btn a{
display: block;
color: #ffffff;
background: #d0121b;
border: 5px solid #d0121b;
border-radius: 10px;
padding: 15px;
transition: ease .4s;
}

/* hover */
.line-up-btn a:hover{
transform: scale(1.05);
}

/* ボタンの色 */
.job-popular .line-up-btn a{
background: #f18e1d;
border: 5px solid #f18e1d;
}

.post-news .line-up-btn a{
background: #3071b9;
border: 2px solid #3071b9;
}


/* 全て表示する */
.search-all-btn{
font-size: 1.5em;
font-weight: 600;
max-width: 500px;
text-align: center;
margin: 150px auto 80px;
}

.search-all-btn a{
color: #3071b9;
display: block;
padding: 20px;
background: #ffffff;
border: 5px solid #3071b9;
border-radius: 10px;
cursor: pointer;
transition: ease .4s;
}

.search-all-btn a:hover{
color: #ffffff;
background: #3071b9;
}

@media only screen and (max-width: 920px){
.search-count{position: static;}
}

@media only screen and (max-width: 768px){
.search-count p{
font-size: 1em;
padding: 10px 15px;
border-radius: 15px;
}
}

@media only screen and (max-width: 520px){

#site-content-top .search-btn-area{
bottom: -180px;
width: calc(100% + 20px);
}

.line-up-btn,
.search-all-btn{
font-size: 1.125em;
}

.search-all-btn{
margin: 180px auto 20px;
}

.line-up-btn a,
.search-all-btn a{
padding: 10px;
}

.line-up-btn a{
border: 3px solid #d0121b;
}

.job-popular .line-up-btn a{
border: 3px solid #f18e1d;
}


}


/* 求人 */
.post-area h2{
font-family: "M PLUS Rounded 1c", sans-serif;
font-size: 1.85em;
font-weight: 500;
text-align: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 20px;
}

.post-area h2:before{
content: "";
display: inline-block;
background-repeat: no-repeat;
background-size: contain;
margin-right: 5px;
}

.post-area-list{margin: 0 40px;}

.post-area .slider-post .archive-post{margin: 0 4px;}

/* NEWアイコン */
.job-information .newIcon::before{
top: -42px;
}


/* タイトル装飾 */
.job-information h2{
margin-left: -40px;
}

.job-information h2::before{
background-image: url(./images/top/tit_new.svg);
width: 50px;
height: 50px;
}

.job-popular h2{
margin-left: -80px;
}

.job-popular h2::before{
background-image: url(./images/top/tit_popular.svg);
width: 100px;
height: 60px;
}

.job-resemble h2{
margin-left: -40px;
}

.job-resemble h2::before{
background-image: url(./images/top/tit_resemble.svg);
width: 50px;
height: 50px;
}



@media only screen and (max-width: 1400px){
.post-area-list{
width: 90%;
margin: 0 auto;
}
}

@media only screen and (max-width: 920px){
.post-area{justify-content: center;}
}

@media only screen and (max-width: 768px){
.archive-post{width: 49%;margin-bottom: 30px;}
}


@media only screen and (max-width: 520px){
.job-information h2{
margin-left: -20px;
}

.job-information h2::before{
width: 30px;
height: 30px;
}

.job-popular h2{
margin-left: -40px;
}

.job-popular h2::before{
width: 50px;
height: 30px;
}

.job-resemble h2{
margin-left: -25px;
}

.job-resemble h2::before{
width: 35px;
height: 35px;
}


.post-area-tit span img{width: 140px;}
.post-area-tit h3 img{width: 125px;}
.archive-post{width: 100%;}
.archive-post p{font-size:0.8em}
}


@media only screen and (max-width: 480px){
.post-area h2{font-size: 1.25em;margin-bottom: 10px;}
}


/* お知らせ */
.post-news h2{
margin-left: -50px;
}
.post-news h2::before{
background-image: url(./images/top/tit_news.svg);
width: 60px;
height: 50px;
}

.post-news ul {
background: #e6e6e6;
border: 2px solid #3071b9;
border-radius: 30px;
padding: 40px 60px;
}

.post-news ul li a{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
padding: 15px;
transition: transform 0.4s ease;
}

.post-news ul li a:hover{
transform: translateY(-8px);
}



.post-news span{
font-weight: 600;
}

.post-news span:last-of-type{
font-size: 1.125em;
color: #3071b9;
margin-left: 25px;
}

.post-news ul li{
border-top: 4px dotted #b4b4b5;
}

.post-news ul li:last-of-type{
border-bottom: 4px dotted #b4b4b5;
}


@media only screen and (max-width: 768px){
.post-news ul {
border-radius: 15px;
padding: 30px 20px;
}

.post-news ul li a{display: block;}
}

@media only screen and (max-width: 520px){
.post-news h2{
margin-left: -32px;
}

.post-news h2::before{
width: 42px;
height: 35px;
}

.post-news ul {
border-radius: 12px;
padding: 20px 15px;
}


.post-news ul li a{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
padding: 10px;
}

.post-news span{
width: 100%;
}

.post-news span:last-of-type{
font-size: 1em;
margin-left: 0;
}


}

@media only screen and (max-width: 480px){
.post-area h2{font-size: 1.25em;margin-bottom: 10px;}
}


/* shigajobについて */
.top-article {
background: #3071b9;
padding: 0 0 60px;
}

.site-about{
position: absolute;
z-index: -1;
top: 40px;
right: -20px;
width: 280px;
}

.top-article h2{
max-width: 500px;
margin: 0 auto 100px;
}


/* 共通リンク */
.page-link-inner{
max-width: 1100px;
margin: 0 auto;
}

.page-link-inner .d-flex{
margin-bottom: 1em;
}

.page-catch{
width: 38.35%;
line-height: 0;
}

.page-link-tit{
width: 61.65%;
text-align: right;
position: relative;
}

.page-link-col{
margin-bottom: 70px;
transition: ease .4s;
}

.page-link-col a{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
justify-content: center;
align-items: center;
background: #ffffff;
width: 100%;
height: 100%;
}


.page-link-col a:hover img{
opacity: 1;
}

.page-link-col:hover{
transform: scale(1.03);
}

.page-link-tit img{
width: 80%;
margin-right: 10%;
}

.page-link-tit .time-icon{
width: 150px;
position: absolute;
top: -10px;
left: -30px;
}

.page-link-tit .time-icon img{
width: 100%;
margin: 0;
}


@media only screen and (max-width: 1480px){
.site-about{
top: -20px;
right: 50px;
width: 250px;
}

.top-article h2 {
margin: 0 auto 80px;
}
}

@media only screen and (max-width: 1000px){
.page-link-tit .time-icon{
width: 120px;
}

}

@media only screen and (max-width: 920px){
.top-article h2 {
max-width: 380px;
margin: 0 auto 60px;
}

.page-link-tit a{
padding: 25px;
}

}

@media only screen and (max-width: 768px){
.page-link-col{
margin-bottom: 30px;
}

.page-link-tit .time-icon{
width: 80px;
top: 5px;
left: -10px;
}


}

@media only screen and (max-width: 620px){
.site-about{
right: 50px;
width: 200px;
}
}

@media only screen and (max-width: 520px){
.page-catch,
.page-link-tit{
width: 100%;
}

.page-link-tit{
padding: 5px;
}

.page-link-tit img{
margin-right: 7%;
}

.page-link-tit .time-icon{
top: -10px;
left: 10px;
}

}


@media only screen and (max-width: 480px){
.site-about{
right: 20px;
width: 150px;
}

.top-article h2 {
max-width: 280px;
margin: 0 auto 12px;
}


.page-link-tit .time-icon{
top: -30px;
left: 5px;
}


}


/* トップの背景 */
#site-content-top .search-content,
.job-popular{
background: #e6e6e6;
position: relative;
}

.job-information{
padding: 160px 0 300px;
}

.container-inner{
position: relative;
z-index: 1;
}

.site-area{
position: relative;
}

.post-news{
padding: 260px 0 270px;
}

.site-area::before{
content: "";
background-repeat: no-repeat;
background-size: cover;
position: absolute;
left: 0;
right: 0;
}


.site-area-1::before{
background-image: url(./images/top/backB02.png);
background-position: bottom;
top: -500px;
height: 600px;
}


.site-area-2::before{
background-image: url(./images/top/backB03.png);
top: -300px;
height: 400px;
}

.site-area-3::before{
background-image: url(./images/top/backB04.png);
bottom: -400px;
height: 400px;
}

.site-area-4::before{
background-image: url(./images/top/backB05.png);
top: -380px;
height: 630px;
}


@media only screen and (max-width: 1480px){

.job-information {
padding: 160px 0 260px;
}

.post-news{
padding: 200px 0 250px;
}

.site-area-2::before{
top: -250px;
left: -160px;
height: 350px;
background-size: contain;
}

.site-area-3::before{
bottom: -340px;
left: -100px;
height: 350px;
background-size: contain;
}

.wrapper-back .job-popular .site-area-3::before{
bottom: -370px;
}



}

@media only screen and (max-width: 1000px){
.job-information{padding: 90px 0 150px;}
.post-news {padding: 140px 0 200px;}

.site-area-1::before{
background-image: url(./images/top/backB02Sp.png);
top: -300px;
height: 380px;
}

.site-area-2::before{
background-image: url(./images/top/backB03Sp.png);
left: 0;
top: -170px;
height: 240px;
background-size: cover;
}

.site-area-3::before{
background-image: url(./images/top/backB04Sp.png);
bottom: -180px;
left: 0;
height: 300px;
background-size: cover;
}

.wrapper-back .job-popular .site-area-3::before{
bottom: -240px;
}


.site-area-4::before{
background-image: url(./images/top/backB05Sp.png);
top: -175px;
height: 300px;
}
}

@media only screen and (max-width: 750px){
.job-information{padding: 60px 0 150px;}
.post-news {padding: 110px 0 200px;}

.site-area-1::before{
top: -170px;
height: 220px;
}
}

@media only screen and (max-width: 480px){

.job-information{padding: 60px 0 100px;}
.post-news {padding: 80px 0 100px;}
.job-popular{padding: 0 0 20px;}

.job-information .container-inner,
.job-popular .container-inner,
.job-resemble .container-inner{
width: 87%;
}


.site-area-1::before{
top: -160px;
height: 190px;
}

.site-area-2::before{
top: -90px;
height: 120px;
}

.site-area-3::before{
bottom: -120px;
height: 170px;
}

.wrapper-back .job-popular .site-area-3::before{
bottom: -180px;
}


.site-area-4::before{
top: -90px;
height: 200px;
}
}


/* ------------------------------------------------
fixity
------------------------------------------------
*/ 

.mainImg img{
width: 100%;
}

.mainImg-display{
position: relative;
}

.mainImg-display::before{
content: "";
background-image: url(./images/page/backF01.png);
display: inline-block;
background-repeat: no-repeat;
background-position: bottom;
background-repeat: no-repeat;
background-size: cover;
position: absolute;
bottom: -205px;
left: 0;
right: 0;
height: 380px;
}


.fixity .content-wrapper{
border-radius: 30px;
padding: 60px 80px;
}

.fixity-tit{
font-family: "Oswald", sans-serif;
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;
font-size: 3.5em;
letter-spacing: 0.2em;
color: #3071b9;
padding: 50px 0 60px;
text-align: center;
}


.fixity-tit.fixity-tit-ja {
font-family: "Noto Sans JP", sans-serif;
font-size: 2.5em;
font-weight: 600;
}


.fixity h2{
font-family: "M PLUS Rounded 1c", sans-serif;
font-weight: 500;
font-style: normal;
border-bottom: 4px solid #d0121b;
padding-bottom: 0.5em;
margin-bottom: 2em;
}

.fixity-col{
margin-bottom: 50px;
}

.fixity-col h3{
border-left: 6px solid #d0121b;
padding: 0.5em 0 0.5em 1em;
margin-bottom: 1em;
}

.fixity-col ul li{
padding-left: 1em;
text-indent: -1em;
}

.fixity-col ul li ul{
margin-left: 1em;
}

.fixity-col p{
margin-bottom: 0.5em;
}


@media only screen and (max-width: 1300px) {
.mainImg-display::before{
background-image: url(./images/page/backF01Ip.png);
height: 180px;
bottom: -100px;
}

}


@media only screen and (max-width: 1100px) {
.fixity-tit{
font-size: 3em;
padding: 20px 0 50px;
}

}

@media only screen and (max-width:768px) {
.fixity .content-wrapper{padding: 30px 40px;}

.mainImg-display::before{
background-image: url(./images/page/backF01Sp.png);
height: 180px;
bottom: -40px;
}

.fixity-tit{
font-size: 2.5em;
padding: 10px 0 30px;
}
}


@media only screen and (max-width:520px) {
.mainImg-display::before{
height: 120px;
bottom: -50px;
}

.fixity .content-wrapper{
border-radius: 20px;
padding: 30px 20px;
}

.fixity-tit{
font-size: 1.75em;
}

.fixity-tit.fixity-tit-ja{
font-size: 1.25em;
padding: 10px 0 20px;
}

.mp-terms-modal-body h2{
font-size: 1em;
}

.fixity-col h3{
font-size: 0.825em;
padding: 0.2em 0 0.2em 0.5em;
margin-bottom: 0.5em;
}

.fixity-col ul li,
.fixity-col p{
	font-size: 0.75em;
	line-height: 1.4em;
}

}




/*----------------------------
プライバシーポリシー 
----------------------------*/
.privacy{padding-bottom: 0!important;}


.company-area{
background: #92c6ec;
padding: 100px 0;
position: relative;
}

.company-area::before{
content: "";
display: inline-block;
background-image: url(./images/page/backF02.png);
background-repeat: no-repeat;
background-size: cover;
position: absolute;
top: -200px;
left: 0;
right: 0;
height: 250px;
}

.company-area h3{
font-size: 2em;
color: #d0121b;
text-align: center;
margin-bottom: 50px;
}

.company-area h3::before{
content: "";
display: inline-block;
background-image: url(./images/common/logo02.svg);
background-repeat: no-repeat;
background-size: contain;
width: 330px;
height: 66px;
margin-right: 10px;
vertical-align: middle;
}


.company-area dl{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}

.company-area dl dt,
.company-area dl dd{
font-weight: 600;
padding: 15px;
}

.company-area dl dt{
width: 22%;
border-bottom: 3px solid #d0121b;
}

.company-area dl dd{
width: 78%;
border-bottom: 3px solid #ffffff;
}


.siteBtn{
font-size: 1.25em;
font-weight: 600;
max-width: 500px;
margin: 50px auto 0;
text-align: center;
}

.siteBtn a{
color: #ffffff;
display: block;
border: 2px solid #3071b9;
background: #3071b9;
padding: 15px;
border-radius: 15px;
transition: ease .4s;
}

.siteBtn a:hover{
opacity: .6;
}


.siteBtn a::after{
content: "▶︎";
margin-left: 15px;
}


@media only screen and (max-width:520px) {
.company-area h3{
font-size: 1.5em;
margin-bottom: 30px;
}

.company-area h3::before{
width: 220px;
height: 44px;
margin-right: 10px;
}
}


@media only screen and (max-width:480px) {
.company-area{padding: 30px 0 50px;}
.company-area dl dt, .company-area dl dd {
font-size: 0.75em;
line-height: 1.4em;
padding: 10px;
}

.siteBtn{
font-size: 1em;
margin: 30px auto 0;
}

.siteBtn a{padding: 10px;}
}


/*----------------------------
よくある質問
----------------------------*/
.faq-inner{
max-width: 1100px;
margin: 0 auto;
}


.faq h2{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
align-items: center;
}

.faq h2::before{
content: "";
display: inline-block;
background-image: url(./images/common/logo02.svg);
background-repeat: no-repeat;
background-size: contain;
width: 170px;
height: 35px;
margin-right: 10px;
}


.faq h3{
margin-bottom: 20px;
}

.faq h3::before{
content: "";
display: inline-block;
background: #d0121b;
width: 16px;
height: 16px;
border-radius: 50%;
margin-right: 5px;
}

.faq .col3{
font-size: 1.125em;
font-weight: 600;
text-align: center;
transition: ease .4s;
}

.faq .col3 a{
display: block;
color: #ffffff;
background: #1274cc;
padding: 20px;
border-radius: 15px;
transition: ease .4s;
position: relative;
}

.faq .col3 a::after{
content: "";
position: absolute;
top: 5px;
left: 5px;
right: 5px;
bottom: 5px;
border: 2px solid #ffffff;
border-radius: 10px;
pointer-events: none;
}

.faq .col3:hover{
transform: scale(1.05);
}


.faq h4{
color: #ffffff;
background: #717071;
padding: 15px 20px;
position: relative;
border-radius: 50px;
}

.faq h4::before{
content: "";
display: inline-block;
background: #d0121b;
width: 16px;
height: 16px;
border-radius: 50%;
margin-right: 10px;
}

.faq h5{
color: #ffffff;
font-weight: 600;
background: #1274cc;
padding: 15px;
border-radius: 15px;
margin-bottom: 20px;
}

.faq-col{
padding-top: 40px;
}

.faq-col a{
color: #d0121b;
text-decoration: underline;
transition: ease .4s ;
}

.faq dl{
margin-bottom: 20px;
}

.faq dt,
.faq dd{
font-weight: 600;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
align-items: center;
}

.faq dt::before,
.faq dd::before{
font-family: "Oswald", sans-serif;
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;
font-size: 3em;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
justify-content: center;
align-items: center;
line-height: 0;
width: 70px;
height: 70px;
background: #ffffff;
border-radius: 50%;
margin-right: 15px;
}

.faq dt::before{
content: "Q";
color: #3071b9;
}

.faq dd::before{
content: "A";
color: #d0121b;
}

.faq dl span{
width: 95%;
}

.faq dt {
padding: 20px;
background: #e6e6e6;
margin-bottom: 0.5em;
border-radius: 10px 10px 0 0;
cursor: pointer;
position: relative;
}

.faq dt::after {
content: "";
position: absolute;
right: 20px;
top: 50%;
width: 15px;
height: 15px;
border-right: 2px solid #717071;
border-bottom: 2px solid #717071;
transform: translateY(-70%) rotate(45deg); /* ∨ */
transition: transform .3s;
}

.faq dt.active::after {
transform: translateY(-30%) rotate(-135deg); /* ∧ */
}

.faq dd {
background: #d5edfe;
padding: 0 20px;
border-radius: 0 0 10px 10px;
max-height: 0;
overflow: hidden;
transition: ease .4s ;
}

.faq dd.open {
max-height: 600px; /* コンテンツに合わせて調整 */
padding: 20px;
}



@media only screen and (max-width:920px) {
.faq dt::before, 
.faq dd::before {
font-size: 2.5em;
width: 55px;
height: 55px;
}
}


@media only screen and (max-width:620px) {
.faq dt,
.faq dd{
font-size: 0.875em;
}

.faq dl span{
width: 78%;
}

.faq dt::before, 
.faq dd::before {
font-size: 1.75em;
width: 38px;
height: 38px;
margin-right: 6px;
}

.faq dt{padding: 15px;}

.faq dt::after {
right: 15px;
width: 10px;
height: 10px;
}

.faq dd {
align-items: flex-start;
padding: 0 15px;
border-radius: 0 0 10px 10px;
}
.faq dd.open {padding: 15px;}
.faq dd span{width: 90%;}
}


@media only screen and (max-width:480px) {
.faq h2::before{
width: 120px;
height: 24px;
}

.faq .col3 a{
padding: 15px;
}

.faq h4{
font-size: 1em;
}

.faq h4:after{
content: none;
}

.faq h5{
font-size: 0.875em;
}

.faq .col3{font-size: 1em;}

.faq dt::before, 
.faq dd::before {
font-size: 1.5em;
width: 30px;
height: 30px;
}


}



/*----------------------------
LP共通箇所
----------------------------*/

/* タイトル */
.lp h2,.lp h3,.lp h4,.lp p,.lp dl{
color: #666666;
}

.lp section{
margin-bottom: 150px;
}

.lp section p{
font-size: 1.25em;
line-height: 1.8em;
margin: 1em 0 0;
}

.search-btn{
font-family: "M PLUS Rounded 1c", sans-serif;
font-weight: 500;
font-style: normal;
font-size: 1.75em;
text-align: center;
transition: ease .4s;
}

.search-btn a{
color: #ffffff;
display: block;
padding: 40px;
background: #1274cc;
border-radius: 20px;
}

.search-btn:hover{
transform: scale(1.05);
}

.search-btn a::before{
content: "";
background-image: url(./images/common/search.svg);
display: inline-block;
background-repeat: no-repeat;
background-size: contain;
width: 30px;
height: 30px;
margin-right: 10px;
vertical-align: middle;
transform: rotate(270deg);
}

.lp .search-btn{
font-size: 2.375em;
max-width: 500px;
margin: 0 auto;
}

.lp section p.notes{
font-size: 0.875em;
line-height: 1.4em;
padding-left: 0.6em;
text-indent: -0.6em;
margin: 2em 0 0; 
}

.lp section p.notes + p.notes {
margin: 0;
}

@media only screen and (max-width:1200px) {
.lp section p{
font-size: 1.125em;
}


}


@media only screen and (max-width:768px) {
.lp section{margin-bottom: 80px;}

.search-btn{
font-size: 1.5em;
}

.search-btn a{
padding: 30px;
border-radius: 12px;
}

.lp section .search-btn{
font-size: 1.75em;
}

}


@media only screen and (max-width:480px) {
.lp section p {
font-size: 1em;
}

.search-btn{
font-size: 1em;
}

.search-btn a{
padding: 20px 15px;
border-radius: 12px;
}

.search-btn a::before{
width: 20px;
height: 20px;
}

.lp section .search-btn{
font-size: 1.25em;
}

.lp section p.notes{
margin: 1em 0 0; 
}

.lp section.job-support .job-support-inner {
border: 2px solid #1274cc;
border-top: 20px solid #1274cc;
padding: 30px 20px;
margin: 20px 0;
}

.commitment section.job-support .job-support-inner{
background: #ffffff;
}


}

/* footer付近 */
.works-link{
background: #92c6ec;
position: relative;
text-align: center;
padding: 40px 0 100px;
margin: 250px 0 0;
}

.works-link::before{
content: "";
display: inline-block;
background-image: url(./images/page/backF02.png);
background-repeat: no-repeat;
background-size: cover;
position: absolute;
top: -180px;
left: 0;
right: 0;
height: 250px;
}

.works-link-col{
width: 49%;
margin-bottom: 30px;
}


.works-link-col .page-link-tit .time-icon {
width: 90px;
top: 0;
left: -25px;
}

@media only screen and (max-width:1200px) {
.works-link-col .page-link-tit .time-icon {
width: 60px;
top: 0;
left: -10px;
}
}

@media only screen and (max-width:920px) {
.works-link{
margin: 150px 0 0;
padding: 20px 0 50px;
}

.works-link::before{
top: -140px;
height: 180px;
}

.works-link-area{
margin: 30px auto;
}

.works-link-col{
width: 100%;
}

}

@media only screen and (max-width:520px) {
.works-link{
margin: 120px 0 0;
padding: 0 0 20px;
}

.works-link::before{
top: -70px;
height: 80px;
}

.works-link-col .page-link-tit .time-icon {
width: 80px;
top: -30px;
left: 5px;
}
}



/*-----------------------
カスタム背景白の場合
----------------------------*/
.lp-back{
position: relative;
background: #ffffff;
}

.lp-back .mainImg-display::before{
background-image: url(./images/page/backF03.png);
}

@media only screen and (max-width: 1100px) {
.lp-back .mainImg-display::before{
background-image: url(./images/page/backF03Ip.png);
}
}

@media only screen and (max-width:768px) {
.lp-back .mainImg-display::before{
background-image: url(./images/page/backF03Sp.png);
}

}


/*----------------------------
お仕事探し
----------------------------*/


.works h1{
max-width: 1100px;
margin: 0 auto 80px;
text-align: center;
position: relative;
}

.works h1 img{
max-width: 680px;
}

.works h1::after{
content: "";
background-image: url(./images/page/works_step.svg);
display: inline-block;
background-repeat: no-repeat;
background-position: bottom;
width: 180px;
height: 180px;
position: absolute;
top: -50px;
right: 0;
}

.works section{
position: relative;
}

.works section::after{
content: "";
display: inline-block;
background: #eae9e8;
height: 300px;
width: 100%;
position: absolute;
bottom: 12%;
left: 0;
}


.works section h2{
font-size: 2.5em;
line-height: 1.4em;
position: relative;
margin: 0;
height: 320px;
display: flex;
align-items: center;
}

.works section h2::after{
content: "";
background-image: url(./images/page/works_step01.svg);
display: inline-block;
background-repeat: no-repeat;
background-position: bottom;
width: 350px;
height: 260px;
position: absolute;
top: 50%;
right: 0;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
z-index: -1;
}

.works section:nth-of-type(2) .col2 h2::after{
background-image: url(./images/page/works_step02.svg);
}

.works section:nth-of-type(3) .col2 h2::after{
background-image: url(./images/page/works_step03.svg);
}

.works section:nth-of-type(4) .col2 h2::after{
background-image: url(./images/page/works_step04.svg);
}


.works section p span {
font-weight: 600;
background-color: rgba(255, 255, 0, 0.7);
}


.works section .col2.search-btn {
font-size: 1.25em;
text-align: center;
margin: 30px 0 0;
}

.works section .col2.search-btn a{
border-radius: 10px;
padding: 15px;
}

.works section .col2.search-btn a::before{
width: 22px;
height: 22px;
margin-right: 5px;
}


.works section .col2 img:last-of-type{
display: none;
}


.works section.job-support{
text-align: center;
padding: 0 0 50px;
}

.works .job-support-inner{
max-width: 1200px;
margin: 0 auto;
}

.works .arrow{
max-width: 200px;
margin: 0 auto;
}

.works section.job-support h3{
font-family: "Oswald", sans-serif;
font-optical-sizing: auto;
font-weight: 600;
font-size: 7em;
color: #d5edfe;
line-height: 1;
position: relative;
}

.works section.job-support h3::before{
content: "";
background: #ffff00;
height: 20px;
width: 60%;
position: absolute;
bottom: -10px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
z-index: -1;
}


.works section.job-support h4{
font-family: "M PLUS Rounded 1c", sans-serif;
font-weight: 500;
font-style: normal;
font-size: 2.5em;
color: #1274cc;
margin: 30px 0;
line-height: 1;

}

.works section.job-support p{
font-size: 1.75em;
line-height: 1.6em;
margin-bottom: 1em;
}

.works section.job-support::after{
height: 700px;
bottom: 7%;
}


.works section.job-support .job-support-point{
max-width: 1000px;
margin: 30px auto;
border-radius: 30px;
padding: 20px;
}

.works section.job-support ul{
margin-bottom: 40px;
}

.works section.job-support ul li{
font-size: 1.375em;
color: #1274cc;
font-weight: 600;
width: 30%;
background: #ffffff;
border-radius: 15px;
padding: 40px 25px;
line-height: 1.4em;
display: flex;
justify-content: center;
align-items: center;
margin: 0;
box-shadow: 0 4px 12px rgba(74, 144, 226, 0.15);
}



@media only screen and (max-width:1400px) {
.works h1 img{
max-width: 520px;
}

.works section h2{
font-size: 2em;
height: 250px;
}

.works section h2::after{
width: 280px;
height: 208px;
}

}

@media only screen and (max-width:1200px) {
.works section::after{
bottom: 4%;
}

}

@media only screen and (max-width:1100px) {
.works section::after{
height: 280px;
}

.works section h2{
font-size: 1.5em;
height: 200px;
}

.works section h2::after{
width: 200px;
height: 150px;
}

.works section.job-support::after{
height: 500px;
bottom: 7%;
}

}

@media only screen and (max-width:980px) {
.works h1{
margin: 0 auto 80px;
}

.works h1::after{
width: 140px;
height: 140px;
top: -30px;
}


.works section::after{
bottom: -8%;
height:350px;
}

.works section h2{
font-size: 1.5em;
height: 200px;
}

.works section h2::after{
width: 200px;
height: 150px;
}

.works section .col2.search-btn{
font-size: 1em;
}

.works section .col2.search-btn a::before{
width: 18px;
height: 18px;
}

.works section.job-support h3{
font-size: 6em;
}

.works section.job-support h3::before{
width: 80%;
}


.works section.job-support h4{
font-size: 2em;
margin: 30px 0;
}

.works section.job-support p{
font-size: 1.375em;
line-height: 1.6em;
}

.works section.job-support ul li{
font-size: 1.125em;
padding: 30px 15px;
}


.works section.job-support::after{
height: 500px;
bottom: 7%;
}

}


@media only screen and (max-width:768px) {
.works h1{
margin: 20px auto 50px;
}

.works h1::after{
width: 100px;
height: 100px;
top: -92px;
right: 12%;
}


.works section::after{
content: none;
}

.works section{
width: 100%;
}

.works .job-content{
background: #eae9e8;
padding: 20px;
}

.works section .col2 img:first-of-type{
display: none;
}

.works section .col2 img:last-of-type{
display: inherit;
}

.works section p{
margin: 0;
}


.works section .col2.search-btn{
width: 50%;
}

.works .arrow {
max-width: 150px;
}

.works section.job-support h3{
font-size: 4.5em;
}

.works section.job-support h3::before{
width: 92%;
}


.works section.job-support h4{
font-size: 2em;
}

.works section.job-support p{
font-size: 1.375em;
}

.works section.job-support p::after{
width: 200px;
height: 105px;
}


.works section.job-support::after{
content: "";
height: 500px;
bottom: 8%;
}


}

@media only screen and (max-width:480px) {
.works section.job-support{
padding: 0;
}

.works h1{
margin: 10px auto 30px;
}

.works h1::after{
width: 70px;
height: 70px;
top: -70px;
right: 8%;
}

.works section h2{
font-size: 1.25em;
height: 150px;
}

.works section h2::after{
width: 140px;
height: 104px;
}

.works section .col2.search-btn{
width: 80%;
margin: 20px auto 0;
}

.works .arrow {
max-width: 120px;
}

.works section.job-support h3{
font-size: 2.5em;
}

.works section.job-support h3::before{
height: 12px;
}

.works section.job-support h4{
font-size: 1.375em;
margin: 20px 0;
}
.works section.job-support p{
font-size: 1em;
}

.works section.job-support p br{
display: none;
}

.works section.job-support .job-support-point{
margin: 0;
}

.works section.job-support ul{
margin: 0;
}

.works section.job-support ul li{
font-size: 1em;
width: 100%;
padding: 15px 15px;
margin-bottom: 30px;
background: #d5edfe;	
}

.works section.job-support::after{
content: none;
}


}


/*----------------------------
雇用形態
----------------------------*/
.employment-logo{
max-width: 380px;
margin: 20px auto -30px;
}

.employment-type{
background: #eae9e8;
padding: 60px 0 80px;
}

.employment-type-inner {
position: relative;
border: 10px solid #ffffff;
border-radius: 40px;
padding: 0 70px 70px;
}


/* 丸ポチ(左右の端点) */
.employment-type-main-tit{
position: absolute;
top: -22px;
left: 50%;
transform: translateX(-50%);
background: #eae9e8;
padding: 0 15px;
width: 80%;
margin: 0 auto;
}

/* タイトルの左右から伸びる線 */
.employment-type-main-tit::before,
.employment-type-main-tit::after {
content: "";
position: absolute;
top: 6px;
width: 20px;
height: 20px;
background: #fff;
border-radius: 50%;

}

.employment-type-main-tit::before { left: -5px; }
.employment-type-main-tit::after  { right: -5px;}


.employment-type h2{
font-family: "M PLUS Rounded 1c", sans-serif;
font-weight: 500;
font-style: normal;
font-size: 3em;
line-height: 1;
letter-spacing: 0.08em;
color: #1274cc;
text-align: center;
position: relative;
width: 90%;
margin: 0 auto;
}

.employment-type h2::before,
.employment-type h2::after{
position: absolute;
content: "";
background-image: url(./images/page/employment_tit_dec01.png);
display: inline-block;
background-repeat: no-repeat;
background-size: contain;
width: 130px;
height: 180px;
top: -80px;
vertical-align: middle;
}

.employment-type h2::before{
left: 0;
}

.employment-type h2::after{
background-image: url(./images/page/employment_tit_dec02.png);
right: 0;
}

.employment-type .d-flex{
margin-top: 130px;
}

.employment-type-col{
width: 30%;
background: #ffffff;
position: relative;
padding: 50px 20px;
border-radius: 30px;
}

.employment-type-tit{
position: absolute;
top: -10%;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
width: 110%;
}

.employment-type h3{
font-size: 1.375em;
color: #ffffff;
font-weight: 400;
background: #009245;
padding: 15px 15px 15px 100px;
line-height: 1.6em;
border-radius: 15px;
margin: 0;
position: relative;
}

.employment-type-col:nth-of-type(2) h3{
background: #f7931e;
}

.employment-type-col:nth-of-type(3) h3{
background: #1274cc;
}

.employment-type h3 span{
font-size: 1.3em;
font-weight: 600;
}

.employment-type h3::before {
content: "";
background-image: url(./images/page/employment_a.svg);
display: inline-block;
background-repeat: no-repeat;
vertical-align: middle;
width: 70px;
height: 70px;
position: absolute;
top: 15px;
left: 20px;
}

.employment-type-col:nth-of-type(2) h3::before{
background-image: url(./images/page/employment_b.svg);
}

.employment-type-col:nth-of-type(3) h3::before{
background-image: url(./images/page/employment_c.svg);
}


.employment-type ul li{
font-size: 1.125em;
font-weight: 600;
display: flex;
align-items: center;
margin: 0.7em 0 0;
}

.employment-type ul li::before{
content: "";
display: inline-block;
background-image: url(./images/page/employment_check.svg);
background-repeat: no-repeat;
background-size: contain;
padding-left: 25px;
height: 21px;
margin-right: 10px;
vertical-align: middle;
}

.employment-type p{
font-weight: 600;
text-align: center;
margin: 0;
}

.employment-type-btn{
font-size: 1.75em;
font-weight: 600;
position: absolute;
bottom: -4%;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
width: 100%;
text-align: center;
width: 80%;
color: #ffffff;
background: #6dcc6d;
padding: 15px;
border-radius: 50px;
display: flex;
align-items: center;
justify-content: center;
transition: ease .4s;
}


.employment-type-col:nth-of-type(2) .employment-type-btn{
background: #ffaf10;
}

.employment-type-col:nth-of-type(3) .employment-type-btn{
background: #43a2e8;
}

.employment-type-col a:hover img{
opacity: 1;
}

.employment-type-col a:hover .employment-type-btn{
bottom: -1%;
}

.employment-type-btn:after{
content: "";
display: inline-block;
background-image: url(./images/page/arrow.svg);
background-repeat: no-repeat;
background-size: contain;
width: 25px;
height: 22px;
margin-left: 8px;
vertical-align: middle;
}


/* 派遣社員 */
.employment section{
background: #bae8ba;
padding: 0 50px;
margin-top: 80px;
}

.employment section .container-inner{
max-width: 1400px;
padding: 0 80px 30px;
background: #ffffff;
}

.employment section .employment-tit{
background: #bae8ba;
text-align: center;
width: 96.8%;
height: 120px;
display: flex;
align-items: center;
flex-wrap: wrap;
justify-content: center;
align-items: center;
position: relative;
margin: 0 auto 50px;
}

.employment section .employment-tit::before,
.employment section .employment-tit::after{
content: "";
background-image: url(./images/page/employment_dL.svg);
display: inline-block;
background-repeat: no-repeat;
background-size: contain;
width: 88px;
height: 120px;
margin-right: 5px;
vertical-align: middle;
position: absolute;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
}

.employment section .employment-tit::before{
left: -2%;
}

.employment section .employment-tit::after{
right: -2%;
background-image: url(./images/page/employment_dR.svg);
}

.employment-comment{
position: absolute;
width: 280px;
left: 50px;
z-index: 2;
}


.employment section .employment-tit p{
font-size: 1.375em;
line-height: 1;
margin: 0 0 0.3em;
}

.employment section .employment-tit h2{
font-size: 3em;
font-weight: 800;
color: #009245;
line-height: 1;
margin: 0;
}

.employment section .employment-tit-inner{
position: relative;
}

.employment section .employment-tit-inner::before {
content: "";
background-image: url(./images/page/employment_a.svg);
display: inline-block;
background-repeat: no-repeat;
vertical-align: middle;
width: 80px;
height: 80px;
position: absolute;
left: -90px;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
}


.employment section .employment-human{
width: 35%;
}

.employment-col{
width: 65%;
border: 2px solid #d0121b;
border-radius: 40px;
}

.employment-col h3{
width: 450px;
line-height: 0;
margin: 0;
}

.employment-col .employment-col-inner{
padding: 30px 40px 0;
}

.employment-col dl{
border-left: 7px solid #d0121b;
padding-left: 10px;
margin-bottom: 45px;
}

.employment-col dl dt{
font-size: 1.375em;
font-weight: 600;
line-height: 1.3em;
margin-bottom: 0.2em;
}

.employment-col dd{
font-size: 1.125em;
line-height: 1.6em;
}

.employment-col dd span img{
width: 26px;
line-height: 0;
margin-top: -5px;
vertical-align: middle;
}

.employment-flow{
background: #eae9e8;
text-align: center;
border-radius: 30px;
padding: 30px 0;
margin-top: 50px;
}

.employment .search-btn{
font-size: 1.75em;
max-width: 500px;
margin: 50px auto;
}

.employment .search-btn a{
position: relative;
background: #1274cc;
}

.employment .search-btn a::after {
content: "";
position: absolute;
top: 10px;
left: 10px;
right: 10px;
bottom: 10px;
border: 3px solid #ffffff;
border-radius: 15px;
pointer-events: none;
}


#dispatch .employment-flow img{
margin-right: 10%;
}


/* 紹介予定派遣 */
section#introduction,
section#introduction .employment-tit{
background: #f9d493;
}

section#introduction .employment-tit-inner::before{
background-image: url(./images/page/employment_b.svg);
}

section#introduction .employment-tit::before{
background-image: url(./images/page/employment_sL.svg);
}

section#introduction .employment-tit::after{
background-image: url(./images/page/employment_sR.svg);
}

section#introduction .employment-tit h2{
color: #f15a24;
}

section#introduction .employment-comment{
left: auto;
right: 80px;
}


/* 直接雇用 */
section#direct,
section#direct .employment-tit{
background: #c7e6f9;
}

section#direct .employment-tit-inner::before{
background-image: url(./images/page/employment_c.svg);
}

section#direct .employment-tit::before{
background-image: url(./images/page/employment_tL.svg);
}

section#direct .employment-tit::after{
background-image: url(./images/page/employment_tR.svg);
}

section#direct .employment-tit p{
margin: 0 0 0.7em;
}

section#direct .employment-tit h2{
line-height: 0.62em;
color: #1274cc;
}

section#direct .employment-tit h2 span{
font-size: 0.45em;
}

@media only screen and (max-width:1400px) {
.employment-type h3{
font-size: 1em;
padding: 15px 15px 15px 90px;
}
.employment-type h3::before{
width: 60px;
height: 60px;
}


}


@media only screen and (max-width:1300px) {
.employment-type-col{
border-radius: 20px;
}

.employment-type h2{
font-size: 2.5em;
width: 95%;
}

.employment-type h2::before,
.employment-type h2::after{
width: 100px;
height: 138px;
top: -45px;
}


.employment-type ul li{
font-size: 1.125em;
}

.employment-type p{
font-size: 1em;
}

.employment-type p br{
display: none;
}

.employment-type-btn{
font-size: 1.375em;
}

.employment-type-btn a::after{
width: 20px;
height: 18px;
}

.employment-comment{
left: -50px;
}

section#introduction .employment-comment{
right: -40px;
}

}


@media only screen and (max-width:1100px) {
.employment-type h2{
font-size: 2em;
}

.employment section .employment-tit-inner::before {
width: 60px;
height: 60px;
}

.employment-type-main-tit{
width: 90%;
}

.employment-type h2::before,
.employment-type h2::after{
width: 100px;
height: 138px;
top: -50px;
}



.employment-type .d-flex{
margin-top: 100px;
}

.employment section .container-inner{
padding: 0 40px 20px;
}

.employment section .employment-tit{
height: 80px;
}

.employment section .employment-tit::before, 
.employment section .employment-tit::after{
width: 58px;
height: 80px;
}

.employment section .employment-tit p{
font-size: 1.125em;
}

.employment-comment{
width: 200px;
}

.employment section .employment-tit h2{
font-size: 2em;
}

.employment-col{
border-radius: 25px;
}

.employment-col h3{
width: 350px;
}

.employment-col .employment-col-inner{
padding: 20px 30px 0;
}

.employment-col dl{
margin-bottom: 25px;
}


.employment-col dl dt{
font-size: 1.25em;
}

.employment-col dd{
font-size: 1.125em;
}
}


@media only screen and (min-width: 921px) and (max-width: 1100px) {
.employment-type-col{
padding: 30px 30px 40px;
}

.employment-type h3{
font-size: 0.75em;
}

.employment-type h3::before{
top: 5px;
}

.employment-type ul li{
font-size: 1em;
}

.employment-type p{
font-size: 0.875em;
line-height: 1.6em;
}

.employment-type-btn{
font-size: 1.25em;
padding: 10px;
}


.employment-type-btn:after{
width: 20px;
height: 18px;
}
}

@media only screen and (min-width: 521px) and (max-width: 920px)  {
.employment-type-col{
width: 100%;

padding: 50px 20px 60px;
margin-bottom: 100px;
}

.employment-type-col a{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
}

.employment-type-col:last-of-type{
margin-bottom: 0;
}

.employment-type-tit{
width: 60%;
}

.employment-type ul{
width: 48%;
}

.employment-type ul li{
font-size: 1.125em;
}

.employment-type img{
width: 50%;
}

.employment-type p{
font-size: 1em;
text-align: center;
margin: 1.5em 0 0;
width: 100%;
}

.employment-type-btn{
width: 50%;
bottom: -7%;
}

.employment-type-btn:after{
width: 20px;
height: 18px;
}

}

@media only screen and (max-width: 768px) {
.employment-type-inner {
border: 5px solid #ffffff;
padding: 0 30px 30px;
}

.employment-type h2{
font-size: 1.75em;
line-height: 1.1em;
width: 50%;
}


.employment-type-main-tit{
width: 90%;
}

.employment-type-main-tit::before, 
.employment-type-main-tit::after{
width: 15px;
height: 15px;
top: 10px;
}


.employment-type h2::before,
.employment-type h2::after{
top: -20px;
width: 80px;
height: 110px;
}

.employment-type h2::before{
left: -100px;
}

.employment-type h2::after{
right: -100px;
}

.employment section{
padding: 0 20px;
}
.employment section .container-inner{
padding: 0 15px 20px;
}

.employment section .employment-tit{
margin: 0 auto 20px;
}

.employment section .employment-tit h2{
font-size: 1.5em;
}

.employment section .employment-tit p{
font-size: 1em;
}

.employment section .employment-tit-inner::before {
width: 50px;
height: 50px;
left: -60px;
}

.employment-comment{
width: 120px;
left: -30px;
}

section#introduction .employment-comment{
right: -30px;
}

.employment section .employment-human{
width: 60%;
margin: 0 auto 20px;
}

.employment section .employment-human img{
width: 100%;
height: 280px;
object-fit: cover;
object-position:top;
}

.employment section .employment-col{
width: 100%;
}

.employment-flow{
margin-top: 30px;
}

.employment .search-btn{
margin: 30px auto;
}

.employment .search-btn a::after {
top: 5px;
left: 5px;
right: 5px;
bottom: 5px;
border: 2px solid #ffffff;
border-radius: 10px;
}

.employment-flow{
border-radius: 18px;
padding: 22px 0;
}

#dispatch .employment-flow img{
width: 80%;
}

#introduction .employment-flow{
padding: 0;
}

}




@media only screen and (max-width:520px) {
.employment-logo{
max-width: 220px;
margin: 10px auto -40px;
}

.employment-type{
padding: 60px 0 50px;
}

.employment-type-inner {
border-radius: 20px;
padding: 0 20px 40px;
}


.employment-type-main-tit{
position: inherit;
background: none;
transform:inherit;
top: 0;
left: 0;
padding: 30px 0 20px;
width: 100%;
}

.employment-type-main-tit::before,
.employment-type-main-tit::after{
content: none;
}

.employment-type h2{
font-size: 1.25em;
width: 100%;
}

.employment-type h2::before,
.employment-type h2::after{
width: 40px;
height: 55px;
top: -55px;
}

.employment-type h2::before{
left: -20px;
}

.employment-type h2::after{
right: -20px;
}

.employment-type .d-flex{
margin-top: 30px;
}

.employment-type-col{
width: 100%;
margin-bottom: 80px;
padding: 50px 15px;
}

.employment-type h3{
padding: 10px 10px 10px 50px;
}

.employment-type h3::before{
width: 30px;
height: 30px;
top: 20px;
left: 10px;
}

.employment-type-col:last-of-type{
margin-bottom: 0;
}

.employment-type-tit{
width: 90%;
top: -5%;
}

.employment-type h3{
font-size: 0.875em;
}

.employment-type ul li,
.employment-type p{
font-size: 0.875em;
}

.employment-type ul li{
margin: 0 0 0.7em;
}

.employment-type ul li::before{
padding-left: 20px;
height: 17px;
}

.employment-type ul li br{
display: none;
}

.employment-type img{
margin: 0 0 20px;
}

.employment-type-btn{
font-size: 1.25em;
padding: 10px;
width: 60%;
}

.employment section .employment-tit{
height: 60px;
}

.employment section .employment-tit::before, 
.employment section .employment-tit::after{
width: 43px;
height: 60px;
}

.employment section .employment-tit::after{
right: -4%;
}


.employment section .employment-tit p{
font-size: 0.675em;
}

.employment section .employment-tit h2{
font-size: 1.25em;
}

.employment section .employment-tit-inner::before {
width: 40px;
height: 40px;
left: 10px;
}

.employment-comment{
width: 120px;
left: -20px;
bottom: -90px;
}

section#introduction .employment-comment{
right: -20px;
}

.employment-col{
border-radius: 18px;
}

.employment-col h3{
width: 250px;
}

.employment-col .employment-col-inner{
padding: 20px 20px 0;
}

.employment-col dl{
margin-bottom: 25px;
}

.employment-col dl dt{
font-size: 1em;
}

.employment-col dd{
font-size: 0.875em;
}

.employment-col dd span img{
width: 20px;
}

.employment-flow{
padding: 22px 15px;
}

#dispatch .employment-flow img{
width: 90%;
margin-right: 5%;
}


}


@media only screen and (max-width:480px) {
.employment section .employment-tit-inner::before {
width: 35px;
height: 35px;
left: -40px;
}

.employment section .search-btn{
font-size: 1.125em;
}

}



/*----------------------------
雇用形態
----------------------------*/
.commitment h1{
max-width: 600px;
margin: 0 auto 100px;
}

.commitment h1 span{
display: inline-block;
margin-left: 4em;
}

.commitment .lp{
position: relative;
}

.commitment .lp::before{
content: "";
background-image: url(./images/page/backF04.png);
background-position: bottom;
background-repeat: no-repeat;
background-size: cover;
position: absolute;
top: 50px;
left: 0;
right: 0;
height: 3000px;
}


.commitment section .d-flex{
align-items: center;
}

.commitment section .commitmentImg{
position: relative;
}

.commitment section .commitmentImg::before{
content: "";
background-image: url(./images/page/commitment_no01.svg);
display: inline-block;
background-repeat: no-repeat;
background-position: bottom;
width: 250px;
height: 250px;
position: absolute;
left: 30px;
bottom: 50px;
}

.commitment section:nth-of-type(2) .commitmentImg::before{
background-image: url(./images/page/commitment_no02.svg);
}

.commitment section:nth-of-type(3) .commitmentImg::before{
background-image: url(./images/page/commitment_no03.svg);
}

.commitment section:nth-of-type(4) .commitmentImg::before{
content: none;
}


.commitment section h3{
font-size: 2.5em;
font-weight: 800;
line-height: 1.4em;
}

.commitment section h3 span{
color: #d0121b;
}

.commitment section h4{
font-size: 1.75em;
margin-bottom: 1em;
}

.commitment section p span{
color: #ffffff;
background-color: #d0121b;
padding: 0 0.2em;
}

.commitment section .icon{
width: 100px;
position: absolute;
right: 0;
bottom: 70px;
transition: ease .4s;
animation: pulse-scale 1.5s ease-in-out infinite;
}

/* .commitment section .icon a img:hover{
opacity: 1;
} */

.commitment section .icon:hover{
transform: scale(1.05);
}


@keyframes pulse-scale {
  0%, 100% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.05);
  }
}


.commitment section ul li{
font-size: 1.25em;
display: flex;
align-items: baseline;
line-height: 2em;
}

.commitment section ul li::before{
content: "";
display: inline-block;
background-image: url(./images/page/commitment_check.svg);
background-repeat: no-repeat;
background-size: contain;
width: 26px;
height: 26px;
margin-right: 10px;
vertical-align: middle;
}

.commitment section p {
margin: 0;
}

.commitment .job-support h2{
max-width: 660px;
margin: 0 auto 50px;
}

.commitment .job-support .search-btn{
margin: 50px auto;
}


@media only screen and (max-width:1700px) {
.commitment section .commitmentImg::before {
width: 200px;
height: 200px;
top: auto;
bottom: 40px;
left: 40px;
transform: translateY(0);
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
}
}

@media only screen and (max-width:1300px) {
.commitment section .icon{
bottom: -20px;
}
}

@media only screen and (max-width:1200px) {
.commitment .lp::before{
top: 0;
}

.commitment h1{
margin-bottom: 50px;
}

.commitment section h3{
font-size: 1.75em;
}
.commitment section h4{
font-size: 1.375em;
}

.commitment section ul li{font-size: 1.125em;}
.commitment section ul li::before{width: 20px;height: 20px;}
}

@media only screen and (max-width:920px) {
.commitment .lp::before{
top: -100px;
}

.commitment section .commitmentImg::before {
width: 120px;
height: 120px;
}

.commitment section .icon{
width: 70px;
bottom: -30px;
}


}

@media only screen and (max-width:768px) {
.commitment h1{
max-width: 420px;
}

.commitment section h3{
margin: 20px 0 0;
}

.commitment .job-support h2{
max-width: 420px;
margin: 0 auto 20px;
}

}


@media only screen and (max-width:480px) {
.commitment h1{
max-width: 280px;
}

.commitment .lp::before{
top: 80px;
}

.commitment h1{
margin-bottom: 20px;
}

.commitment section .commitmentImg img{
width: 100%;
height: 250px;
object-fit: cover;
}

.commitment section .commitmentImg::before {
bottom: 20px;
left: 20px;
width: 90px;
height: 90px;
}

.commitment section h3{
font-size: 1.25em;
}
.commitment section h4{
font-size: 1.125em;
}

.commitment section ul li{font-size: 1em;}
.commitment section ul li::before{width: 18px;height: 18px;margin-right: 5px;}

.commitment section:nth-of-type(4) h2{
font-size: 1.25em;
margin-bottom: 30px;
}

.commitment section:nth-of-type(4) h2 span img{
width: 200px;
}

.commitment .job-support .search-btn{
margin: 30px auto 0;
}

.commitment section .icon{
bottom: -50px;
}

.commitment .job-support h2{
max-width: 280px;
}


}