@charset"UTF-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,900');

/*! minireset.css v0.0.3 | MIT License | github.com/jgthms/minireset.css */html,body,p,ol,ul,li,dl,dt,dd,blockquote,figure,fieldset,legend,textarea,pre,iframe,hr,h1,h2,h3,h4,h5,h6{margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}ul{list-style:none}button,input,select,textarea{margin:0}html{-webkit-box-sizing:border-box;box-sizing:border-box}*,*:before,*:after{-webkit-box-sizing:inherit;box-sizing:inherit}img,embed,iframe,object,audio,video{height:auto;max-width:100%}iframe{border:0}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}


/********************************************
  以下、LP用CSS
 */
preload/*
body::after{
    position:absolute; width:0; height:0; overflow:hidden; z-index:-1;
    content: url(../img/header/SA_logo.svg) url(../img/header/header_btn_form_large.svg) url(../img/header/header_btn_tel_small_1811.svg) url(../img/main_feature/main_feature_header.svg) url(../img/main_feature/main_feature_point.svg) url(../img/contact/contact_btn_form.svg) url(../img/contact/contact_btn_tel.svg);
}*/

/*ベースの設定*/
html {
  min-width:320px;
  font-size: 16px;
  line-height: 1.5;
}

body {
  font-family: "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", Garamond, "Times New Roman", serif;
/*
  font-family: "游ゴシック", "Yu Gothic", "游ゴシック体", YuGothic, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", Avenir, "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, sans-serif;
*/
  font-weight: 500;

  color: #4D4D4D;
  font-size: 20px;
  line-height: 1.5;

/*  word-break: break-all;
  word-wrap: break-word;*/
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
   -ms-text-size-adjust: 100%;
       text-size-adjust: 100%;
	   
position: relative;
}
/*IE10,11の游ゴシック余白下2px対策フォント変更*/
/*
_:-ms-input-placeholder, :root body {
  font-family: "メイリオ", Meiryo, "Meiryo UI", "ＭＳ Ｐゴシック", "MS PGothic", Avenir, "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, sans-serif;
}
*/

article {
  overflow: hidden;
}
section {
  padding: 1px 0;
  margin: -1px 0;
}

img {
  display: block;
  vertical-align: top;
}
/*Win8.1以下のIE10,11のSVG余白対策用*/
_:-ms-input-placeholder, :root img[src$=".svg"] {
  width: 100%;
  /*UIE10用*/
  border: 0;
}

span {
  display: inline-block;
}

/*form*/
input, textarea {
  font-size: 16px;
  padding:3px;
}

/*pre {
  font-family: "游ゴシック", "Yu Gothic", "游ゴシック体", YuGothic, "メイリオ", Meiryo, sans-serif;
  font-weight: 500;
}*/
/*IE10,11の游ゴシック余白下2px対策フォント変更*/
/*_:-ms-input-placeholder, :root pre {
  font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}*/

/*アンカー*/
a, a:visited {
  color: blue;
  text-decoration: none;
}
a:hover, a:active {
  text-decoration: underline;
}

/*丸ゴシック*/
.marugoshic {
  font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO", sans-serif;
}
/*明朝体*/
.mincho {
  font-family: "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", Garamond, "Times New Roman", serif;
}

/*テキスト位置*/
.tac {  text-align: center;}
.tar {  text-align: right;}
.tal {  text-align: left;}

/*フォントスタイル*/
.fwb {  font-weight: bold;}
/*文字色*/
.fcr, .red {  color:red;}

/*イメージ表示位置*/
.img-pos-r {
  margin-left: auto;
  margin-right: 0;
}
.img-pos-c {
  margin-left: auto;
  margin-right: auto;
}
.img-pos-l {
  margin-left: 0;
  margin-right: auto;
}


/***************************
  列表示用
*/
/*  フロート*/
.flt_box {  zoom: 1;}
.flt_box::after, .fltBox::before {  content: '';  display: table;}
.flt_box::after {  clear: both;}

