@charset "utf-8";

/*-------------------toppage-----------------*/
#no1 .inner1{
	background: url("../images/common/ttlbg01.png") no-repeat center top;
	background-size:100%;
}
@keyframes infinity-scroll-left {
from {
  transform: translateX(0);
}
  to {
  transform: translateX(-100%);
}
}
.scroll-infinity__wrap {
  display: flex;
  overflow: hidden;
}
.scroll-infinity__list {
  display: flex;
  list-style: none;
  padding: 0
}
.scroll-infinity__list--left {
  animation: infinity-scroll-left 60s infinite linear 0.5s both;
}
.scroll-infinity__item {
	padding: 0 10px;
  width: calc(100vw / 3);
}
.scroll-infinity__item>img {
  width: 100%;
}
#chatlady h3.ttl3{
	padding-left: 3%;
}
#nayami{
	background:#d6f7e7 url("../images/common/ttlbg02.png") no-repeat center top;
	background-size:100%;
}
#nayami .box01 .ttl{
	position: absolute;
	top:-20px;
	left: 0;
	padding: 0 15%;
}
#nayami .inner1{
	position: relative;
}
#nayami .inner1::before{
	content: " ";
	position: absolute;
	left: 0;
	top:20%;
	width: 100%;
	height:80%;
	background: rgba(255,255,255,0.9);
	z-index: 1;
}
#nayami .inner1 p{
	padding-bottom: 15px;
	position: relative;
	z-index: 2;
}
#nayami .inner2 h3{
	padding: 0 15%;
}
#tokuten{
	padding-bottom: 40px;
	background:#fccfc2 url("../images/common/ttlbg03.png") no-repeat center top;
	background-size:100%;
}
#tokuten .point2{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#tokuten .point2 li{
	position: relative;
	width: 48%;
	padding: 10px;
	margin-bottom: 30px;
	border-radius: 10px;
	background: #fff;
}
#tokuten .point2 li .point{
	position: absolute;
	left: 10px;
	top:-20px;
	padding-top: 10px;
	width: 50px;
	height: 50px;
	background: url("../images/common/point_en2.png") no-repeat center center;
	background-size:contain;
	font-size:200%;
	text-align: center;
	line-height: 1;
	color: #f96256;
}
#tokuten .point2 li p{
	line-height: 1.4;
}
#reward .inner1{
	background: #fff;
}
#reward .inner1 .ttl{
	margin-bottom: 10px;
	padding: 5px;
	text-align: center;
	background: #b35be1;
	color: #fff;
	font-size:110%;
}
#reward .step{
	padding: 0 25%;
}

#reward .point1 li .ttl1{
	border-bottom:solid 1px #b35be1;
}
#reward .point1 li:first-of-type .wid03,#reward .point1 li:nth-of-type(2) .wid03,#reward .point1 li:nth-of-type(4) .wid03{
	padding: 0 5%;
}
#reward .slick-list{
	padding-top: 40px;
}
#reward .slick-dots li.slick-active button:before{
	color: #b35be1;
}

