/* 横幅設定
--------------------------------*/
/* 横幅1500pxして中央(margin:auto) */
.width-1500px{ 
	width:95%;
	max-width:1500px;
	margin:0 auto;
}

/* 横幅1200pxして中央(margin:auto) */
.width-1200px{ 
	width:90%;
	max-width:1200px;
	margin:0 auto;
}

/* 余白関係
--------------------------------*/
/* 上「のみ」3rem margin */
.sec-wrap-m-t3{
	margin-top:3rem;
}

/* 下「のみ」10rem margin */
.sec-wrap-m-t10{
	margin-top:10rem;
}

/* 強制改行(主にspanに使用)
--------------------------------*/
.pc-br{
	display:block;
}

.sp{
	display:none;
}

/* トップページタイトル関係
--------------------------------*/
.c-page-title{
	width:665px;
	height:120px;
	margin:0 auto;
}

.c-page-title img{
	width:100%;
	height:auto;
}

.marker-yellow {
	background: linear-gradient(transparent 50%,#ffef76 80%);
	font-weight: 700;
}

.pin::before, .pin::after {
	content: "";
	position: absolute;
	width: 70px;
	height: 1px;
	background-color: #544545;
	-webkit-transform: rotate(-40deg);
	transform: rotate(-47deg);
}

.home-button{
	max-width:290px;
	height:60px;
	background-color:#FF80A7;
	border-radius:100px;
	width: 80%;
}

.home-button a{
	width:100%;
	height:60px;
	font-size:1.8rem;
	letter-spacing:.15em;
	font-weight:500;
	text-align:center;
	color:#fff;
	position:relative;
	display: block;
	line-height: 55px;
}

.home-button a::after{
	content:"";
	display: inline-block;
	background-size: cover;
	position:absolute;
	background-image: url(img/arrow-bt.svg);
	width: 21px;
	height: 12px;
	right:20px;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	bottom: -80px;
}

.ft-ff558e {
	color: #ff558e;
}

/* 子ページタイトル関係
--------------------------------*/
.page-wrap{
	position:relative;
}

.page-title-container{
	width: 100%;
	margin:0 auto;
	position: relative;
	height: 350px;
	background-color: #000;
	background-size: cover;
	background-repeat: no-repeat;
	background-position-x: center;
	margin-top: 110px;
}

.page-title-container .page-title-box{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	text-align: center;
	width: 100%;
}

.page-title-container .page-title-box h1{
	font-size:3.6rem;
	font-weight: 500;
	line-height: 1;
	letter-spacing: .1em;
}

.page-title-container .page-title-box .sub-title{
	font-size:2rem;
	letter-spacing: .05em;
	line-height: 1;
	margin-bottom: 1rem;
}

.page-container{
	background-color:#FFF9E9;
	padding:15rem 0;
}

.page-bg-white{
	width:90%;
	max-width:1200px;
	margin:0 auto;
	background-color:#fff;
	padding:8rem 9.5rem;
}

.c-sub-title{
	position:relative;
	text-align: center;
	margin-bottom: 9rem;
}

.c-sub-title::before {
	content: "";
	width: 50px;
	height: 2px;
	background-color: #FF80A5;
	display: block;
	letter-spacing: .05em;
	position: absolute;
	bottom: -30px;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
}

.c-sub-title span{
	font-size:1.8rem;
	font-weight:500;
	letter-spacing:.1em;
	color:#FF80A5;
}

.c-sub-title h3{
	font-size:3.2rem;
	font-weight:500;
	letter-spacing:.1em;
	line-height: 1;
	margin-top: 0.5rem;
}

.bg-pink-container{
	padding:10rem 0;
	background-image: url(img/reason-bg.jpg);
	background-position: top;
	background-repeat: repeat;
	overflow: hidden;
}

/* よくある質問
--------------------------------*/
.faq-box {
	overflow-x: hidden;
	margin: 0 auto;
}

.faq-box,
.faq-box::after,
.faq-box::before {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}

.faq-box .faq-actab {
	position: relative;
	overflow: hidden;
	width: 100%;
	padding: 2rem 0 0;
}

.faq-box .faq-actab input{
	position: absolute;
	opacity: 0;
}

.faq-box .faq-actab label {
	position: relative;
	display: block;
	padding: 2.5rem 3rem 2.5rem 8.5rem;
	cursor: pointer;
	background: #fff;
	letter-spacing: .05em;
	font-size: 1.8rem;
	font-weight: 500;
	line-height: 1.5;
	border: 1px solid #FF80A5;
}

.faq-box .faq-actab label::before {
	content: "Q";
	background-color: #FF80A5;
	color: #fff;
	font-size: 3rem;
	width: 45px;
	height: 45px;
	text-align: center;
	display: block;
	line-height: 1.2;
	border-radius: 30px;
	position: absolute;
	top: 50%;
	left: 2%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
}

.faq-box .faq-actab label:hover {
	transition: all 0.3s;
}

.faq-box .faq-actab label::after {
	position: absolute;
	right: 20px;
	content: "";
	background-image: url(img/icon-plus.svg);
	display: inline-block;
	width:20px;
	height:20px;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
}

.faq-box .faq-actab .actab-content {
	position: relative;
	overflow: hidden;
	max-height: 0;
	padding: 0 0 0 5rem;
	-webkit-transition: max-height 0.2s;
	        transition: max-height 0.2s;
}

.faq-box .faq-actab .actab-content::before {
	padding: 0;
	content: "A";
	background-color: #fff;
	color: #FF80A5;
	font-size: 3rem;
	text-align: center;
	display: block;
	line-height: 1.2;
	border-radius: 30px;
	position: absolute;
	left: 2%;
	top: 0;
	margin-top: 1.5rem;
	width: 43px;
	height: 43px;
	border: 1px solid #FF80A5;
}

.faq-box .faq-actab .actab-content-tax::before{
	top:6%;
}

.faq-box .faq-actab .actab-content p {
	padding: 2.5rem 4rem 2.5rem 3rem;
	letter-spacing: .05em;
	font-size: 1.6rem;
	line-height: 1.8;
}

.faq-box .faq-actab input:checked ~ .actab-content {
	max-height: 40em;
	background-color: #FFE6F0;
}

.faq-box .faq-actab input[type=checkbox]:checked + label::after {
	background-image: url(img/icon-minus.svg);
	width:20px;
	height:3px;
}

.faq-box .faq-actab .actab-content .supplement{
	padding: 1rem 0 0 3rem;
}

/* お仕事内容,待遇・環境について（ラベル部分）
--------------------------------------------*/
.label1::after{
	background-image: url(img/tag-01.svg);
}

.label2::after{
	background-image: url(img/tag-02.svg);
}

.label3::after{
	background-image: url(img/tag-03.svg);
}

.label4::after{
	background-image: url(img/tag-04.svg);
}

.label5::after{
	background-image: url(img/tag-05.svg);
}

.label6::after{
	background-image: url(img/tag-06.svg);
}

/* 報酬のしくみ(home,子ページ)
--------------------------------------------*/
.system-list li{
	padding: 7.5rem 9rem 6rem;
	border-radius: 1rem;
	box-shadow: 0 0 7px -2px rgba(73,73,73,0.75);
	background-color: #fff;
	margin-bottom: 8rem;
}

.system-list li:last-child{
	margin-bottom: 0;
}

.system-list li h4{
	max-width:750px;
	width:70%;
	height:75px;
	margin: 0 auto 5.5rem;
}

.system-list li h4 img{
	width:100%;
	height:auto;
}

.system-list li .system-txt {
	border-bottom:1px solid #FF80A5;
	padding-bottom: 3.5rem;
	margin-bottom: 3.5rem;
}

.system-list .party .system-ex{
	display:flex;
	justify-content:space-between;
	align-items: center;
	margin-bottom: 5rem;
}

.system-list .party .system-ex .example-title{
	font-size:2.5rem;
	letter-spacing:.1em;
	font-weight:500;
	text-align:center;
	line-height: 1.4;
	width: calc(100% - 500px);
	position:relative;
}

.system-list .party .system-ex .example-title::after{
	content:"";
	background-image: url(img/system-arrow.svg);
	width:59px;
	height:27px;
	position:absolute;
	right:-40px;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
}

.system-list .party .supplement{
	font-size:1.8rem;
	text-align:center;
	margin-bottom: 5rem;
	letter-spacing: .1em;
}

.system-list .party .system-ex .ft-ff80a5{
	font-size:3.8rem;
	color: #FF80A5;
}

.system-list .party .system-ex .system-ex-image{
	max-width:425px;
	width: 45%;
}

.system-list .party .system-ex .system-ex-image img{
	width:100%;
	height:auto;
}

.c-reward .system-list .twoshot h3::before{
	background-image: url(img/reward-title04-2.svg);
	top: -57px;
}

.system-list .twoshot .system-ex-image,
.system-list .twoway .system-ex-image{
	width:560px;
	margin: 0 auto 7.5rem;
}

.system-list .twoshot .system-ex-image img,
.system-list .twoway .system-ex-image img{
	width:100%;
	height:auto;
}

.system-list .twoshot .system-pin {
	background-color: #FFD1E3;
}

.system-list .twoway .system-txt p {
	text-align:left;
}

.system-list .twoway h3::before{
	background-image: url(img/reward-title04-3.svg);
	top: -56px;
}

.system-list li .system-pin{
	padding:2.5rem 1.5rem 1rem;
	text-align:center;
	position:relative;
	max-width: 650px;
	width: 70%;
	background-color: #FFD1E3;
	margin: 0 auto;
}

.system-list li .system-pin::after{
	content: "";
	background-image: url(img/pin.svg);
	display: inline-block;
	background-size: cover;
	width: 15px;
	height: 30px;
	position: absolute;
	top: -15px;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
}

.system-list li .system-pin p{
	line-height:1.6;
	letter-spacing:.1em;
	font-size: 1.8rem;
}

.system-list li .system-pin .ft-bd{
	font-size:2.2rem;
	font-weight: 700;
	padding-right: 1rem;
}

.system-list li .system-pin .hourlywage-box{
	background-color:#fff;
	padding:1.5rem 0;
	margin-top: 2.5rem;
}

.system-list li .system-pin .hourlywage-box .ft-md{
	font-size:2.5rem;
	letter-spacing: .2em;
	font-weight: 500;
}

.system-list li .system-pin .hourlywage-box .ft-ff80a5{
	font-size:3.5rem;
	font-weight:700;
	padding: 0 0.2rem;
	color: #FF80A5;
}

