@charset "UTF-8";


.sec7{
	position: relative;}

.sec7:after{
	content: '';
	width: 100%;
	height: 1000px;
	display: block;
	position: absolute;
	top: 43%;
	left: 0;
	z-index: -1;
	background-color: #FAFAF0;
	transform: rotate(5deg) scale(1.5);}

/* layout
++--------------------------------------------++*/
h2{font-size: 32px; font-size: 3.2rem;}
h3{font-size: 16px; font-size: 1.6rem;}

/*.menu-banner img{
	display: block;
	margin: 0 auto 3em;}
*/

/*++---------------------------------------------++*/
/* sec1 キャッチ
++-----------------------------------------------++*/
.sec1 .width-wrapper{
	position: relative;
}

@media (min-width: 1025px){
	.sec1 .width-wrapper{
		height: 90vh;}

/*	.sec1{
		background-image: url(../../../uploads/img/logo/logoWhite_01.png),
											url(../../../uploads/img/specialCourse/sec1/bk3.jpg);
		background-repeat: no-repeat, no-repeat;
		background-position: 10vw 6vh, center;
		background-size: 20vw, cover;
		margin: 0 0 5em;}*/

	.sec1{
		background-image: url(../../../uploads/img/specialCourse/sec1/bk3.jpg);
		background-repeat: no-repeat;
		background-position: center;
		background-size: cover;
		margin: 0 0 5em;}

	.sec1 .width-wrapper h2{
		width: 100%;
		position: absolute;
		top: 45%;
		left: 50%;
		transform: translate(-50%, -50%);}
}

@media (max-width: 1024px){
	.sec1 .width-wrapper{
		height: 40vh;}

	.sec1{
		background-image: url(../../../uploads/img/specialCourse/sec1/bk3.jpg);
		background-repeat: no-repeat;
		background-position: center top;
		background-size: 100%;
		margin: 0 0 3em;}

	.sec1 .width-wrapper h2{
		width: 90%;
		position: absolute;
		top: 30%;
		left: 50%;
		transform: translate(-50%, -30%);}
}

@media (max-width: 767px){
	.sec1 .width-wrapper{
		height: 30vh;}

	.sec1 .width-wrapper h2{
		width: 90%;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);}
}





/*++---------------------------------------------++*/
/* sec2 裏メニュー
++-----------------------------------------------++*/
.sec2{
	position: relative;
	background-image: url(../../../uploads/img/specialCourse/sec2/obj1.png),
										url(../../../uploads/img/specialCourse/sec2/bk6.png);
	background-repeat: no-repeat;
	margin: 0 0 5em;
	padding: 0em 0em 2em;}

.sec2 .head{
	margin: 0 0 5em;
	text-align: center;}

.sec2 .head h2 img{
	width: 90%;
	max-width: 700px;
	height: auto;}

.sec2 .div1{
	background-color: rgba(255,255,255,0.8);
	border: solid 1px #D9D9D9;
	border-radius: 6px;}

.sec2 .div1 p{
	padding: 0;
	font-weight: bold;
	color: #4D4D4D;
	letter-spacing: .4em;
	line-height: 2.5;}


@media screen and (max-width: 767px){
	.sec2 .div1 p{
		letter-spacing: .2em;
	}
}


.sec2 .div2{
	background-color: rgba(255,255,255,0.85);
	border: solid 1px #D9D9D9;
	border-radius: 6px;
	padding: 2em 3em;}

/*.sec2 .div2 p,
.sec2 .div2 p span{
	line-height: 2.0;
	letter-spacing: .2em;
	text-indent: .2em;
	color: #fff;
	text-shadow: 2px 2px 4px rgba(0, 0, 0, .6);
	font-weight: bold;}*/

.sec2 .div2 p,
.sec2 .div2 p span{
	color: #333;
	letter-spacing: .2em;
	text-indent: .2em;}

.sec2 .div2 p{
	padding: 0;}