/*flex*/
.flex_box {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.item_ctr {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.item_mdl {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

/*句読点関係*/
.left_parenthesis {
  margin-left: -0.55em;
}
.right_parenthesis {
  margin-right: -0.55em;
}
.jp_comma,
.jp_period {
  margin-right: -0.66em;
}

/*テキスト揃え*/
.tal {
  text-align: left;
}
.tac {
  text-align: center;
}
.tar {
  text-align: right;
}

/*SP改行用*/
.br_sp {
  display: none;
}

@media screen and (max-width: 544px)  {
.br_sp {
  display: block;
}
}

/*PC-SP切替用*/
.pc-view{
display: block;
}

.sp-view{
display: none;
}

@media screen and (max-width: 544px)  {
.pc-view{
display: none;
}

.sp-view{
display: block;
}
}


/********************************************
  共通
  
 */
 
 /*color*/
 .green{
 color: #4caf93;
 }
 
 .red{
 color: #ff0000;
 }
 
 .blue{
 color: #5353cb;
 }
 
 .white{
 color: #fff;
 }

 /*background color*/
.bg_green{
background: #4caf93;
}

.bg_offgreen{
background: #f2f7f2;
}

.bg_beige{
background: #f1e6d8;
}

.bg_grey{
background: #e5e5e5;
}

.bg_white{
background: #ffffff;
}

.bg_blue{
background: #5353cb;
}

h2{
font-size: 3rem;
text-align: center;
margin-bottom: 1rem;
}

@media screen and (max-width: 544px)  {
h2{
font-size: 1.2rem;
margin-bottom: 1rem;
}
}

.catch_copy{
margin-bottom: 5%;
}

@media screen and (max-width: 544px)  {
.catch_copy{
margin-bottom: 30%;
}
}


.justify-content{
display: flex;
justify-content: space-between; /*両端の子要素も含め、均等に間隔をあけて配置*/
}

/**/
.contents_bloc {
width: 95%;
  max-width: 1280px;
  padding: 1px 10px;
  margin: 0 auto;
}

/********************************************
  ヘッダー                                    */
/*ヘッダーロゴ*/

.logo_bloc {
  width: 83.4%;
  margin: 0 auto;
}

@media screen and (max-width: 544px)  {
.logo_bloc {
  width: 95%;
  margin: 0 auto;
}
}

#logo {
  margin: 1% 0;
}

@media screen and (max-width: 544px)  {
#logo {
  margin: 3% 0;
}
}

#logo img{
width: 90%;
margin: 0 auto;
}

@media screen and (max-width: 544px)  {
#logo img{
width: 100%;
margin: 0 auto;
}
}


/********************************************
  メインフィーチャー                           */

/*フィーチャー背景*/
.main_feature{
  background: #e9f0f8 url('../img/lp02/main_feature_bg02.jpg') no-repeat 100% 0;
  background-size: cover;
  padding: 2% 0;
}

@media screen and (max-width: 544px)  {
.main_feature{
  background: #e9f0f8 url('../img/lp02/main_feature_bg02sp.png') no-repeat 100% 0;
  background-size: cover;
  padding: 4% 0;
}
}

.main_feature_bloc{
 width: 83.4%;
 margin:0 auto;
}

@media screen and (max-width: 544px)  {
.main_feature_bloc{
 width: 94%;
}
}

.copy_bloc{
width: 45%;
}

@media screen and (max-width: 544px)  {
.copy_bloc{
width: 100%;
}
}


/********************************************
  コンタクト　                                 */
.contact_box {
  width: 70%;
  margin: 1.5rem auto 0;
}

@media screen and (max-width: 1086px)  {
.contact_box {
  width: 86%;
}
}

@media screen and (max-width: 544px)  {
.contact_box {
  width: 86%;
  margin: 1rem auto 0;
}
}

.to_form {
    padding: 32px 15px;
	background: #fff;
    box-shadow: 6px 6px 8px rgb(0 0 0 / 25%);
	text-align: center;
}

@media screen and (max-width: 544px)  {
.to_form {
    padding: 2% 4%;
}
}

.jump_copy {
    font-size: 2rem;
    font-weight: 700;
    position: relative;
	padding-bottom: 1rem;
}

@media screen and (max-width: 544px)  {
.jump_copy {
    font-size: .8rem;
	padding-bottom: .4rem;
}
}

