@charset "utf-8";

/* スマホ　start */

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


.employed-image-wrapper {
  width:100%;
	height:100%;
	min-height:200px;
  margin: 0px auto;
  text-align:center;
	background-size:cover;
	position:relative;
	background-repeat:no-repeat;
}
.employed-image.lazyloaded {
	background-image:url('../web/images/employed-main-sp.webp');
  animation-name: fadein-top;
  animation-duration: 2s;
}
.employed-cp {
 width:50%;
 padding:0px;
 position:absolute;
 top:50%;
 left:65%;
 -webkit-transform: translate(-50%, -50%);
 transform: translate(-50%, -50%);
 text-align:center;
}



.contents-wrapper {
 width:90%;
 margin: 0 auto ;
 padding: 0;
 text-align:center;
}
.contents-wrapper:after {
 content: '';
 display: block;
 clear: both;
}

.employed-block {
  margin: 40px auto;
  padding: 0;
  text-align:center;
}
.employed-block:after {
  content: '';
  display: block;
  clear: both;
}
.employed-block h1  {
  margin: 0 auto;
  padding:40px 0 0 0;
  font-size:22px;
  text-align:left;
  color:#333;
  background-image:url('../images/about-title-bg.svg');
  background-repeat:no-repeat;
  background-position: left;
  background-size: 400px;
  height:100px;
}

.employed-block p {
  margin: 20px 0 0 0;
  padding:0;
  font-size:17px;
  text-align:left;
  line-height:1.8;
}
.employed-block-image {
  margin: 0 0 0 20px;
  text-align:right;
  width:30%;
  float:right;
}

.employed-detail-block {
  margin: 100px auto ;
  text-align:center;
  width:100%;
}
.employed-detail-block:after {
  content: '';
  display: block;
  clear: both;
}
.employed-detail-image {
  margin: 0;
  text-align:right;
  width:24%;
  float:right;
}
.employed-detail-block h2 {
  margin: 0 auto;
  padding:40px 0 0 0;
  font-size:20px;
  text-align:left;
  color:#333;
  background-image:url('../images/about-title-bg.svg');
  background-repeat:no-repeat;
  background-position: left;
  background-size: 320px;
  height:80px;
}
.employed-detail-block h3 {
  margin: 40px 0 0 0;
  padding:0;
  font-size:18px;
  text-align:left;
  color:#159a8f;
  border-bottom:dotted #ccc 1px;
}
.employed-detail-block p {
  margin: 10px 0 0 0;
  padding: 0;
  text-align:left;
}

.employed-worries-block {
  margin: 160px auto 0;
  padding: 0;
  text-align:center;
}
.employed-worries-block:after {
  content: '';
  display: block;
  clear: both;
}
.employed-worries-block h2 {
  margin:0 auto;
  padding: 0 ;
  font-size:20px;
}
.employed-worries-wrap {
  margin: 30px auto ;
}
.employed-worries-box {
  margin: 30px auto ;
  padding: 20px;
  text-align:center;
  background:#fff;
  border-radius:30px;
  width:86%;
}
.employed-worries-box h3 {
  margin:0 auto;
  color:#159a8f;
  font-size:18px;
  text-align:center;
}
.employed-worries-box p {
  margin:20px 0 0 0;
  font-size:16px;
  text-align:left;
}
.employed-worries-image {
  margin:10px auto;
  text-align:center;
  width:200px;
}

.employed-price-option {
  margin:20px 0 0 0;
  font-size:16px;
  text-align:left;
  color:#ff9900;
  font-weight:bold;
  display:block;
}
.employed-price-table-scroll {
  overflow-x: auto;
}

.employed-price-table {
  border-collapse: collapse;
  width:90%;
  min-width: 600px;
  text-align: center;
  margin:10px auto;
  font-size:16px;
}
.employed-price-table td {
  padding: 10px;
  border: 1px solid #159a8f;
}

.employed-order-table {
  border-collapse: collapse;
  width: 90%;
  margin:20px auto;
  text-align:center;
}
.employed-order-table td {
  padding: 5px;
  border: 1px solid #999;
  text-align:left;
  color:#333;
  display:block;
  width:100%;
  border-top:none;
}
.employed-order-table th {
  padding: 5px;
  text-align: center;
  display:block;
  color:#333;
  border: 1px solid #999;
  width:100%;
  border-bottom:none;
}
input, select, textarea {
font-size: 100%;
}
 .waku-long{width:90%;}
 .waku-50{width:90%;}
 .waku1{width:90%;}
 .waku-min{width:90px;}


.submit-block {
 margin: 40px auto;
 text-align:center;
 font-size:16px;
}
.submit-block p {
 margin: 40px auto;
 text-align:center;
 font-size:16px;
}
.submit {
 margin: 20px 0 0 0;
 text-align:center;
}

.submit-button {
  display       : inline-block;
  font-size     : 16px;
  text-align    : center;
  padding       : 8px 20px;
  background    : #159a8f; 
  color         : #fff;
  line-height   : 1em;
  transition    : .3s;
  border:none;
}


}
/* スマホ　end */



