/**************************************** コンテンツ設定 ****************************************/
html,body {font-size:0.9vw;margin:0;padding:0;}
body {font-family: "Roboto","Noto Sans Japanese","Helvetica",sans-serif;}
div,h1,h2,h3,h4,ul,li,dl,dt,dd,img {margin:0px; padding: 0px;}
ul {list-style: none; margin: 0px; padding:0px;}
p {margin: 0px; padding: 0px;}
a,a:visited {color: #000; text-decoration: none;}
a:hover {color: #000; text-decoration: underline;}
a img {border-style:none;}
input, button, textarea, select { -webkit-appearance: none; -moz-appearance: none; appearance: none; }
* {box-sizing:border-box;}
/*SP*/
@media (max-width: 896px){
	html,body {font-size:3.5vw;}
}

/*共通*/
@media (max-width: 896px){ .pc {display:none !important;} }
@media (min-width: 897px){ .sp {display:none !important;} }

/*PCの場合*/
@media (min-width: 897px){
}
@media (min-width: 1200px){
}


/*横の場合*/
@media screen and (orientation: landscape) {
}
/*縦の場合*/
@media screen and (orientation: portrait) {
}

/*パソコン設定*/
@media (min-width: 897px){
.col {}
.collist {display:flex; flex-wrap:wrap;}
.collist .inner {justify-content:space-between;}
.col .inner {float:left;}
.col .inner.right {float:right;}
.col2 .inner {width:50%;} .col3 .inner {width:33.3%;} .col4 .inner {width:25%;} .col5 .inner {width:20%;}
.col6 .inner {width:16.6%;} .col7 .inner {width:14.2%;} .col8 .inner {width:12.5%;} .col9 .inner {width:11.1%;} .col10 .inner {width:10%;}

	/*横の場合*/
	@media screen and (orientation: landscape) {
	}
	/*縦の場合*/
	@media screen and (orientation: portrait) {
	}
}
section {}
.contentarea {padding:7vw 5vw;position:relative;z-index:100;}
.contentwrap {position:relative;z-index:100;}
.content {width:65vw;max-width:100%;margin:0px auto;}

.btn {font-size:1.0rem;padding:1em 3em;border-radius:2rem;
	display:inline-block;text-decoration:none;background:#fff;border:solid #ddd 0.4rem;color:#000;cursor:pointer;}
.btn:hover {font-weight:bold;background:#000;color:#fff;border:solid #ddd 0.4rem;text-decoration:none;}
.btn2 {font-size:1.0rem;padding:1em 3em;border-radius:2rem;
	display:inline-block;text-decoration:none;background:#fff;border:solid #f90 0.4rem;color:#000;cursor:pointer;font-weight:bold;}
.btn2:hover {transform:scale(1.05);transition:0.2s;text-decoration:none;background:#fff;}

.btn3 {font-size:1.0rem;padding:0.5em 2em;margin-top:1rem;border-radius:0.2rem;
	display:inline-block;text-decoration:none;background:#a4a4ff;color:#fff;cursor:pointer;font-weight:bold;}
.btn3:hover {transform:scale(1.05);transition:0.2s;text-decoration:none;color:#fff;}


/*SP*/
@media (max-width: 896px){
	.contentarea {padding:15vw 5vw;}
	.content {width:100%;}
}

.mainimgarea .bgcover {position:fixed;top:0;left:0;height:100%;width:100%;
background:#000 url(../img/top/mainimg.jpg) no-repeat center center;background-size:cover;}

.mainimgarea {padding:7vw 5vw;position:relative;}
.mainimgarea .bgcover video {height:100%;width:100%;object-fit:cover;}
.mainimgarea .cover {position:absolute;top:0;left:0;height:100%;width:100%;background:rgba(0,0,0,0.8);opacity:1;z-index:10;}
.mainimgarea.on .cover {opacity:0.7;transition:7s;}
.mainimgarea .mainimg {position:relative;width:100%;padding-top:0vh;z-index:200;text-align:left;}
.mainimgarea .mainimg h3 {font-size:1.0rem;line-height:1.0em;text-align:left;display:inline-block;position:relative;
	border:solid #fff 1px;padding:1.2rem 3rem 0.9rem 3rem;color:#fff;margin-bottom:1rem;}
.mainimgarea .mainimg h3:before {content:"";position:absolute;top:0.2vw;left:0.2vw;width:100%;height:100%;border:solid #fff 1px;transform:translateX(-10vw);opacity:0;}
.mainimgarea.on .mainimg h3:before {transform:translateX(0vw);transition:0.4s;opacity:1;}
.mainimgarea .mainimg h1 {font-size:7rem;line-height:1.2em;text-align:left;
color:#fff;margin-bottom:1rem;
background: linear-gradient(135deg, #ff3 0%, #fff 32%, #77f 85%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;}
.mainimgarea .mainimg h2 {font-size:2.4rem;line-height:1.2em;text-align:left;color:#fff;}
.mainimgarea .mainimg p {font-size:1.2rem;line-height:1.5em;text-align:left;color:#fff;}

.mainimgarea .mainimg .ctabtn {text-align:left;padding-top:2rem;}

.circle {position:fixed;top:50%;left:50%;width:350vh;height:350vh;transform:translateX(-50%) translateY(-50%) scale(0);z-index:2;
	background:#f2f2f2;background: linear-gradient(135deg, #009 0%, #ddf 32%, #fff 85%);z-index:100;border-radius:50%;transition:0.4s;}
.circle.on {transform:translateX(-50%) translateY(-50%) scale(1);transition:0.2s;}

/*SP*/
@media (max-width: 896px){
	.mainimgarea {padding:20vw 5vw;}
	.mainimgarea .mainimg img {width:38vw;}
	.mainimgarea .mainimg h1 {font-size:10vw;}
	.mainimgarea .mainimg h2 {font-size:1.4rem;}
	.mainimgarea .mainimg p {font-size:1.0rem;}
	.mainimgarea .mainimg .ctabtn {text-align:center;padding-top:3rem;}
	.mainimgarea .mainimg .ctabtn .btn {width:80%;}
}



h2 {font-size:3.5rem;line-height:1.8em;margin-bottom:0.8em; }
p {font-size:1.2rem;line-height:1.8em;}
/*SP*/
@media (max-width: 896px){
	h2 {font-size:1.8rem;margin-bottom:1em;}
	p {font-size:1.0rem;}
}

.issuearea {}
.issuearea h2 {font-size:5rem;line-height:1.2em;text-align:center;}
.issuearea p {font-size:1.4rem;text-align:center;}
/*SP*/
@media (max-width: 896px){
	.issuearea h2 {font-size:2.8rem;text-align:left;}
	.issuearea p {font-size:1.4rem;text-align:left;}
}

.solutionarea {background:#000 url(../img/top/image01.jpg) no-repeat center center;background-size:cover;}
.solutionarea h2 {font-size:5rem;line-height:1.2em;text-align:center;color:#fff;}
.solutionarea p {font-size:1.4rem;text-align:center;color:#fff;}
/*SP*/
@media (max-width: 896px){
	.solutionarea h2 {font-size:2.8rem;text-align:left;}
	.solutionarea p {font-size:1.4rem;text-align:left;}
}

.coursearea {padding:7vw 0px;background:rgba(0,0,0,0.3);}
.coursearea .heading {margin-bottom:3rem; }
.coursearea .heading p {font-size:2.0rem;line-height:1.2em;font-weight:bold;text-align:center;color:#fff;margin-bottom:1rem;}
.coursearea .heading h2 {font-size:4.5rem;line-height:1.2em;text-align:center;color:#fff;margin:0;}
.coursearea .coursebox {width:62%;margin:0 auto;background:#fff;border-radius:0.4rem;}
.coursearea .course {padding:2rem; border-bottom:dotted 3px #caf;}
.coursearea .course h2 {font-size:1.6rem;line-height:1.2em;}
.coursearea .course h3 {font-size:1.1rem;line-height:1.2em;margin-bottom:0.5em; }
.coursearea .course p {font-size:1.0rem;}
.courselist {padding-top:3rem;border-bottom:dotted #000 1px;}
.courselist dt {font-size:1.0rem;font-weight:bold;border-top:dotted #000 1px;padding:0.5rem 0px;}
.courselist dt:after {content:"+";display:inline-block;margin-left:1rem;}
.courselist dd {font-size:0.9rem;padding:1rem;background:#f2f2f2;margin-bottom:1rem;display:none;}
/*SP*/
@media (max-width: 896px){
	.coursearea {padding:15vw 0px;}
	.coursearea .heading p {font-size:1.4rem;}
	.coursearea .heading h2 {font-size:2.8rem;}
	.coursearea .coursebox {width:90%;}
	.courselist dt {font-size:1.2rem;}
	.courselist dd {font-size:1.0rem;}
}

.flowarea {background:#ccc url(../img/top/image02.jpg) no-repeat center center;background-size:cover;background-attachment:fixed;}
.flowarea .content {width:80%;}
.flowarea h2 {text-align:center;margin-bottom:3rem;color:#000;}
.flowarea .flow {margin-bottom:0.5rem;position:relative;}
.flowarea .flow .txt {width:100%;background:#fff;padding:3rem 4rem 3rem 2rem;border-radius:0.4rem;box-shadow:0.1rem 0.1rem 0.1rem rgba(0,0,0,0.1)}
.flowarea .flow h3 {font-size:1.6rem;width:38%;color:#000;line-height:1.2em; 
position:absolute;top:50%;left:0%;transform:translateY(-50%);text-align:center;}
.flowarea .flow p {font-size:1.2rem;width:62%;color:#000;line-height:1.8rem;margin-left:38%;}

/*SP*/
@media (max-width: 896px){
	.flowarea .content {width:100%;}
	.flowarea .flow .txt {padding:3rem 2rem;}
	.flowarea .flow h3 {width:100%;position:relative;top:auto;left:auto;transform:translateY(0);margin-bottom:1.5rem; }
	.flowarea .flow p {width:100%;margin-left:0%;}
}

.faqarea {background:#eee url(../img/top/image03.jpg) no-repeat center center;background-size:cover;background-attachment:fixed;}
.faqarea .content {width:50%;}
.faqarea h2 {text-align:center;margin-bottom:3rem;}
.faqarea .faq {background:#fff;margin-bottom:1rem;padding:1rem 3rem;border-radius:0.4rem;box-shadow:0.2rem 0.2rem 0.2rem rgba(0,0,0,0.2);}
.faqarea .faq .q {font-size:1.4rem;}
.faqarea .faq .q:before {content:"＋";float:right;display:inline-block;cursor:pointer;}
.faqarea .faq .q.on {border-bottom:solid #000 2px;margin-bottom:0.5rem;padding-bottom:0.5rem;}
.faqarea .faq .q.on:before {content:"ー";}
.faqarea .faq .a {font-size:1.4rem;display:none;}

/*SP*/
@media (max-width: 896px){
	.faqarea .content {width:100%;}
	.faqarea .faq {padding:1rem 1rem; }
	.faqarea .faq .q.on {border-bottom:solid #000 1px;}
}


.reviewarea {background:#000;background:linear-gradient(90deg,#000,#222,#000);}
.reviewarea h2 {font-size:5rem;margin-bottom:0.5em;text-align:center;color:#fff;}
.reviewarea .inner {}
.reviewarea .inner .box {text-align:center;padding:2rem; }
.reviewarea .inner img {width:7rem;margin-bottom:1rem;border-radius:50%;}
.reviewarea .inner h2 {font-size:2.0rem;font-weight:normal;line-height:1.5em;color:#fff;}
.reviewarea .inner p {font-size:1.2rem;line-height:2.2em;color:#fff;}

/*SP*/
@media (max-width: 896px){
	.reviewarea h2 {font-size:2.4rem;}
	.reviewarea .inner h2 {font-size:1.6rem;}
}


.ctaarea {text-align:center;background:#fff;padding:10vw 0vw;}
.ctaarea h3 {font-size:6rem;color:#000;margin-bottom:0.5em; }
.ctaarea p {font-size:1.8rem;color:#000;margin-bottom:3em;}
.ctaarea a {}
.copyright {text-align:center;font-size:0.9rem;color:#000;padding-top:5vw;}
/*SP*/
@media (max-width: 896px){
	.ctaarea {padding:20vw 3vw;}
	.ctaarea h3 {font-size:2.8rem;}
	.ctaarea p {font-size:1.2rem;}
	.ctaarea a.btn2 {width:80%; }
	.copyright {padding-top:25vw;}
}