@charset "utf-8";
.rro {font-family: 'RocknRoll One', sans-serif;}
main {display: block;}
.wrap {width: 1028px;margin: 0 auto;padding: 0 26px;position: relative;}
.sp {display: none;}

header {width: 100%;position: fixed;top: 0;left: 0;z-index: 10000;}
header .wrap {overflow: hidden;}
header h1 {float: left;padding: 17px 0;}
header h1 span {
	display: block;margin: 0 0 5px;
	font-size: 1.2em;font-weight: 500;
}
header h1 svg {height: 30px;display: block;}
header nav {float: right;}
header nav ul {overflow: hidden;padding: 45px 0;}
header nav ul li.fb {
	position: absolute;bottom: 0;right: 50px;
}
header nav ul li.contact {
	position: absolute;top: 0;right: 28px;
}
header nav ul li.contact span {
	background: #E2FF00;color: #000;font-weight: 600;
	padding: 11px 20px;
}
header nav ul li svg {width: 30px;height: 30px}
header nav ul li {float: left;margin: 0 0 0 .5em;}
header nav ul li span {
	color: #fff;background: #A41616;padding: 6px 8px 7px;display: block;
	font-size: 14px;font-weight: 500;line-height: 1;
}

footer {
	color: #fff;text-align: center;padding: 45px 0;
	background: #1A1F24;
}

main {position: relative;overflow: hidden;margin: -380px 0 0;}
main section {margin: 90px 0 180px;}
main section h2 ,
section.company span.title {
	font-size: 2em;font-weight: 700;line-height: 1;display: block;
	margin: 0 0 60px;border-bottom: solid 1px #eaebee;padding: 0 0 14px;
}
main .bubble::before ,
main .bubble::after ,
main .bubble2::before ,
main .bubble2::after ,
main .bubble3::before ,
main .bubble3::after {content: "";position: absolute;border-radius: 50%;}

main .bubble::before {
	width: 1038px;height: 1038px;background: #A0C60A;mix-blend-mode: multiply;
	top: 0;right: -384px;
}
main .bubble::after {
	width: 905px;height: 905px;background: #F7F7F7;mix-blend-mode: multiply;
	top: 480px;left: -265px;
}
main .bubble2::before {
	width: 1644px;height: 1644px;background: #22B020;mix-blend-mode: multiply;
	top: 660px;right: -760px;
}
main .bubble2::after {
	width: 643px;height: 643px;background: #fff;opacity: .25;
	top: 820px;left: -100%;right: -100%;margin: 0 auto;
}
main .bubble3::before {
	width: 1038px;height: 1038px;background: #A0C60A;mix-blend-mode: multiply;
	top: 1600px;left: -310px;
}
main .bubble3::after {
	width: 905px;height: 905px;background: #FBFBFC;
	top: 3060px;left: -140px;
}