.to_form a {
    color: #FFFFFF;
    background-color: #ff8e1e;
    font-size: 2.125rem;
    font-weight: 700;
    display: block;
    max-width: 670px;
    margin: 0 auto;
    line-height: 1;
    padding: 10px;
}

.to_form a .now {
    font-size: 2.75rem;
}

@media screen and (max-width: 544px)  {
.to_form a {
    font-size: .8rem;
}

.to_form a .now {
    font-size: 1rem;
}
}

/********************************************
  求人事例　                                 */
#recruit{
padding: 2% 0;
}

@media screen and (max-width: 544px)  {
#recruit{
padding: 1rem 0;
}
}

ul.recruitment_list{
width: 100%;
margin-bottom: 1%;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}

.recruitment_list li{
width: 24%;
font-size: 1.5rem;
}

@media screen and (max-width: 1086px)  {
.recruitment_list li{
width: 48%;
margin-bottom: 1rem;
}
}

@media screen and (max-width: 544px)  {
.recruitment_list li{
font-size: 1rem;
}

.recruitment_list li:nth-child(n+3){
margin-bottom: 0;
}
}

.recruitment_box dl {
width: 100%;
display: flex;
flex-flow: column;
}

.recruitment_box dl dd{
padding: 1rem;
width: 100%;
display: flex;
flex-flow: column;
}

@media screen and (max-width: 544px)  {
.recruitment_box dl dd{
padding: .4rem;
}
}

.job_name{
font-size: 2rem;
text-align: center;
padding: .4rem 0;
}
@media screen and (max-width: 544px)  {
.job_name{
font-size: 1rem;
text-align: center;
padding: .8rem 0;
}
}

.working_status,
.salary{
margin-bottom: .5rem;
}

@media screen and (max-width: 1086px)  {
.salary{
text-align: center;
}
}

@media screen and (max-width: 544px)  {
.salary{
font-size: .8rem;
}
}

.job_description{
font-size: 1.5rem;
}

@media screen and (max-width: 768px)  {
.job_description{
font-size: 1rem;
}
}

@media screen and (max-width: 544px)  {
.job_description{
font-size: .8rem;
}
}

.salary span{
font-size: 3.5rem;
}

@media screen and (max-width: 544px)  {
.salary span{
font-size: 1.8rem;
}
}

.others{
width: 80%;
margin: 2rem auto 0;
padding: 0 0 1.5rem;
text-align: center;
background: #fff;
}

@media screen and (max-width: 1086px)  {
.others{
width: 100%;
margin: 0 auto;
}
}

@media screen and (max-width: 544px)  {
.others{
padding: 0 0 .8rem;
}
}

.others h3{
font-size: 2rem;
padding: 1rem .5rem;
margin-bottom: 1.5rem;
}

@media screen and (max-width: 1086px)  {
.others h3{
font-size: 1.6rem;
}

@media screen and (max-width: 544px)  {
.others h3{
font-size: .8rem;
padding: .8rem .4rem;
margin-bottom: .8rem;
}
}

.others p{
text-align: left;
margin: 0 1rem;
}
}

@media screen and (max-width: 544px)  {
.others p{
font-size: .8rem;
margin: 0 .4rem;
}
}

/********************************************
  募集資格　                                 */

.offer_bloc{
 background: #e9f0f8 url('../img/lp02/offer_bloc_bg.jpg') no-repeat 0;
 padding: 4% 0;
}

@media screen and (max-width: 768px)  {
.offer_bloc{
 padding: 1rem 0;
}
}

.offer_bloc h2{
text-align: center;
}

@media screen and (max-width: 768px)  {
.offer_bloc h2{
margin-bottom: 1%;
}
}

.offer_bloc h2 img{
margin: 0 auto;
}

.license_list{
display: flex;
/*justify-content: space-between;*/
flex-wrap: wrap;
padding: 1rem;
width: 100%;
margin: 0 auto;
}

@media screen and (max-width: 1086px)  {
.license_list{
width: 100%;
margin: 0 auto;
}
}

@media screen and (max-width: 544px)  {
.license_list {
display: block;
}
}