#system h2{
	padding:0 15% 20px;
}
#system .box01 .ttl1 h3{
	position: relative;
	padding-left: 90px;
}
#system .box01 .ttl1 h3 img{
	position: absolute;
	left: 10px;
	top:-5px;
	width: 65px;
}
#system .box01 ol li{
	min-height: 30px;
	padding-left: 30px;
	line-height: 1.4;
	list-style-type: none;
	background: url("../images/top/no1.png") no-repeat left top 2px;
	background-size:25px;
}
#system .box01 ol li:nth-of-type(2){
	background: url("../images/top/no2.png") no-repeat left top 2px;
	background-size:25px;	
}
#system .box01 ol li:nth-of-type(3){
	background: url("../images/top/no3.png") no-repeat left top 2px;
	background-size:25px;	
}
#system .slick-list{
	padding-top:60px;
}
#system .box01.zaitaku .ttl1 h3 img{
	top:-15px;
	width: 65px;
}
#system .slick-dots li.slick-active button:before{
	color: #f9869b;
}
.point1.flow li .ttl1{
	border-bottom:solid 1px #f2b726;
}
/*#flow .point1 li:first-of-type .wid03{
	padding-right:5%;
}*/
#flow .inner1{
	padding-top: 20px;
	padding-bottom: 10px;
	background: #fdfae8;
}
#flow .inner1 .ttl{
	position: relative;
	text-align: center;
}
#flow .inner1 .ttl::before{
	content: " ";
	position: absolute;
	left: 0;
	top:50%;
	width: 100%;
	height: 1px;
	background: #fac84c;
	z-index: 1;
}
#flow .inner1 .ttl .bg{
	position: relative;
	z-index: 2;
	padding: 0 20px;
	display: inline-block;
	background: #fdfae8;
}
#flow .inner1 ul.step{
	margin:20px;
}
#flow .inner1 ul.step li{
	position: relative;
	padding: 10px 20px 0;
	background: #fff;
	border-radius: 20px 0 20px 0;
	box-shadow: 1px 1px 5px #cccccc;
}
#flow .inner1 ul.step li .stepno{
	position: absolute;
	left:20px;
	top:-10px;
	padding: 2px 10px;
	background: #fac84c;
	font-size:150%;
	font-weight: bold;
	line-height: 1;
}
#flow .inner1 ul.step li .stepno img{
	margin-right: 5px;
	height: 15px;
	vertical-align: 0px;
}
#flow .inner1 ul.step li .boxstyle01 figure{
	width: 30%;
}
#flow .inner1 ul.step li .boxstyle01 p{
	width: 68%;
	line-height: 1.5;
}
#flow .inner1 ul.step li:first-of-type{
	padding-top: 30px;
}
#flow .inner1 ul.step li:first-of-type .boxstyle01 figure{
	width:20%;
}
#flow .inner1 ul.step li:first-of-type .boxstyle01 p{
	width: 78%;
}
#flow .inner1 ul.slider1{
	margin:0 20px;
}
#flow .inner1 ul.slider1 li.box{
	position: relative;
	padding:30px 20px 20px;
	background: #fff;
	border-radius: 20px 0 20px 0;
}
#flow .inner1 ul.slider1 li .stepno{
	position: absolute;
	left:20px;
	top:-10px;
	padding: 2px 10px;
	background: #fac84c;
	font-size:150%;
	font-weight: bold;
	line-height: 1;
}
#flow .inner1 ul.slider1 li .stepno img{
	display: inline;
	margin-right: 5px;
	height: 13px;
	vertical-align: 2px;
}
#flow .slick-list{
	padding-top:30px;
}
#flow .inner2 .en{
	padding: 0 35%;
}
#flow .inner2 .slick-dots li.slick-active button:before{
	color: #e9b83d;
}

#voice{
	padding-bottom: 40px;
	background: #f3ebe6;
}
#voice .text1{
	background: url("../images/common/ttlbg.png") no-repeat center bottom;
	background-size:280px;
	font-size:120%;
}
#room{
	padding-top: 10px;
	padding-bottom: 1px;
}
#room .p02-s{
	padding-top: 30px;
}
#room .slick-dots li.slick-active button:before{
	color: #40debb;
}
.home #faq{
	padding-top: 15px;
	padding-bottom: 40px;
	background:#bcedfd url("../images/common/ttlbg04.png") no-repeat center top;
	background-size:100%;
}
#description {
	padding-top: 5%;
	padding-bottom: 50px;
		
}
#description table th{
	width: 25%;
}
#description table td{
	width: 75%;
}