@media (min-width: 1025px){
	.sec2{
		min-height: 850px;
		background-position: 8vw bottom, center top;
		background-size: 38vh, cover;}

	/*可変長box center寄せ*/
	.sec2 .width-wrapper{
		text-align: center;}
	.sec2 .width-wrapper > div{
		text-align: left;}

	.sec2 .div1{
		display: inline-block;
		font-size: 2.3rem;
		padding: 1.5em 3em;
		margin: 0 auto 5em;}

	.sec2 .div2{
		display: inline-block;
		margin: 0 0 0 25%;}

	.sec2 .div2 p,
	.sec2 .div2 p span{
		font-size: 1.8rem;}
}


@media (max-width: 1024px){
	.sec2{
		/*min-height: 900px;*/
		background-position: right bottom, center top;
		background-size: 18vh, cover;}

	.sec2 .head img{
		width: 85%;}

	.sec2 .div1{
		width: 90%;
		font-size: 1.6rem;
		padding: 1.5em 2em;
		margin: 0 auto 5em;}

	.sec2 .div2{
		width: 60%;
		margin: 0 0 0 3em;
		/*margin: 0 auto;*/}

	.sec2 .div2 p,
	.sec2 .div2 p span{
		font-size: 1.6rem;}
}


/*++---------------------------------------------++*/
/* sec3 紹介
++-----------------------------------------------++*/
.sec3{
	font-size: 1.8rem;
	padding: 0;}

.sec3 .head{
	margin: 0;
	text-align: center;}

.sec3 .head h2 img{
	width: 90%;
	max-width: 700px;}