.license_list li{
padding: .8rem 1.5rem;
margin-left: 20px;
margin-bottom: 14px;
border-radius: 10px;
text-align: center;
font-size: 2rem;
position: relative;
}

@media screen and (max-width: 1086px)  {
.license_list li{
font-size: 1.2rem;
}
}

@media screen and (max-width: 544px)  {
.license_list li{
font-size: 1rem;
margin-bottom: .5rem;
}
}


.license_list li:before{
content: "";
position: absolute;
display: block;
top: 6px;
bottom: 6px;
left: 6px;
right: 6px;
border: 4px solid #4caf93;
border-radius: 10px;
}

/********************************************
 登録者事例　                                 */
 
 .user_case{
    padding: 2% 0;
 }

@media screen and (max-width: 544px)  {
.user_case{
    padding: 1rem 0;
 }
}

 .userlist li{
 margin-bottom: 2rem;
 }

@media screen and (max-width: 544px)  {
  .userlist li{
 margin-bottom: 1rem;
 }
 
 .userlist li:last-child{
 margin-bottom: 0;
 }
}

 .user_profile{
 width: 100%;
 display: flex;
 justify-content: space-between;
 }
 
 .user_icon{
 width: 25%;
 }
 
 @media screen and (max-width: 1086px)  {
  .user_icon{
 width: 20%;
 }
 }
 
 .user_discription{
 width: 74%;
 }
 
@media screen and (max-width: 1086px)  {
 .user_discription{
 width: 78%;
 }
 }
 
 
 .user_name{
 font-size: 3rem;
 margin-bottom: .5rem;
 }

@media screen and (max-width: 1086px)  {
 .user_name{
 font-size: 1.5rem;
 margin-bottom: .5rem;
 }
}

@media screen and (max-width: 544px)  {
 .user_name{
 font-size: 1rem;
 margin-bottom: .1rem;
 }
}

.holder_license,
.user_career{
font-size: 1.5rem;
 padding: 1rem;
 }
 
@media screen and (max-width: 1086px)  {
.holder_license,
.user_career{
font-size: 1rem;
 padding: .5rem;
 }
}

@media screen and (max-width: 544px)  {
.holder_license,
.user_career{
font-size: .8rem;
 padding: .4rem;
 }
}
 
 /********************************************
お問い合わせ　                                 */

.info_bloc{
width: 100%;
display: flex;
}

@media screen and (max-width: 544px)  {
.info_bloc{
width: 100%;
display: block;
}
}

.entry_nav{
width: 50%;
padding: 2% 0;
}

@media screen and (max-width: 544px)  {
.entry_nav{
width: 100%;
padding: 2% 0;
}
}

.image_bloc{
width: 50%
}

@media screen and (max-width: 544px)  {
.image_bloc{
margin: 0 auto;
}
}


.entry_nav h2{
font-size: 2rem;
}

@media screen and (max-width: 1086px)  {
.entry_nav h2{
font-size: 1.4rem;
}
}

@media screen and (max-width: 544px)  {
.entry_nav h2{
font-size: 1.2rem;
}
}

.entry_btn{
width: 100%;
}

.entry_btn a{
font-size: 3rem;
color: #fff;
text-align: center;
display: block;
padding: 2rem;
margin-bottom: 1rem;
background-color: #ff8e1e;
}

@media screen and (max-width: 1086px)  {
.entry_btn a{
font-size: 2rem;
padding: 1rem;
}
}

@media screen and (max-width: 544px)  {
.entry_btn a{
font-size: 1.4rem;
}
}


.call_block{
border: 1px solid #4caf93;
padding: 1rem;
text-align: center;
}

@media screen and (max-width: 1086px)  {
.call_block{
font-size: 1rem;
}
}

@media screen and (max-width: 1086px)  {
.call_block{
font-size: .8rem;
padding: .4rem;
}
}

.phone_number{
font-size: 3rem;
}

@media screen and (max-width: 1086px)  {
.phone_number{
font-size: 2rem;
}
}

@media screen and (max-width: 544px)  {
.phone_number{
font-size: 1.4rem;
}
}


/********************************************
  フッター                                    */
footer {
  background-color: #fff;
  line-height: 1.25;
}
.footer_inner {
  padding: 1.8% 0 3%;
  display: flex;
  justify-content:space-between;
}