section.lead {overflow: hidden;background: #fff;position: relative;z-index: 1;}
section.lead article {
	width: 100%;height: 600px;float: left;
	position: relative;
}
section.lead article::before {
	display: block;
	content: "";width: 80%;height: 47vw;position: absolute;top: 0;right: 0;
	background: url(../img/lead/lead01@2x.jpg) no-repeat center / cover;
}
section.lead article::after {
	display: block;
	content: "";width: 570px;height: 280px;position: absolute;bottom: 0;left: 25%;z-index: 11;
	background: url(../img/lead/lead01_ic@2x.png) no-repeat center / cover;
}
section.lead article:nth-of-type(2)::before {
	background: url(../img/lead/lead02@2x.jpg) no-repeat center / cover;
}
section.lead article:nth-of-type(2)::after {
	width: 612px;height: 306px;
	background: url(../img/lead/lead02_ic@2x.png) no-repeat center / cover;
}
section.lead article:nth-of-type(3)::before {
	background: url(../img/lead/lead03@2x.jpg) no-repeat center / cover;
}
section.lead article:nth-of-type(3)::after {
	width: 584px;height: 228px;
	background: url(../img/lead/lead03_ic@2x.png) no-repeat center / cover;
}
section.lead article:nth-of-type(4)::before {
	background: url(../img/lead/lead04@2x.jpg) no-repeat center / cover;
}
section.lead article:nth-of-type(4)::after {
	width: 509px;height: 246px;
	background: url(../img/lead/lead04_ic@2x.png) no-repeat center / cover;
}
section.lead article:nth-of-type(5)::before {
	background: url(../img/lead/lead05@2x.jpg) no-repeat center / cover;
}
section.lead article:nth-of-type(5)::after {
	width: 523px;height: 245px;
	background: url(../img/lead/lead05_ic@2x.png) no-repeat center / cover;
}

section.lead article .text {
	padding: 40px;box-sizing: border-box;
	height: 50%;width: 30%;
	background: #fff;position: absolute;top: -100%;bottom: -100%;margin: auto 0;z-index: 10;
}
section.lead article .text span {
	font-size: 4em;line-height: 1;
	padding: 28px 0;display: block;position: relative;
}
section.lead article .text span::before {
	content: "PROBLEM";color: #fff;background: #9F2921;padding: .2em .6em;
	font-size: 1.4rem;position: absolute;top: 0;left: 0;
	font-family: 'Noto Sans JP';font-weight: 700;letter-spacing: 0;
}
section.lead article .text p {
	font-size: 2em;line-height: 1.2;
}

main section.news {margin: 470px 0 0;}
section.news ul {min-height: 210px}
section.news ul li {
	font-size: 1.6em;line-height: 1.4;
	margin: 0;border-radius: 10px;padding: 20px;background: #fff;
}
section.news ul li:nth-of-type(even) {background: none}
section.news ul li span.date {
	display: inline-block;
	width: 9em;
}

section.about {position: relative;}
section.about::before {
	content: "";width: 100vw;height: 216px;display: block;z-index: 0;
	position: absolute;top: 206px;left: 0;
	background: #E2FF00;
}
section.about svg {
	display: block;margin: 0 auto;
	max-height: 422px;max-width: 1280px;position: relative;
}

section.about span.title {
	display: block;margin: 120px 0 30px;
	font-size: 4em;font-weight: 500;line-height: 2;
}
section.about .text {
	margin: 0 0 0 590px;
	color: #fff;
}
section.about .text span {
	font-size: 2em;font-weight: 700;
	display: block;margin: 0 0 20px;
}
section.about .text p {font-size: 1.8em;line-height: 2}

section.relief {
	padding: 160px 0 0;
	position: relative;background: #fff;
}

section.relief ol {counter-reset: li;overflow: hidden;}
section.relief ol li {
	width: 400px;float: left;box-sizing: border-box;
	position: relative;
	padding: 20px 0 0 125px;
	margin: 0 0 30px;
}
section.relief ol li:nth-of-type(even) {margin: 0 0 30px 228px}
section.relief ol li:before{
	position: absolute;top: 0;left: 0;border-radius: 10px;
	padding: 15px 30px 20px;
	background: #EDEDED;
	font-size: 6rem;font-weight: 900;color: #fff;line-height: 1;
	counter-increment: li;content: counter(li);
}
section.relief ol li span {
	font-size: 1.8em;font-weight: 700;
	display: block;margin: 0 0 5px;
}
section.relief ol li p {font-size: 1.6em}
section.relief ol li p span {
	font-size: 1.4rem;color: #9B9B9B;font-weight: 500;
}
section.subject {background: #fff;position: relative;border-bottom: solid 1px #EAEBEE;margin: 90px 0;}
section.subject ul {overflow: hidden;padding: 0 0 80px;}
section.subject ul li {
	font-size: 14px;float: left;position: relative;line-height: 1.3;
	width: 150px;height: 14px;margin: 0 0 50px 50px;padding: 10px 0 16px;
}
section.subject ul li.two {height: 29px;padding: 1px 0 7px}
section.subject ul li::before {
	content: "";width: 40px;height: 40px;background: url(../img/icon/kind01@2x.png) no-repeat center /100%;
	position: absolute;;top: 0;left: -50px;
}
section.subject ul li:nth-of-type(2)::before {
	background: url(../img/icon/kind02@2x.png) no-repeat center /100%;
}
section.subject ul li:nth-of-type(3)::before {
	background: url(../img/icon/kind03@2x.png) no-repeat center /100%;
}
section.subject ul li:nth-of-type(4)::before {
	background: url(../img/icon/kind04@2x.png) no-repeat center /100%;
}
section.subject ul li:nth-of-type(5)::before {
	background: url(../img/icon/kind05@2x.png) no-repeat center /100%;
}
section.subject ul li:nth-of-type(6)::before {
	background: url(../img/icon/kind06@2x.png) no-repeat center /100%;
}
section.subject ul li:nth-of-type(7)::before {
	background: url(../img/icon/kind07@2x.png) no-repeat center /100%;
}
section.subject ul li:nth-of-type(8)::before {
	background: url(../img/icon/kind08@2x.png) no-repeat center /100%;
}
section.subject ul li:nth-of-type(9)::before {
	background: url(../img/icon/kind09@2x.png) no-repeat center /100%;
}
section.subject ul li:nth-of-type(10)::before {
	background: url(../img/icon/kind10@2x.png) no-repeat center /100%;
}
section.subject ul li:nth-of-type(11)::before {
	background: url(../img/icon/kind11@2x.png) no-repeat center /100%;
}
section.subject ul li:nth-of-type(12)::before {
	background: url(../img/icon/kind12@2x.png) no-repeat center /100%;
}
section.subject ul li:nth-of-type(13)::before {
	background: url(../img/icon/kind13@2x.png) no-repeat center /100%;
}
section.subject ul li:nth-of-type(14)::before {
	background: url(../img/icon/kind14@2x.png) no-repeat center /100%;
}

section.feature {position: relative;padding: 0 0 216px;}
section.feature::after {
	content: "";width: 100%;height: 216px;background: #E2FF00;
	position: absolute;bottom: 0;left: 0;
}
section.feature .wrap::after {
	content: "";width: 525px;height: 525px;position: absolute;top: 10px;right: 0;
	background: url(../img/back/feature@2x.png) no-repeat center / 100%;
}
section.feature svg {
	width: 632px;height: 270px;display: block;margin: 0 auto;
}
section.feature h2 ,
section.flow h2 ,
section.achievement h2 ,
section.company h2 {
	font-size: 4em;border: none;line-height: 1.2;
	margin: -40px 0 40px;
}
section.flow h2 span.caution {
	display: block;margin: 15px 0 0;
	font-size: 1.4rem;color: #f00;
}
section.feature dl dt {
	font-size: 2.6em;font-weight: 700;line-height: 1.4;
	margin: 0 0 20px;
}
section.feature dl dd {
	font-size: 1.6em;line-height: 1.6;
	margin: 0 0 60px 20px;
}
section.feature dl dd span {
	display: inline-block;padding: 0 2em;border-radius: 10px;margin: 10px 0 0;
	background: #D8D8D8;font-size: 1.4rem;
}

section.flow ol {counter-reset: li2;overflow: hidden;}
section.flow ol li {
	box-sizing: border-box;position: relative;
	padding: 3px 0 0 40px;margin: 0 0 30px;
	font-size: 1.8em;line-height: 1;
}
section.flow ol li span {color: #f00;font-weight: 700}
section.flow ol li:before{
	position: absolute;top: 0;left: 0;border-radius: 5px;
	padding: 4px 10px 6px;
	background: #22B020;
	font-size: 18px;font-weight: 900;color: #fff;line-height: 1;letter-spacing: 0;
	counter-increment: li2;content: counter(li2);
}
section.flow ol li:last-child:before{
	padding: 4px 5px 6px;
	letter-spacing: -.05em;
	counter-increment: li2;content: counter(li2);
}
section.achievement {background: #F7F7F7;padding: 80px 0;}
 section.achievement h2 {margin: 0 0 80px;}
section.achievement .wrap {overflow: hidden;}
section.achievement article {
	width: 300px;height: 320px;float: left;
	background: #fff;
}
section.achievement article:nth-of-type(2) {margin: 0 64px}
section.achievement article .img {
	width: 300px;height: 200px;background: #ddd;
}
section.achievement article img {
	width: 300px;height: auto;
}
section.achievement article span {
	display: block;font-size: 1.2em;letter-spacing: 0;line-height: 1;
	margin: 15px 20px 10px;
}
section.achievement article span.place ,
section.achievement article span.contents ,
section.achievement article span.people {
	margin: 0 20px 8px;padding: 0 0 0 5em;
	position: relative;
}
section.achievement article span.place::before ,
section.achievement article span.contents::before ,
section.achievement article span.people::before {
	content: "場所";position: absolute;top: 0;left: 0;
	font-weight: 700;
}
section.achievement article span.contents::before {content: "内容"}
section.achievement article span.people::before {content: "在留資格"}

section.company figure {overflow: hidden;margin: 0 0 100px;}
section.company figure img {
	width: 240px;float: left;
}
section.company figure figcaption {
	width: 692px;float: left;margin: 0 0 0 74px;
}
section.company figure dl {font-size: 1.6em;}
section.company figure dl div {
	width: 692px;overflow: hidden;
	padding: 17px 30px;box-sizing: border-box;
}
section.company figure dl div:nth-of-type(even) {
	background: #F8F8F8;border-radius: 10px;
}
section.company figure dl div dt {width: 145px;float: left;}
section.company figure dl div dd {width: 487px;float: left;letter-spacing: 0;}
section.company span.title {margin: 0 0 30px;}
section.company ul {overflow: hidden;}
section.company ul li {width: 240px;float: left;margin: 0 22px 22px 0;}
section.company ul li img {border-radius: 20px;}
section.company ul li:nth-of-type(4n) {margin: 0 0 20px;}

section.contents {padding: 500px 0 280px;}
section.contents .wrap .box {background: #fff;border-radius: 10px;padding: 0 100px;}
section.contents h1 {
	font-size: 4em;font-weight: 900;letter-spacing: 0;text-align: center;
	padding: 65px 0;
}
section.contents.pri {padding: 500px 0 0;}
section.contents.pri h1 {text-align: left;padding: 65px 0 30px}
section.contents.pri p {
	font-size: 1.6em;line-height: 2;margin: 0 0 30px;
}
section.contents.pri .grey {
	background: #F5F5F5;padding: 20px;
}
section.contents.pri .grey span {
	font-size: 1.4em;display: block;position: relative;
	margin: 0 0 12px;
}
section.contents.pri .grey span.name::before {content: "窓　口　　";}
section.contents.pri .grey span.address::before {content: "所在地　　";}
section.contents.pri .grey span.mail::before {content: "連絡先　　";}
section.contents.pri .grey span.title {font-weight: 700;font-size: 1.6rem;}
section.contents.pri h2 {
	border: none;font-size: 1.6rem;padding: 0;margin: 0 0 30px;
}
section.contents.pri ol {counter-reset: li2;overflow: hidden;}
section.contents.pri ol li {
	box-sizing: border-box;position: relative;
	padding: 3px 0 0 40px;margin: 0 0 30px;
	font-size: 1.6em;line-height: 1.8;
}
section.contents.pri ol li span {color: #f00;font-weight: 700}
section.contents.pri ol li:before{
	position: absolute;top: 0;left: 0;border-radius: 5px;
	padding: 4px 10px 6px;
	font-size: 16px;color: #000;line-height: 1.8;letter-spacing: 0;
	counter-increment: li2;content: counter(li2);
}
section.contents p.lead {
	font-size: 2em;font-weight: 500;text-align: center;padding: 75px 0 65px;
	border: solid 1px #707070;border-radius: 10px;margin: 0 0 80px;
}
section.contents p.lead ruby {font-weight: 500;padding: 0 1em;}
section.contents p.lead ruby rt {letter-spacing: 0;}
section.contents form p {
	font-size: 2em;margin: 0 0 40px;
}
section.contents form p label {
	font-weight: 500;overflow: hidden;display: block;
	margin: 0 0 50px;padding: .5em 0 0;
}
section.contents form p label.accept {text-align: center}
section.contents form p label a {font-weight: 500;text-decoration: underline;}
section.contents form p label input[type="text"] ,
section.contents form p label input[type="tel"] ,
section.contents form p label input[type="email"] ,
section.contents form p label textarea {
	width: 600px;float: right;padding: .8em;margin: -.5em 0 0;
	border-radius: 10px;
	background: #F5F0E9;border: none;
	font-size: 1.6rem;line-height: 1.8;
}
section.contents form p label span.wpcf7-not-valid-tip {font-size: 1rem;color: #f00;}
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output {
	font-size: 1.2rem;color: #f00;border: none;display: inline-block;
	border-bottom: solid 1px #f00;
}
.wpcf7 form.sent .wpcf7-response-output {
	border: none;background: #22B020;color: #fff;font-weight: 700;
	font-size: 1.6em;text-align: center;padding: 1em;border-radius: 5px;
}
section.contents form p label textarea {resize: vertical}
section.contents form input[type="submit"] {
	border: none;background: #F5F0E9;border-radius: 10px;
	font-size: 20px;padding: 1.2em 4em;font-weight: 600;
}
section.contents form input[type="button"] {
	border: solid 1px #f5f0e9;background: #efefef;border-radius: 10px;
	font-size: 20px;padding: 1.2em 4em;font-weight: 600;margin: 0 1em 0 0;
}
section.contents form .submit {padding: 0 0 250px;text-align: center}
section.contents form.sent p {display:none}