/*-------------------お仕事内容-------------------*/
#job01 .hstyle01 .bg{
	background: #f8d7e1;
	display: inline;
}
#job01 .hstyle01 .bg img{
	max-width: 80%;
	vertical-align: -20px;
}
#job01 .text1 img{
	margin-right: 20px;
	width:40%;
}
#job02 .link01{
	line-height: 1;
}
#job02 .link01 img{
	width: 200px;
	margin-bottom: 5px;
}

#job02 .koredake{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
#job02 .koredake li{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	padding:20px 10px;
	width: 31%;
	font-size:4.5vw;
	background:#fff;
	border-radius: 20px 0 20px 0;
}
#job02 .koredake li .text{
	display: inline-block;
	text-align: center;
	line-height: 1.2;
}
#job02 .koredake li::before{
	content: " ";
	width: 100%;
	height: 100%;
	position: absolute;
	left: 1px;
	top:1px;
	border:solid 1px #fff;
	border-radius: 20px 0 20px 0;
}
#job02 .text1{
	padding: 0 10%;
}
#job02 .step{
	padding: 0 25%;
}
#job03 .text1{
	position: relative;
}
#job03 .text1 .icon{
	position: absolute;
	right:-10px;
	top:-20px;
	width: 70px;
}
#job04 h2 img{
	box-shadow:  1px 1px 3px #ccc;
}
#job08 .box01.ok .ttl1 .ttl2 .en{
	padding: 1px 5px;
	margin-right: 5px;
	background: #fff;
	border-radius: 2px;
	color: #fa798f;
	line-height: 1;
}
#job08 .box01.ng .ttl1 .ttl2 .en{
	padding: 1px 5px;
	margin-right: 5px;
	background: #fff;
	border-radius: 2px;
	color: #68afed;
	line-height: 1;
}
#job08 .box01.ng .ttl1 .ttl2{
	font-size:90%;
}
#job08 .box01 .mibun{
	padding: 0 3% 5%;
	border-bottom:solid 1px #ccc;
}

/*-------------------報酬について-------------------*/
#reward01 .party{
	padding: 30px 10px 20px 20px;
}
#reward01 .party p:first-of-type{
	padding-right: 10px;
}
#reward01 .twoshot p:last-of-type{
	padding: 0 8%;
}
#reward01 .inner1{
	padding-bottom: 1px;
	background: #ecb2ef;
}
#reward01 .inner1 h3{
	padding: 0 15%;
}
#reward01 .inner1 h3 img{
	margin-top: -10px;
}
#reward01 .inner1 .slider2 li.box{
	margin: 0 0.5%;
	padding: 10px;
	background: #fff;
	border-radius: 10px;
}
#reward01 .inner1 .slider2 li .ttl1{
	margin-bottom: 5px;
	font-size:3.5vw;
	text-align: center;
}
#reward01 .inner1 .slider2 li .txtPurple{
	margin-bottom: 10px;
	font-size:5vw;
	font-weight: bold;
	text-align: center;
	line-height: 1.3;
}
#reward01 .inner1 .slider2 li figure{
	margin-bottom: 10px;
	text-align: center;
}
#reward01 .inner1 .slider2 li figure img{
	height: 70px;
	display: inline;
}
#reward01 .inner1 .slider2 li p{
	font-size:3vw;
	text-align: center;
}
#reward01 .inner1 .slick-dots li.slick-active button:before{
	color: #b35be1;
}
#reward01 .inner1 .slick-dotted.slick-slider{
	margin-bottom: 20px;
}
#reward02 p img{
	box-shadow: 0 0 3px #ccc;
}
.comment{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.comment figure{
	width: 30%;
}
.comment p{
	position: relative;
	width: 65%;
	padding: 10px;
	background: #fff;
	font-size:90%;
	line-height: 1.4;
	border-radius: 10px;
}
/* アイコンを左に表示 */
.comment p::before{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: -15px;
  top: 20px;
  border-right: 15px solid #fff;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
}
#reward04{
	padding-top: 5%;
}
#reward04 h2{
	padding: 0 10%;
}
#reward04 .inner1{
	padding-bottom: 50px;
	background: #ecb2ef;
}
#reward04 .inner1 p:first-of-type img{
	margin-top: -20px;
}
#reward04 .link01{
	line-height: 1;
}
#reward04 .link01 img{
	width: 130px;
	margin-bottom: 5px;
}