@media screen and (max-width: 544px)  {
.footer_inner {
  display: block;
}
}

@media screen and (max-width: 1086px)  {
.footer_inner p{
font-size: .8rem;
}
}

@media screen and (max-width: 544px)  {
.footer_inner p{
margin-bottom: .4rem;}
}


.footer_inner a{
	color: #000;
}

.footer_logo {
width: 50%;
max-width: 500px;
margin:  1rem auto;
}

@media screen and (max-width: 544px)  {
.footer_logo {
width: 80%;
 }
}


.copyright{
width: 100%;
text-align: center;
}

.ga_announce{
text-align: center;
font-size: 1rem;
padding-bottom: 171px;
}

@media screen and (max-width: 544px)  {
.ga_announce{
font-size: .5rem;
padding-bottom: 135px;
}
}

.ga_announce a{
color: #000;
}

/*フッターバナー*/
#footer_nav{
width: 100%;
position: fixed;
bottom: 0;
z-index: 2;
opacity: 0;
transform: translateY(171px);
}

/*スクロールしたら下から出てくる動き*/
#footer_nav.UpMove{
animation: UpAnime 0.5s forwards;
}

@keyframes UpAnime{
from{
opacity: 0;
transform: translateY(171px);
}
to{
opacity: 1;
transform: translateY(0);
}
}
/*end　下にスクロールしたら下から出てくる動き*/

/*上に戻ったら消える動き*/
#footer_nav.DownMove{
animation: DownAnime 0.5s forwards;
}

@keyframes DownAnime{
from{
opacity: 1;
transform: translateY(0);
}
to{
opacity: 0;
transform: translateY(171px);
}
}
/*上に戻ったら消える動き*/

#page-top{
float: right;
width: 11rem;
}

@media screen and (max-width: 544px)  {
#page-top{
width: 8rem;
}
}

#page-top a{
display: block;
color: #fff;
background: #013B31;
border-radius: 10px 10px 0 0;
width: 11rem;
padding: .5rem;
box-sizing: border-box;
text-align: center;
}

@media screen and (max-width: 544px)  {
#page-top a{
width: 8rem;
font-size: .8rem;
}
}

.clearfloat{
	clear: both;
}

.nav_bloc{
width: 100%;
border-top: 2px solid #013B31;
padding: 1rem;
background-color: rgba(255,255,255,.7);
}

@media screen and (max-width: 544px)  {
.nav_bloc{
padding: 1rem 0;
}
}


.nav_bloc .contents_bloc{
display: flex;
justify-content: space-between;
}

@media screen and (max-width: 544px)  {
.nav_bloc .contents_bloc{
width: 100%;
}
}

.nav_bloc .contents_bloc .entry_btn,
.nav_bloc .contents_bloc .call_block{
width: 48%;
}

.nav_bloc .contents_bloc .entry_btn a{
margin-bottom: 0;
}

@media screen and (max-width: 544px)  {
.nav_bloc .contents_bloc .entry_btn a{
font-size: 1rem;
}
}

@media screen and (max-width: 1086px)  {
.nav_bloc .contents_bloc .call_block{
padding: .5rem;
}
}

@media screen and (max-width: 544px)  {
.nav_bloc .contents_bloc .call_block{
padding: .2rem;
}
}

@media screen and (max-width: 1086px)  {
.nav_bloc .contents_bloc .call_block p{
font-size: .8rem;
}
}

@media screen and (max-width: 544px)  {
.nav_bloc .contents_bloc .call_block p{
font-size: .6rem;
}
}

.nav_bloc .contents_bloc .call_block .phone_number{
font-size: 1.6rem;
}

@media screen and (max-width: 1086px)  {
.nav_bloc .contents_bloc .call_block .phone_number{
font-size: 1rem;
}
}

@media screen and (max-width: 544px)  {
.nav_bloc .contents_bloc .call_block .phone_number{
font-size: .8rem;
}
}

/********************************************
 休みのお知らせ2021
 */

.announce{
 margin:1.75% auto;
 }
 
 @media screen and (max-width: 544px)  {
.announce{
font-size: .6rem;
}
}
 