.sec3 .div1{
	/*min-height: 1000px;*/
	background-image: url(../../../uploads/img/specialCourse/sec3/bk4.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	text-align: center;
	font-size: 1.8rem;
	/*border: solid 1px #333;*/
	/*padding: 2em 0 3em;*/}

.sec3 .div1 > div{
	text-align: left;
	background-color: rgba(255,255,255,0.8);
	border: solid 1px #D9D9D9;
	letter-spacing: .1em;
	line-height: 1.8;
	text-indent: .1em;}

.sec3 .div1 p,
.sec3 .div1 p span{
	color: #4D4D4D;
	font-weight: bold;}

@media (min-width: 1025px){
	.sec3 h2 img{
		width: 650px;}

	.sec3 .div1 > div{
		display: inline-block;
		margin: 6em auto 8em;
		padding: 3em 4em;}
}

@media (max-width: 1024px){
	.sec3 h2 img{
		width: 90%;}

	.sec3 .div1{
		padding: 0 0 3em;}

	.sec3 .div1 > div{
		width: 90%;
		margin: 3em auto;
		padding: 2em;}
}


/*++---------------------------------------------++*/
/* sec4 症例
++-----------------------------------------------++*/
.sec4{
	background-image: url(../../../uploads/img/specialCourse/sec4/bk4.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	font-size: 1.8rem;
	padding: 6em 0;}

.sec4 h2{
	text-align: center;
	font-size: 4.3rem;
	letter-spacing: 1.5em;
	text-indent: 1.5em;
	font-weight: bold;
	margin: 0 0 1em;
	color: #808080;}

.sec4 .div1{
	background-color: rgba(255,255,255,0.5);
	border: solid 1px #D9D9D9;
	font-size: 1.8rem;
	line-height: 1.8;
	color: #666666;}

.sec4 h3{
	text-align: center;
	font-size: 2.6rem;
	font-weight: bold;
	color: #737373;

	margin: 1.5em auto;
	padding: 0 0 1em;
	background-image: url(../../../uploads/img/specialCourse/sec4/line1.png);
	background-position: center bottom;
	background-repeat: no-repeat;
	background-size: 1200px;}


@media (min-width: 1025px){
	.sec4 .div1{
		padding: 2em 4em 3em;}

	.sec4 h2{
		font-size: 4.0rem;}
}

@media (max-width: 1024px){
	.sec4 h2{
		font-size: 3.5rem;}

	.sec4 .div1{
		width: 90%;
		margin: 0 auto;
		padding: 2em 1.5em 3em;}
}

/* 4-1 persona
++----------------------------------++*/
.sec4 .div1 .persona{
	display: flex;
	justify-content: flex-start;
	align-items: flex-end;}

.sec4 .div1 .persona ul{
	border: 4px dashed #BCDEEB;
	border-radius: 6px;
	padding: 2em 1em;
	list-style: square outside;}

.sec4 .div1 .persona ul li{
	font-weight: bold;
	padding: 0 0 1em;
	font-size: 2.0rem;
	margin: 0 0 0 1.5em;}

.sec4 .div1 .persona div{

}

.sec4 .div1 .persona div img{
	opacity: .8;}

@media (min-width: 1025px){
	.sec4 .div1 .persona{
		margin: 0 0 3em;}

	.sec4 .div1 .persona ul{
		margin: 0 2em 0 0;}
}

@media (max-width: 1024px){
	.sec4 .div1 .persona{
/*		justify-content: center;*/
		flex-direction: column;
		align-items: center;
		margin: 0 1em 2em;}

	.sec4 .div1 .persona div{
		width: 60%;
		margin: 1.5em 0 0;}
}


/* 4-2 menu
++----------------------------------++*/
.sec4 ol{
	list-style: decimal outside;

	background-color: rgba(255,255,255,0.6);
	margin: 0 auto 3em;

	border: 1px solid #ddd;
	border-style: solid;
	border-image-source: url('../../../uploads/img/bg-border/01.png');
	border-image-slice: 97 267;
	border-image-width: 97px 267px;
	border-image-repeat: repeat;
	border-image-outset: repeat;}

.sec4 ol li{
	font-weight: 600;
	margin: 0 0 2em;}

@media (min-width: 1025px){
	.sec4 ol{
		width: 90%;
		padding: 5em 6em 4em;}
}

@media (max-width: 1024px){
	.sec4 ol{
		padding: 3em 3em 2em;}
}


/* 4-3 speak
++----------------------------------++*/
.sec4 .flex2{
	display: flex;
	justify-content: flex-start;
	align-items: stretch;}

.sec4 .flex2 .left{
	text-align: center;}

.sec4 .flex2 .right{
	background-color: #fff;
	border: solid 6px #E9F7F8;
	border-radius: 6px;
	/*text-indent: 1em;*/
	padding: 2em 2em;}


@media (min-width: 1025px){
	.sec4 .flex2 .left{
		flex: 0 1 30%;}

	.sec4 .flex2 .right{
		flex: 0 1 70%;
		margin: 0 0 0 3em;}
}

@media (max-width: 1024px){
	.sec4 .flex2{
		flex-direction: column;}

	.sec4 .flex2 .left img{
		width: 40%;
		margin: 0 auto;}

}


/*++---------------------------------------------++*/
/* sec5 / Q&A
++-----------------------------------------------++*/
.sec5{
	background-image: url(../../../uploads/img/specialCourse/sec5/bk1.jpg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 8em 0;}

.sec5 h2{
	text-align: center;
	letter-spacing: 1em;
	text-indent: 1em;
	font-weight: bold;
	margin: 0 0 2em;
	color: #808080;}

.sec5 .flex{
	display: flex;
	justify-content: flex-start;
	align-items: stretch;
	margin: 0 0 3em;}

/*.sec5 .flex dt,
.sec5 .flex dd,
.sec5 .flex dd span{
	color: #595959 !important;
	font-weight: 600;}*/

.sec5 .flex dl.accordion{
	flex: 3;
	margin: 0 1em 0 0;}

.sec5 .flex .img{
	flex: 1;}


.sec5 dl.accordion{
	font-size: 1.8rem;
	line-height: 1.8;}

.sec5 .accordion dt.btn{
	background-color: #DED7C8;
	color: #333;
	padding: 1em 2.5em 1em 2em;
	cursor: pointer;}

.sec5 .accordion div{
	margin: 0 0 3em;}


.sec5 .lineat{
	font-size: 1.8rem;}


@media (min-width: 1367px){
	.sec5{
		position: relative;
		height: 1050px;}

	.sec5 h2{
		font-size: 3.6rem;}

	.sec5 .lineat{
		position: absolute;
		bottom: 5em;}
}

@media (max-width: 1366px){
	.sec5 h2{
		font-size: 3.0rem;}

	.sec5 .flex{
		align-items: center;
		flex-direction: column;
		text-align: center;
		width: 90%;
		margin: 0 auto;}

	.sec5 .img{
		width: 80%;
		margin: 3em 0;}

	.sec5 .lineat{
		width: 90%;
		margin: 0 auto;}
}


/*accordion*/
.sec5 .accordion dd{
	padding: 1.5em 2em;
	border: solid 1px #E6E6E6;
	background-color: #FCFCFC;}

.sec5 .accordion dt:before{
	content: 'Q';
	font-size: 3rem;
	color: #878242;
	padding-right: .5em;}

.sec5 .accordion dd:before{
	content: 'A';
	font-size: 3rem;
	color: #878242;
	padding-right: .5em;}

.sec5 .accordion .accordion p{
	padding: 1em 0 0;}

.sec5 .accordion .accordion ul{
	padding: 0 0 0em;
	list-style: circle inside;}

.sec5 .accordion .accordion ul li{
	padding: 0em 0 0.5em 1em;}

/* effect
++--------------------------------------------++*/
.sec5 .accordion dt{
	position:relative;}

.sec5 .accordion dt .effect-a,
.sec5 .accordion dt .effect-b{
	display: block;
	position: absolute;
	width: 18px;
	height: 1px;
	border-top: 3px solid #564e41;
	top: 48%;
	right: 3%;}

.sec5 .accordion dt .effect-a{
	transform: rotate(90deg);}

.sec5 .accordion dt.active .effect-a{
	transform: rotate(0deg);
	transition: transform 0.4s linear;}

.sec5 .accordion dt.active .effect-b{
	content: "";
	display: none;}



/*++---------------------------------------------++*/
/* sec6 / last
++-----------------------------------------------++*/
.sec6{
	background-image: url(../../../uploads/img/specialCourse/sec6/bk1.jpg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 8em 0;
	margin: 0 0 6em;}

.sec6 h2{
	text-align: center;
	letter-spacing: 1em;
	text-indent: 1em;
	font-weight: bold;
	margin: 0 0 2em;
	color: #595959;}

.sec6 .flex{
	display: flex;
	justify-content: space-between;
	align-items: center;}

.sec6 .flex .left{
	font-size: 1.8rem;
	font-weight: bold;
	line-height: 1.8;
	color: #333333;
	background-color: rgba(255,255,255,0.5);
	padding: 2em 3em;}

.sec6 .flex .left p,
.sec6 .flex .left p span{
	color: #595959;
	font-weight: 600;}

.sec6 .flex .right{
	text-align: center;}

@media (min-width: 1025px){
	.sec6 h2{
		font-size: 3.6rem;}

	.sec6 .flex .left{
		flex: 1.5;
		font-size: 1.8rem;
		margin: 0 2em 0 0;
		padding: 2em 3em;}

	.sec6 .flex .right{
		flex: 1;}

	.sec6 .flex .right img{
		display: block;}
}

@media (max-width: 1024px){
	.sec6 h2{
		font-size: 2.4rem;}

	.sec6 .flex{
		flex-direction: column-reverse;}

	.sec6 .flex .left{
		width: 90%;
		margin: 0 auto;
		padding: 2em 2em;}

	.sec6 .flex .right{
		width: 75%;
		margin: 0 auto 4em;}

}