/*-------------------店舗紹介-------------------*/
#place01 .box01 .ttl1{
	top:0;
	z-index: 2;
}
#place01 .box01 .slick-dots li.slick-active button:before{
	color: #40debb;
}
#place01 .box01 .text1{
	padding: 5px 5px 5px 20px;
	border:solid 1px #333;
	border-radius: 50px;
	background: #fff url("../images/place/access_ttlbg1.png") no-repeat left 15px bottom;
	background-size:20px;
	text-align: center;
	font-size:110%;
}
#place01 .box01 .slick-dotted.slick-slider{
	margin-bottom: 20px;
}
.officelist{
	display: flex;
	justify-content:space-between;
	flex-wrap: wrap;
}
.officelist li{
	width: 49%;
	margin-bottom: 10px;
	padding: 5px;
	border:solid  1px #2ad6b0;
	text-align: center;
	color: #2ad6b0;
	font-size:3.2vw;
}
.check1{
	display: flex;
	justify-content: space-between;
	padding: 0 2%;
}
.check1 li{
	position: relative;
	padding: 15px 5px;
	width: 31%;
	border: solid 1px #19acd7;
	border-radius: 0 10px 0 10px;
	background: #fff;
	text-align: center;
}
.check1 li::before{
	content: " ";
	position: absolute;
	left: 50%;
	top:-10px;
	transform: translateX(-50%);
	width: 25px;
	height: 25px;
	background: url("../images/support/check.png") no-repeat;
	background-size:cover;
}
/*-------------------サポート体制-------------------*/
#support01 .point2 li{
	position: relative;
	margin-bottom: 30px;
	padding: 20px;
	background: #fff;
	border-radius: 50px;
}
#support01 .point2 li .no{
	position: absolute;
	left: 0;
	top:-10px;
	padding-top: 7px;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	background: #fa798f;
	text-align: center;
	font-size:160%;
}
#support01 .point2 li::before{
	content: " ";
	width: 40px;
	height: 20px;
	position: absolute;
	left: 5px;
	top:-22px;
	background: url("../images/support/point.png") no-repeat center top;
	background-size:100%;
}
#support01 .point2 li:nth-of-type(2) .no{
	background: #f1d750;
}
#support01 .point2 li:nth-of-type(3) .no{
	background: #4bdfbf;
}
#support01 .point2 li .ttl{
	margin-bottom: 10px;
	padding-left: 50px;
	font-size:110%;
	font-weight: bold;
}
#support01 .point2 li p{
	line-height: 1.5;
}
#support03 .en{
	padding: 0 8%;
}
#support03 .plan{
	padding: 20px 10px;
	background: url("../images/common/bg04.png");
}
#support03 .plan figure{
	width: 28%;
}
#support03 .plan .text{
	width:68%;
}
#support03 .plan .text p{
	line-height: 1.5;
}
#support04 .point3{
	padding: 0 3%;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	background: url("../images/support/backup_bg1.png") no-repeat center bottom 10%;
	background-size: 100%;
}
#support04 .point3 li{
	width: 46%;
	margin: 2%;
	margin-bottom: 20px;
	position: relative;
	background: #fff;
}
#support04 .point3 li .no{
	position: absolute;
	left: -5px;
	top:-5px;
	padding-top: 2px;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: #50bfe0;
	text-align: center;
	font-size:130%;
}
#support04 .point3 li::before{
	content: " ";
	width: 35px;
	height: 20px;
	position: absolute;
	left:-5px;
	top:-15px;
	background: url("../images/support/point.png") no-repeat center top;
	background-size:100%;
}
#support04 .point3 li .text{
	padding: 10px;
	font-size:95%;
}
#support04 .point3 li .text p{
	line-height: 1.5;
	font-size:95%;
}
#support04 .taiguu{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#support04 .taiguu li{
	width: 23%;
	margin: 1%;
}
#support04 .anzen{
	padding: 20px;
	border:solid 2px #fff;
	border-radius: 20px;
}
#support04 .anzen figure{
	padding: 0 30%;
}
/*-------------------応募の流れ-------------------*/
#flow01{
	padding-top: 5%;
}
#flow01 .bg02{
	padding-top:20px;
	padding-bottom: 50px;
}
#flow01 h3{
	padding: 10px 10px 30px;
	width: 90%;
	margin:-40px auto 20px;
	background: url("../images/flow/flow_ttlbg.png") no-repeat center top;
	background-size:contain;
	text-align: center;
	z-index: 2;
}
#flow #flow01 .inner1{
	background: rgba(255,255,255,0.8);
}
/*-------------------よくある質問-------------------*/
#faq01 .faqlist{
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}
#faq01 .faqlist li{
	width: 31%;
	margin: 1%;
}
#faq01 .faqlist li a{
	padding: 10px 5px 10px 25px;
	display: block;
	border-radius: 5px;
	text-decoration: none;
	font-size:2.7vw;
	background:#50bfe0 url("../images/faq/icon1.png") no-repeat left 8px center;
	background-size:auto 15px;
	text-align: center;
	color: #fff;
}
#faq01 .faqlist li:nth-of-type(2) a{
	background:#50bfe0 url("../images/faq/icon2.png") no-repeat left 8px center;	
	background-size:auto 20px;
}
#faq01 .faqlist li:nth-of-type(3) a{
	background:#50bfe0 url("../images/faq/icon3.png") no-repeat left 3px center;	
	background-size:auto 15px;
}
#faq01 .faqlist li:nth-of-type(4) a{
	background:#50bfe0 url("../images/faq/icon4.png") no-repeat left 10px center;	
	background-size:auto 20px;
}
#faq01 .faqlist li:nth-of-type(5) a{
	background:#50bfe0 url("../images/faq/icon5.png") no-repeat left 8px center;	
	background-size:auto 15px;
}
#faq01 .bg03{
	padding-top: 50px;
	padding-bottom: 50px;
}
#question01,#question02,#question03,#question04,#question05{
    display: block;
    padding-top: 25px;
    margin-top: -25px;
}
#faq01 .slick-dotted.slick-slider{
	margin-bottom: 0;
}
#faq01 .slick-dots li.slick-active button:before{
	color: #f2b726;
}
/*-------------------女性の声-------------------*/
.voicebox{
	position: relative;
	border: solid 1px #666;
	padding: 20px 10px;
	border-radius: 50px 0 50px 0;
	background: url("../images/common/bg03.png");
	background-size:300px;
	box-shadow: 2px 2px 0 #aaa;
}
.voicebox .icon{
	padding-top: 10px;
	width: 60px;
	height: 60px;
	position: absolute;
	top:-20px;
	left: 50%;
	transform: translateX(-50%);
	text-align: center;
	color: #fff;
	font-size:80%;
	line-height: 1;
	background: url("../images/voice/voice_iconbg.png") no-repeat;
	background-size:100%;
}

