* { margin: 0px auto; padding:0px;  outline: none;}

html {
  font-family: noto-sans-cjk-jp, sans-serif;
  font-weight: 300; font-style: normal;
  font-size:62.5%; color: #231815; background-color: #f0f0f0;
  visibility: hidden;
}

/* WebFont読み込んでから表示 */
html.wf-active { visibility: visible; }

/* リンクに関する設定 */
a{ text-decoration: none;}
a:hover{ opacity: 0.7;}

.jobbtn_b{ display: inline-block;  width:214px; height:54px; font-size: 1.6rem; font-weight: bold; background-color: #231815; color:#fff; line-height: 3.2; letter-spacing: 0.15em; }
.jobbtn_w{display: block;  width:160px; height:38px; font-size: 1.2rem; background-color: #fff; color:#231815; border:solid 1px #231815;line-height: 2.6; letter-spacing: 0.15em; }

/* 共通の設定 */
p{ font-size: 1.6rem; padding:1.5em 0;  letter-spacing: 0.1em; line-height: 1.8;}
h1{ display: block; width:56vw; font-size: 0.8rem; letter-spacing: 0.09em; font-weight: 300; line-height: 1; padding-top:12px; }
h2{ display: block;  width:85%; max-width: 430px; font-size: 1.2rem; background-color: #231815; color:#fff; line-height: 2.6; letter-spacing: 0.15em;}

.center{text-align: center;}
.left{text-align: left;}
.right{text-align: right;}
.red{color:#ca0000;}

.container{ width: 94%; max-width:600px; margin: 30px auto; padding:20px 0px 5px; background-color: #fff;}

/* ヘッダー　*/
 header{
  min-height:50px; width: 100%; margin:0; padding:0;
  background-color:#fff; position: fixed; top:0; z-index:98;
}
#pageTitle{ display: flex; width:95%; max-width: 1024px; position: fixed;  top:10px; z-index:99;}

#logoimg{ width:30vw;  max-height:50px;}
#logoimg img{ width:80%; max-width:151px;}
#freewrd{ width:10vw; max-height:50px; padding-top:5px;}
#freewrd img{  width:80%; max-width:60px; max-height:48px;}

.inner{ width:100%; background: #fff; position:relative; top:50px;}

#freewrdSearch input,#freewrdSearch button{ border:solid 1px #777; color:#777;}
#freewrdSearch input{ margin:20px 10px 5px; height:30px; width:85%; border-radius: 15px; padding-left:10px;}
#freewrdSearch button{ margin:5px 10px 20px; height:40px; width:60px; background-color: #fff; border-radius: 5px;}

/* main*/
#top{  margin-top:50px; }

#mainCopy{
  width:60%; max-width:500px; height:30vw;
  position:relative; left:0; top:30%;
  background: #fff; border: 1px solid #231815;
  z-index: 10;
}
#mainCopy p{
  position:absolute; left:5%; top:-10%;
  font-family: tbcinergothic-std, sans-serif;
  font-weight: 400; font-style: normal;
  font-size: 5vw; letter-spacing: 0.15em; line-height:1.5;
}
#mainCopy img#cat{ width:22%; position:absolute; right:5px; top:25%; }
#mainCopy img#ribbon{ width:15%; position:absolute; left:43%; top:-10px; }

/*message*/
#message p{ margin:5px 0px 20px;}

/* 検索各項目 */
.selectStyle{ width: 95%; max-width:430px; margin: 1.6em auto 2.4em; }
.selectStyle select {
  font-size: 1.2rem;
  width:100%;  height:3.4em; padding-right: 1em;
  cursor: pointer; text-indent: 0.01px; text-overflow: ellipsis;
  border: none; outline: none; background: transparent; background-image: none; box-shadow: none;
  -webkit-appearance: none;
  appearance: none;
}
.selectStyle select::-ms-expand {display: none;}
.selectStyle.customForm { position:relative; border: 1.4px solid #231815; background: #ffffff;}
.selectStyle.customForm select { padding: 8px; color: #231815; }
.selectStyle.customForm::before {
  position: absolute; top: 0.5em; right: 0.3em;
  content: '〉'; transform:rotate(90deg);
  pointer-events: none; padding-left:20px; color: #231815;
}

/* 下部の画像 */
#workImg img{ width:100%; margin:20px auto;}

/* フッター */
footer{ background-color: #ca0000; color:#fff; padding:20px 0;}
small{ line-height: 1.5em; letter-spacing: 0.1em;}

/*-- PC版表示CSS --*/
@media screen and (min-width:961px){
  .pc_area{ display:block;}
  .tb_area{ display:none;}
  .sp_area{ display:none;}
  .sp_br{ display:none;}

  #top{ width:1024px; height:445px; background: url('../images/pc_top.jpg') no-repeat; background-size: contain;}

  /* 共通の設定 */
  h2{ font-size: 1.6rem; line-height: 3; letter-spacing: 0.14em; height:54px;}
  li, .selectStyle select { font-size:1.6rem; }

  .container{ padding:40px 0px 15px; margin:40px auto;}
  .selectStyle{ margin: 24px auto; }
  .selectStyle.customForm::before { font-size: 1.6rem; top: 0.7em; }

  /* ヘッダー　*/
  header{ height:96px; }
  #pageTitle{ width:1020px; top:15px; left:calc((100vw - 1024px)/2); justify-content: space-between;}

  #logoimg{ width:160px; max-height:96px;}
  #logoimg img{ width:151px;}
  h1{ width:420px; font-size: 1.2rem; font-weight: 300; margin:10px;   }
  nav li{  margin-top:15px; padding:0 7px; letter-spacing: 0.08em; }
  nav li a{ color:#231815;}

  #menu{ list-style-type: none; display: flex;}
  .lboder{ border-left:1px solid #231815;  }

  /* main*/
  #top{  margin-top:96px; }
  #mainCopy{ height:160px; position:relative; left:0; top:30%; }
  #mainCopy p{ position:absolute; left:35px; top:-10px; font-size: 3.1rem; }
  #mainCopy img#cat{ width:76px; position:absolute; right:25px; top:25%; }
  #mainCopy img#ribbon{ width:56px; position:absolute; left:222px; top:-15px; }

  /*雇用形態検索*/
.jobbtn_b{ margin:10px 20px 30px; }

  /*職種検索*/
  #pc_job h2{ color: #231815; background-color: #f0f0f0; font-size: 1.7rem; font-weight:400 ; }
  #pc_job .container{ margin-top: 0px; }

  ul.joblist{ list-style-type: none; width:400px; display: flex; flex-wrap: wrap; }
  ul.joblist li{  width:160px; height:180px;  }
  .jobimage{ width:160px; }
  .jobtext{ display: block; width:154px; height:37px; border: solid 2px #231815; margin:7px auto; line-height: 2.4; letter-spacing: 0.12em; color:#231815;}
  .jobtext.brtext{ line-height:0.3; }
  .jobtext.brtext::first-line{ line-height:1.45;}
  .jobtext.brtext small{ font-size: 1rem; letter-spacing: 0.1em; line-height:0.3;}

  /* 下部の画像 */
  #workImg img{ width:1024px; margin:50px auto;}

/* フッター */
  small{font-size: 1.6rem; letter-spacing: 0.2em; line-height: 1.8;}
}

/*-タブレット版表示CSS-*/
@media screen and (min-width:481px) and (max-width:960px) {
  .pc_area{    display:none;   }
  .sp_area{    display:block;  }
  .sp_br{    display:none;   }

  #top{ width:100%; max-width:1024px; height:44vw; background: url('../images/pc_top.jpg') no-repeat; background-size: contain;  margin-top:70px;}

  header{ height:70px; }
  h1{font-size: 1.5vw; font-weight: 300; padding-top:20px; }

  #mainCopy{ height:20vw; }
  #mainCopy p{ top:-5%; font-size: 3.8vw; }
  #mainCopy img#cat{ width:16%; position:absolute; right:5px; top:20%; }
  #mainCopy img#ribbon{ width:15%; position:absolute; left:43%; top:-15px; }
}

/*-スマホ版表示CSS-*/
@media screen and (max-width:480px){
  .pc_area{    display:none;   }
  .sp_area{    display:block;  }
  .pc_br{    display:none;   }

  #top{ width:100%; height:99vw;  background: url('../images/sp_top.jpg') no-repeat; background-size: contain;}
}