/* PC　start */
@media screen and (min-width: 769px) {


.employed-image-wrapper {
  width:100%;
	height:100%;
	min-height:900px;
  margin: 0px auto;
  text-align:center;
	background-size:cover;
	position:relative;
	background-repeat:no-repeat;
}
.employed-image.lazyloaded {
	background-image:url('../web/images/employed-main.webp');
  animation-name: fadein-top;
  animation-duration: 2s;
}
.employed-cp {
 width:50%;
 padding:30px;
 min-width:300px;
 position:absolute;
 top:50%;
 left:65%;
 -webkit-transform: translate(-50%, -50%);
 transform: translate(-50%, -50%);
 text-align:center;
}



.contents-wrapper {
 width:80%;
 min-width:960px;
 max-width:1400px;
 margin: 0 auto ;
 padding: 0;
 text-align:center;
}
.contents-wrapper:after {
 content: '';
 display: block;
 clear: both;
}


.employed-block {
  margin: 100px auto;
  padding: 0;
  text-align:center;
}
.employed-block:after {
  content: '';
  display: block;
  clear: both;
}
.employed-block h1  {
  margin: 0 auto;
  padding:40px 0 0 0;
  font-size:24px;
  text-align:left;
  color:#333;
  background-image:url('../images/about-title-bg.svg');
  background-repeat:no-repeat;
  background-position: left;
  background-size: 400px;
  height:100px;
}

.employed-block p {
  margin: 20px 0 0 0;
  padding:0;
  font-size:17px;
  text-align:left;
  line-height:1.8;
}
.employed-block-image {
  margin: 0 0 0 20px;
  text-align:right;
  width:30%;
  float:right;
}

.employed-detail-block {
  margin: 100px auto ;
  text-align:center;
  width:100%;
}
.employed-detail-block:after {
  content: '';
  display: block;
  clear: both;
}
.employed-detail-image {
  margin: 0;
  text-align:right;
  width:24%;
  float:right;
}
.employed-detail-block h2 {
  margin: 0 auto;
  padding:40px 0 0 0;
  font-size:20px;
  text-align:left;
  color:#333;
  background-image:url('../images/about-title-bg.svg');
  background-repeat:no-repeat;
  background-position: left;
  background-size: 320px;
  height:80px;
}
.employed-detail-block h3 {
  margin: 40px 0 0 0;
  padding:0;
  font-size:18px;
  text-align:left;
  color:#159a8f;
  border-bottom:dotted #ccc 1px;
}
.employed-detail-block p {
  margin: 10px 0 0 0;
  padding: 0;
  text-align:left;
}

.employed-worries-block {
  margin: 160px auto 0;
  padding: 0;
  text-align:center;
}
.employed-worries-block:after {
  content: '';
  display: block;
  clear: both;
}
.employed-worries-block h2 {
  margin:0 auto;
  padding: 0 ;
  font-size:24px;
}

.employed-worries-wrap {
  margin: 30px auto ;
  display:flex;
  justify-content: center;
  height:520px;
}
.employed-worries-box {
  margin: 30px auto ;
  padding: 20px;
  text-align:center;
  background:#fff;
  border-radius:30px;
  width:28%;
  position:relative;
  height:300px;
}
.employed-worries-box h3 {
  margin:0 auto;
  color:#159a8f;
  font-size:20px;
  text-align:center;
}
.employed-worries-box p {
  margin:20px 0 0 0;
  font-size:16px;
  text-align:left;
}
.employed-worries-image {
  margin:0 auto;
  text-align:center;
  width:200px;
  position:absolute;
  top:70%;
  left:25%;
}

.employed-price-option {
  margin:20px 0 0 0;
  font-size:16px;
  text-align:left;
  color:#ff9900;
  font-weight:bold;
  display:block;
}
.employed-price-table-scroll {
  overflow-x: auto;
}
.employed-price-table {
  border-collapse: collapse;
  width:90%;
  min-width: 600px;
  text-align: center;
  margin:10px auto;
  font-size:16px;
}
.employed-price-table td {
  padding: 10px;
  border: 1px solid #159a8f;
}

.employed-order-table {
  border-collapse: collapse;
  width: 90%;
  margin:20px auto;
  text-align:center;
}
.employed-order-table td {
  padding: 5px;
  border: 1px solid #999;
  vertical-align:middle;
  text-align:left;
  color:#000;
}
.employed-order-table th {
  padding: 5px;
  text-align: center;
  vertical-align:middle;
  width: 30%;
  color:#000;
  border: 1px solid #999;
}
input, select, textarea {
font-size: 100%;
}
@media only screen and (min-width : 768px){
 .waku-long{width:30%;}
 .waku-50{width:50%;}
 .waku1{width:94%;}
 .waku-min{width:50px;}
}

.submit-block {
 margin: 40px auto;
 text-align:center;
 font-size:16px;
}
.submit-block p {
 margin: 40px auto;
 text-align:center;
 font-size:16px;
}
.submit {
 margin: 20px 0 0 0;
 text-align:center;
}

.submit-button {
  display       : inline-block;
  font-size     : 16px;
  text-align    : center;
  padding       : 8px 20px;
  background    : #159a8f; 
  color         : #fff;
  line-height   : 1em;
  transition    : .3s;
  border:none;
}
.submit-button:hover {
  color         : #fff;
  background    : #ff9900;
}
}
/* PCメイン　end */