.voicebox p{
	line-height: 1.5;
	font-size:95%;
}
.gallery-item{
	padding: 0 15% 20px;
	margin-bottom: 20px;
	border-bottom:dotted 2px #333;
	text-align: center;
}
.gallery img {
  cursor: pointer;
}
.zoom-btn {
  margin-top: 8px;
  padding: 6px 12px;
  cursor: pointer;
  font-size: 80%;
  background: #333;
  color: #fff;
}
.voicebox .icon .no{
	font-size:250%;
}
.modal {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.7);
  display: none;
  place-items: center;
	z-index: 10;
}
.modal.active {
  display: grid;
}

.modal img {
  max-width: 90vw;
  max-height: 90vh;
}

.modal .close {
  position: absolute;
  top: 20px;
  right:20px;
  font-size: 32px;
  color: #fff;
  background: none;
  border: none;
  cursor: pointer;
	z-index: 11;
}
#voice02{
	background: url("../images/common/bg07.png");
	background-size:22px;
}
#voice02 .en{
	padding:0 35%;
}
#voice02 h2{
  text-shadow:
    1px 0 0 #333333,
   -1px 0 0 #333333,
    0 1px 0 #333333,
    0 -1px 0 #333333,
    1px 1px 0 #333333,
   -1px 1px 0 #333333,
    1px -1px 0 #333333,
   -1px -1px 0 #333333,

    2px 2px 0 #dc4f44; /* ドロップシャドウ（ボカシなし） */
}
#voice03 .slick-dots li.slick-active button:before{
	color: #f96559;
}
/*-------------------　お問い合わせ-------------------*/
#contact01 .hstyle01{
	padding: 0 30px;
}
#contact01 .hstyle01 img{
	vertical-align:10px;
}
#contact01 .staff{
	padding: 0 10%;
	background: url("../images/contact/line_bg1.png") no-repeat center top;
	background-size:100%;
}
#contact02 .icon{
	margin-top: -10%;
	padding: 0 42%;
}
#contact02 dl{
	margin-bottom: 20px;
}
#contact02 dt{
	margin-bottom: 5px;
}
#contact02 dd .boxstyle01{
	justify-content: flex-start;
}
#contact02 .time select{
	margin-left: 5px;
}
#contact02 .time{
	padding-left: 20px;
		font-size:85%;
	}
#contact02 .date{
	padding-right:10px;
	}


#company ul.com{
	background:rgba(255,255,255,0.8);
}
#company ul.com li{
	padding: 20px;
	border-bottom: solid 1px #f8d7e1;
}
#company ul.com li:last-of-type{
	border-bottom: none;
}
#company ul.com li dl{
	display: flex;
	flex-wrap: wrap;
}
#company ul.com li dl dt{
	width: 25%;
	font-weight: bold;
}
#company ul.com li dl dd{
	width: 75%;
}

#keyword01 .keybox{
	padding:10px;
	margin-bottom: 10px;
	border-radius: 5px;
	background: #fff;
}
#keyword01 .link02 a{
	font-size:85%;
}
@media (max-width: 320px) {
	.check1 li{
		font-size:4.5vw;
	}
	#support03 .plan .text p.link02 a{
		font-size:4.5vw;
	}
	#flow01 h3{
		width: 100%;
		font-size: 4.5vw;
	}

}
/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●
↑spサイズ
----------------------------------
↓pcサイズ
●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/


@media (min-width: 500px) {
	.point1 li .ttl1 .ttl2,#job02 .koredake li{
		font-size:150%;
	}
.scroll-infinity__item {
  width: calc(100vw / 5);
}
.home #faq{
		background-position: center top -30px;
	}
	#nayami .box01 .ttl{
		top:-30px;
	}
	#reward01 .inner1 .slider2 li .ttl1{
	font-size:100%;
}
#reward01 .inner1 .slider2 li .txtPurple{
	font-size:150%;
}
#reward01 .inner1 .slider2 li p{
	font-size:90%;
}
	.officelist li{
		font-size:100%;
	}
	#support04 .point3 li .text{
		font-size:100%;
	}
	.check1 li{
		font-size:120%;
	}
	#flow01 h3{
		font-size:120%;
	}
	#faq01 .faqlist li a{
		font-size:100%;
	}
}
@media (min-width: 1000px) {
.scroll-infinity__item {
  width: calc(100vw / 8);
}
}