@charset "utf-8";


/*kv*/
@media screen and (max-width: 640px) {
	#oc #kv .kv_title {
		width:100vw;
		padding:0;
	}
}

/*top_banner*/
#top_banner {
	margin-bottom:54px;
}
@media screen and (max-width: 640px) {
	#top_banner {
		margin-bottom:calc(10 / 640 * 100vw);
	}
}
/*main_content*/
#oc .main_content {
	background:linear-gradient(180deg,#fff 0%,#fff 28px,#aad9ec8 28px,#aad9ec 100%);
}	

/*detail*/
#oc #detail {
	padding-bottom:2px;
}
#oc #detail .wrap_top,#detail .wrap {
	flex-direction:column;
}
	#detail h2 img {
		padding: 0 0 30px 5px;
	}
	#detail .wrap dl {
		margin: 20px 0 17px;
	}
		#detail .wrap dl dt {
			padding-right:10px;
		}
		#detail .wrap dl.contact dt {
			background: url(../img/rebon_contact.png);
			width:160px;
		}
		#detail .wrap dl.venue dd {
			font-size:28px;
			font-weight:bold;
			padding: 23px 25px 20px 24px;
		}
		#detail .wrap dl.term dd {
			font-size:30px;
			font-weight:bold;
			padding: 23px 25px 17px 24px;
		}
			#detail .wrap dl.term dd .small {
				font-size:16px;
			}
		#detail .wrap dl.contact dd {
			padding: 23px 25px 30px 24px;
			font-size:22px;
		}
		#detail .wrap dl.contact dd .tell {
			font-weight:bold;
			font-size:32px;
			padding: 3px 0;
		}
		#detail .wrap dl.contact dd .tell strong {
			background:linear-gradient(transparent 45%, #FFF03A 45%);
		}
		#detail .wrap dl.contact dd .tell .small {
			font-size:22px;
		}
		#detail .wrap dl.contact dd p > .small {
			font-size:16px;
			display:block;
		}
		#detail .wrap dl.contact dd .mail a{
			font-size:18px;
			color:#2491DA;
			padding-left:30px;
			background:url(../img/mail_icon.png) no-repeat;
			background-size:contain;
		}
		#detail .wrap p {
			font-size:16px;
			color: #0082C8;
		}
	@media screen and (max-width: 640px) {
		#detail h2 {
			width:100vw;
			margin:0 calc(-20 / 640 * 100vw);
		}
		#detail h2 img {
			padding:0;
			width:100%
		}
	#detail .wrap dl {
		margin: calc(20 / 640 * 100vw) 0 calc(17 / 640 * 100vw);
	}
		#detail .wrap dl dt {
			width: calc(116 / 640 * 100vw);
			padding-right:0;
			font-size:calc(18 / 640 * 100vw);
			text-align:left;
			padding-left:calc(10 / 640 * 100vw);
			background: url(../img/rebon.png) no-repeat;
			background-size:100% 100%;
			height:calc(36 / 640 * 100vw);
			line-height:calc(36 / 640 * 100vw);
			top:calc(-20 / 640 * 100vw);
		}
		#detail .wrap dl.contact dt {
			background: url(../img/rebon_contact.png) no-repeat;
			background-size:100% 100%;
			width:calc(140 / 640 * 100vw);
		}
		#detail .wrap dl.venue dd {
			font-size:calc(26 / 640 * 100vw);
			padding: calc(26 / 640 * 100vw) calc(25 / 640 * 100vw) calc(21 / 640 * 100vw) calc(20 / 640 * 100vw);
		}
		#detail .wrap dl.term dd {
			font-size:calc(26 / 640 * 100vw);
			padding: calc(22 / 640 * 100vw) calc(25 / 640 * 100vw) calc(17 / 640 * 100vw) calc(20 / 640 * 100vw);
			line-height: 1.2;
		}
			#detail .wrap dl.term dd .small {
				font-size:calc(16 / 640 * 100vw);
			}
		#detail .wrap dl.contact dd {
			padding: calc(23 / 640 * 100vw) calc(25 / 640 * 100vw) calc(25 / 640 * 100vw) calc(20 / 640 * 100vw);
			font-size:calc(22 / 640 * 100vw);
		}
		#detail .wrap dl.contact dd .tell {
			font-size:calc(32 / 640 * 100vw);
			padding: calc(3 / 640 * 100vw) 0;
			margin-bottom:calc(9 / 640 * 100vw);
		}
		#detail .wrap dl.contact dd .tell .small {
			font-size:calc(22 / 640 * 100vw);
		}
		
		#detail .wrap dl.contact dd p:nth-child(1) {
			font-size:calc(22 / 640 * 100vw);
		}
		#detail .wrap dl.contact dd p > .small {
			font-size:calc(16 / 640 * 100vw);
		  line-height: 2.2;
		}
		#detail .wrap dl.contact dd .mail a{
			font-size:calc(18 / 640 * 100vw);
			padding-left:calc(30 / 640 * 100vw);
			background:url(../img/mail_icon.png) no-repeat;
			background-size:calc(30 / 640 * 100vw);
			background-position-y: bottom;
			margin-top: calc(5 / 640 * 100vw);
			display: block;
		}
		#detail .wrap p {
			font-size:calc(18 / 640 * 100vw);
		}
	}
/*course*/
#oc #course {
	padding: 55px 25px 20px;
}
	#oc #course .course_top {
		text-align:center;
		font-size:26px;
		margin-bottom:60px;
	}
		#oc #course .course_top strong {
			color: #0082C8;
			background:linear-gradient(transparent 45%, #FFF03A 45%);
		}
	#oc .box {
		position:relative;
		padding: 49px 25px 15px;
		margin-bottom: 70px;
	}
	#oc .box:nth-of-type(2) {
		padding: 57px 25px 13px;
	}
	#oc .box h3 {
		font-size:36px;
		color: #0082C8;
		text-align:center;
		position:absolute;
		top: -15px;
		left: 50%;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		width: 100%;
	}
	#oc .box .course_title {
			justify-content:start;
			position:relative;
			padding: 0 5px 0 12px;
	}
		#oc .box .course_title::after {
			content:"";
			background:url(../img/arrow07.png);
			width: 29px;
			height: 32px;
			display:block;
			position:absolute;
			top: 12px;
			right: 18px;
		}
		#oc #course .box .course_title ul {
			margin-right:12px;
		}
		#oc #course .box .course_title ul li {
			margin: 7px 4px;
		}
		#oc .box .course_title h4 {
			color:#2491DA;
			font-size:26px;
			padding-right:50px;
		}
			#oc .box .course_body {
				-webkit-backface-visibility: hidden;
				backface-visibility: hidden;
				transform: translateZ(0);
				transition: all 0.3s;
				height: 0;
				overflow: hidden;
				opacity: 0;
				color:#4B4B4B;
				margin: 16px 25px 3px;
			}
			#oc .box .course_body .date {
				color:#2491DA;
				font-size:36px;
				font-weight:bold;
				line-height:1;
				margin-bottom: 15px;
			}
			#oc .box .course_body .date .dot {
				font-size:24px;
			}
				#oc .box .course_body .date .small {
				font-size:14px;
			}
			#oc .box .course_body .course_dt {
				font-size:24px;
				font-weight:bold;
			}
				#oc .box .course_body .course_dt .small {
					font-size:14px;
				}
				#oc .box:nth-of-type(2) .course_body .course_dt .small {
					font-size:20px;
					display: block;
					line-height: 1;
				}
				#oc .box:nth-of-type(2) .course_body .course_dt .course_small {
					font-size:20px;
				}
			#oc #course .box .course_body .time_btn {
				color:#2491DA;
				margin: 39px 0 15px;
			}
			#oc #course .box .course_body .time_btn::before {
				content:"";
				background:url(../img/oc_icon_time.png);
				width:35px;
				height:40px;
				display:block;
				position:absolute;
				top:10px;
				left:15px;
			}
			#oc .toggle:checked + .Label + .course_body {
				height: auto;
				opacity: 1;
				transition: all .5s;
				padding:0 0 43px;
			}
			#oc .toggle:checked + .Label .course_title::after {
				transform: rotate(180deg) !important;
				top:23px !important;
				right:16px;
			}
			#oc .schedule .schedule_wrap {
				padding:12px 20px;
				margin-bottom: 17px;
			}
			#oc .schedule .schedule_wrap table th {
				color:#2491DA;
				width: 220px;
				font-size: 20px;
				padding:0 5px;
				text-align:left;
			}
			#oc .schedule .schedule_wrap table tr:last-child th,#oc .schedule .schedule_wrap table tr:last-child td {
				border-bottom:none;
			}
			#oc .schedule .schedule_wrap table td {
				width:auto;
				display:table-cell;
				padding:25px 4%;
			}
			#oc #course .request_btn {
				background:#2491DA;
				width:490px;
				text-align:center;
				font-size:24px;
				font-weight:bold;
				height:80px;
				border-radius:40px;
				position:relative;
				margin:19px auto 0;
			}
			#oc #course .request_btn a {
				display:block;
				color:#fff;
				text-decoration:none;
				width:100%;
				height:100%;
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: center;
			}
			#oc #course .request_btn a::after {
				content:"";
				background:url(../img/arrow08.png);
				width: 29px;
				height: 32px;
				display:block;
				position:absolute;
				top: 23px;
				right: 10px;
			}
			@media screen and (max-width: 640px) {
				#oc #course {
					padding:;
					margin: calc(28 / 640 * 100vw) 0 calc(35 / 640 * 100vw);
				}
				#oc #course .course_top {
					text-align: center;
					font-size: calc(26 / 640 * 100vw);
					margin-bottom: calc(45 / 640 * 100vw);
				}
					#oc .box {
						padding: calc(28 / 640 * 100vw) calc(20 / 640 * 100vw) calc(15 / 640 * 100vw);
						margin-bottom: calc(55 / 640 * 100vw);
					}
					#oc .box:nth-of-type(2) {
						padding: calc(57 / 640 * 100vw) calc(25 / 640 * 100vw) calc(13 / 640 * 100vw);
					}
					#oc .box h3 {
						font-size:calc(26 / 640 * 100vw);
						top: calc(-10 / 640 * 100vw);
					}
					#oc .box .course_title {
							padding: 0 calc(30 / 640 * 100vw) 0 calc(10 / 640 * 100vw);
					}
						#oc .box .course_title::after {
							background:url(../img/arrow07.png);
							background-size:contain;
							width:calc(29 / 640 * 100vw);
							height: calc(32 / 640 * 100vw);
							top: calc(12 / 640 * 100vw);
							right: calc(18 / 640 * 100vw);
						}
						#oc #course .box .course_title ul {
							margin-right:calc(5 / 640 * 100vw);
							width: calc(50 / 640 * 100vw);
						}
						#oc #course .box #course01 .course_title ul {
							margin-right:calc(5 / 640 * 100vw);
							width: calc(106 / 640 * 100vw);
						}
						#oc #course .box .course_title ul li {
							margin: calc(7 / 640 * 100vw) calc(3 / 640 * 100vw);
							width: calc(50 / 640 * 100vw);
						}
						#oc .box .course_title h4 {
							font-size:calc(24 / 640 * 100vw);
							padding:calc(17 / 640 * 100vw) 0 calc(15 / 640 * 100vw);
						}
							#oc .box .course_body {
								margin: calc(16 / 640 * 100vw) 0 calc(3 / 640 * 100vw);
							}
							#oc .box .course_body .date {
								font-size:calc(36 / 640 * 100vw);
								margin-bottom: calc(15 / 640 * 100vw);
							}
							#oc .box .course_body .date .dot {
								font-size:calc(24 / 640 * 100vw);
							}
								#oc .box .course_body .date .small {
								font-size:calc(14 / 640 * 100vw);
							}
							#oc .box .course_body .course_dt {
								font-size:calc(24 / 640 * 100vw);
								margin-bottom: calc(1 / 640 * 100vw);
							}
								#oc .box .course_body .course_dt .small {
									font-size:calc(14 / 640 * 100vw);
								}
								#oc .box:nth-of-type(2) .course_body .course_dt .small {
									font-size:calc(20 / 640 * 100vw);
								}
								#oc .box:nth-of-type(2) .course_body .course_dt .course_small {
									font-size:calc(20 / 640 * 100vw);
								}
								#oc .box .course_body .catch {
									line-height:1.875;
								}
							#oc #course .box .course_body .time_btn {
								margin: calc(10 / 640 * 100vw) 0 calc(10 / 640 * 100vw);
								line-height: calc(51 / 640 * 100vw);
							}
							#oc #course .box .course_body .time_btn::before {
								background:url(../img/oc_icon_time.png) no-repeat;
								background-size:contain;
								width:calc(29 / 640 * 100vw);
								height:calc(33 / 640 * 100vw);
								top:calc(8 / 640 * 100vw);
								left:calc(8 / 640 * 100vw);
							}
							#oc .toggle:checked + .Label + .course_body {
								padding:0 0 calc(15 / 640 * 100vw);
							}
							#oc .toggle:checked + .Label .course_title::after {
								top:calc(20 / 640 * 100vw) !important;
								right:calc(16 / 640 * 100vw);
							}
							#oc .schedule .schedule_wrap {
								padding:calc(2 / 640 * 100vw) calc(20 / 640 * 100vw);
								margin-bottom: calc(8 / 640 * 100vw);
							}
				#oc .schedule .schedule_wrap table th {
					width: 21% !important ;
					display:table-cell;
					font-size: calc(20 / 640 * 100vw);
					border-bottom:1px dotted #9A9A9A;
					text-align:left;
				}
				#oc .schedule .schedule_wrap table td {
					width: auto !important;
					padding: calc(16 / 640 * 100vw) 4% calc(16 / 640 * 100vw) 11%;
				}
			#oc #course .request_btn {
				width:calc(469 / 640 * 100vw);
				font-size:calc(22 / 640 * 100vw);
				height:calc(70 / 640 * 100vw);
				border-radius:calc(35 / 640 * 100vw);
				margin:calc(22 / 640 * 100vw) auto 0;
			}
			#oc #course .request_btn a::after {
				background:url(../img/arrow08.png) no-repeat;
				background-size:contain;
				width: calc(29 / 640 * 100vw);
				height: calc(32 / 640 * 100vw);
				top: calc(23 / 640 * 100vw);
				right: calc(10 / 640 * 100vw);
			}
			}
			
			
			#oc .box #course01 .course_title{
				background:#FFF03A;
			}
			#oc .box #course01 .course_body .time_btn {
				background:#FFF89D;
			}
			#oc .box #course01 .schedule .schedule_wrap {
				background:#FFFEE6;
			}
			
			
			#oc .box #course02 .course_title{
				background:#D3FF8D;
			}
			#oc .box #course02 .course_body .time_btn {
				background:#E9FEC6;
				margin: 35px 0 15px;
			}
			#oc .box #course02 .schedule .schedule_wrap {
				background:#F9FFEE;
				margin-bottom:0;
			}
			#oc .box #course02 .request_btn {
				margin:26px auto 24px;
			}
			#oc .box #course02 .catch {
				margin-top:13px;
			}
			@media screen and (max-width: 640px) {
				#oc .box #course02 .request_btn {
					margin:calc(26 / 640 * 100vw) auto calc(24 / 640 * 100vw);
				}
				#oc .box #course02 .course_body .time_btn {
					margin: calc(35 / 640 * 100vw) 0 calc(15 / 640 * 100vw);
				}
				#oc .box #course02 .catch {
					margin-top:calc(13 / 640 * 100vw);
				}
			}
			
			#oc .box #course03 .course_title{
				background:#FDD975;
			}
			#oc .box #course03 .course_body .date {
				margin-bottom: 19px;
			}
			#oc .box #course03 .course_body .time_btn {
				background:#FEECBB;
				margin: 35px 0 15px;
			}
			#oc .box #course03 .schedule .schedule_wrap {
				background:#FFF9EB;
			}
			#oc .box #course03 .catch {
				margin-top: 9px;
 				line-height: 1.8;
			}
			#oc .box #course03 .request_btn {
				margin: 22px auto 0;
			}
			#oc #course03 .toggle:checked + .Label + .course_body {
				padding: 0 0 60px;
			}
			@media screen and (max-width: 640px) {
				#oc .box #course03 .course_body .date {
					margin-bottom: calc(19 / 640 * 100vw);
				}
				#oc .box #course03 .course_body .time_btn {
					margin: calc(35 / 640 * 100vw) 0 calc(15 / 640 * 100vw);
				}
				#oc .box #course03 .catch {
					margin-top: calc(9 / 640 * 100vw);
				}
				#oc .box #course03 .request_btn {
					margin: calc(22 / 640 * 100vw) auto 0;
				}
				#oc #course03 .toggle:checked + .Label + .course_body {
					padding: 0 0 calc(60 / 640 * 100vw);
				}
			}
			
			
			#oc .box #course04 .course_title{
				background:#FFC9FF;
			}
			#oc .box #course04 .course_body .date {
				margin-bottom: 19px;
			}
			#oc .box #course04 .course_body .time_btn {
				background:#FDE4FE;
				margin: 30px 0 15px;
			}
			#oc .box #course04 .schedule .schedule_wrap {
				background:#FEF7FF;
			}
			#oc .box #course04 .catch {
				margin-top: 9px;
 				line-height: 1.8;
			}
			#oc .box #course04 .request_btn {
				margin: 24px auto 0;
			}
			#oc #course04 .toggle:checked + .Label + .course_body {
				padding: 0 0 75px;
			}
			@media screen and (max-width: 640px) {
				#oc .box #course04 .course_body .date {
					margin-bottom: calc(19 / 640 * 100vw);
				}
				#oc .box #course04 .course_body .time_btn {
					margin: calc(35 / 640 * 100vw) 0 calc(15 / 640 * 100vw);
				}
				#oc .box #course04 .catch {
					margin-top: calc(9 / 640 * 100vw);
				}
				#oc .box #course04 .request_btn {
					margin: calc(24 / 640 * 100vw) auto 0;
				}
				#oc #course04 .toggle:checked + .Label + .course_body {
					padding: 0 0 calc(75 / 640 * 100vw);
				}
			}
			
			
			#oc .box #course05 .course_title{
				background:#98F3FF;
			}
			#oc .box #course05 .course_body .time_btn {
				background:#CCF9FE;
				margin: 32px 0 17px;
			}
			#oc .box #course05 .schedule .schedule_wrap {
				background:#F0FDFF;
			}
			#oc #course05 .toggle:checked + .Label + .course_body {
				padding: 0 0 85px;
			}
			@media screen and (max-width: 640px) {
				#oc .box #course05 .course_body .time_btn {
					margin: calc(32 / 640 * 100vw) 0 calc(17 / 640 * 100vw);
				}
				#oc #course05 .toggle:checked + .Label + .course_body {
					padding: 0 0 calc(85 / 640 * 100vw);
				}
			}
			
			
			
			#oc .box #course06 .course_title{
				background:#D6D1FF;
			}
			#oc .box #course06 .course_body .time_btn {
				background:#EAE8FE;
				margin: 33px 0 15px;
			}
			#oc .box #course06 .schedule .schedule_wrap {
				background:#F9F8FF;
			}
			#oc #course06 .request_btn {
				margin:23px auto 0;
			}
			#oc #course06 .toggle:checked + .Label + .course_body {
				padding: 0 0 85px;
			}
			@media screen and (max-width: 640px) {
				#oc .box #course06 .course_body .time_btn {
					margin: calc(33 / 640 * 100vw) 0 calc(15 / 640 * 100vw);
				}
				#oc .box #course06 .request_btn {
					margin: calc(23 / 640 * 100vw) auto 0;
				}
				#oc #course06 .toggle:checked + .Label + .course_body {
					padding: 0 0 calc(85 / 640 * 100vw);
				}
			}

			
			
			#oc .box #course07 .course_title{
				background:#FFC4DD;
			}
			#oc .box #course07 .course_body .time_btn {
				background:#FDE1EE;
				margin: 30px 0 15px;
			}
			#oc .box #course07 .schedule .schedule_wrap {
				background:#FEF6FA;
				margin-bottom: 12px;
			}
			#oc #course07 .toggle:checked + .Label + .course_body {
				padding: 0 0 85px;
			}
			#oc #course07 .request_btn {
				width:499px;
			}
			@media screen and (max-width: 640px) {
				#oc #course07 .request_btn {
					width: calc(469 / 640 * 100vw);
				}
				#oc .box #course07 .course_body .time_btn {
					margin: calc(30 / 640 * 100vw) 0 calc(15 / 640 * 100vw);
				}
				#oc .box #course07 .schedule .schedule_wrap {
				margin-bottom: calc(12 / 640 * 100vw);
				}
				#oc #course07 .toggle:checked + .Label + .course_body {
					padding: 0 0 calc(85 / 640 * 100vw);
				}
				#oc #course07 .request_btn {
					width:calc(469 / 640 * 100vw);
				}
			}
			
			
			
			
			#oc .box #course08 .course_title{
				background:#95F0A7;
			}
			#oc .box #course08 .course_body .time_btn {
				background:#CAF8D3;
				margin: 30px 0 15px;
			}
			#oc .box #course08 .schedule .schedule_wrap {
				background:#EFFDF2;
				margin-bottom: 12px;
			}
			#oc #course08 .toggle:checked + .Label + .course_body {
				padding: 0 0 85px;
			}
			@media screen and (max-width: 640px) {
				#oc .box #course08 .course_body .time_btn {
					margin: calc(30 / 640 * 100vw) 0 calc(15 / 640 * 100vw);
				}
				#oc .box #course08 .schedule .schedule_wrap {
				margin-bottom: calc(12 / 640 * 100vw);
				}
				#oc #course08 .toggle:checked + .Label + .course_body {
					padding: 0 0 calc(85 / 640 * 100vw);
				}
			}
			
			
			#oc .box #course09 .course_title{
				background:#F5F560;
			}
			#oc .box #course09 .course_body .time_btn {
				background:#FAFAAF;
				margin: 25px 0 15px;
			}
			#oc .box #course09 .course_body .course_dt {
				line-height:1.3;
			}
			#oc .box #course09 .schedule .schedule_wrap {
				background:#FEFEE7;
				margin-bottom: 10px;
			}
			#oc #course09 .toggle:checked + .Label + .course_body {
				padding: 0 0 85px;
			}
			@media screen and (max-width: 640px) {
				#oc .box #course09 .course_body .time_btn {
					margin: calc(25 / 640 * 100vw) 0 calc(15 / 640 * 100vw);
				}
				#oc .box #course09 .schedule .schedule_wrap {
				margin-bottom: calc(10 / 640 * 100vw);
				}
				#oc #course09 .toggle:checked + .Label + .course_body {
					padding: 0 0 calc(85 / 640 * 100vw);
				}
			}
			
			
			#oc .box #course10 .course_title{
				background:#6EF5D1;
			}
			#oc .box #course10 .course_body .time_btn {
				background:#B6FAE8;
				margin: 30px 0 15px;
			}
			#oc .box #course10 .schedule .schedule_wrap {
				background:#E9FEF8;
			}
			#oc .box #course10 .course_body .catch {
				margin:12px 0 0;
				line-height:1.7;
			}
			#oc .box #course10 .course_body .catch .marker{
				background: linear-gradient(transparent 45%, #6EF5D1 45%);
				font-weight:bold;
				padding: 0 5px;
			}
			#oc #course10 .request_btn {
				margin:23px auto 0;
			}
			#oc #course10 .toggle:checked + .Label + .course_body {
				padding: 0 0 85px;
			}
			@media screen and (max-width: 640px) {
				#oc .box #course10 .course_body .time_btn {
					margin: calc(30 / 640 * 100vw) 0 calc(15 / 640 * 100vw);
				}
				#oc #course10 .request_btn {
					margin:calc(23 / 640 * 100vw) auto 0;
				}
				#oc #course10 .toggle:checked + .Label + .course_body {
					padding: 0 0 calc(85 / 640 * 100vw);
				}
			}	
			
			
			
			#oc #course11 .course_title{
				background:#FCB87E;
			}
			#oc .box #course11 .course_body .date {
				margin-bottom:10px;
			}
			#oc .box #course11 .course_body .time_btn {
				background:#FDDBBE;
				margin: 22px 0 15px;
			}
			#oc #course11 .schedule .schedule_wrap {
				background:#FEF4EC;
			}
			#oc #course11 .request_btn {
				width:500px;
				margin: 24px auto 0;
			}
			#oc #course11 .toggle:checked + .Label + .course_body {
				padding: 0 0 85px;
			}
			@media screen and (max-width: 640px) {
				#oc #course11 .request_btn {
					width: calc(469 / 640 * 100vw);
				margin: calc(24 / 640 * 100vw) auto 0;
				}
				#oc .box #course11 .course_body .time_btn {
					margin: calc(22 / 640 * 100vw) 0 calc(15 / 640 * 100vw);
				}
				#oc .box #course11 .course_body .course_dt .small {
					margin: calc(16 / 640 * 100vw) 0 calc(4 / 640 * 100vw);
				}
				#oc #course11 .toggle:checked + .Label + .course_body {
					padding: 0 0 calc(85 / 640 * 100vw);
				}
			}
			
			
			
			#oc #course12 .course_title{
				background:#B9CEFD;
			}
			#oc .box #course12 .course_body .time_btn {
				background:#DBE6FE;
				margin: 29px 0 15px;
			}
			#oc .box #course12 .course_body .course_dt {
				line-height:1.3;
			}
			#oc .box #course12 .course_body .course_dt .small {
				margin: 16px 0 4px;
			}
			#oc #course12 .schedule .schedule_wrap {
				background:#F4F8FF
			}
			#oc #course12 .request_btn {
				width:500px;
				margin: 26px auto 0;
			}
			#oc #course12 .toggle:checked + .Label + .course_body {
				padding: 0 0 85px;
			}
			@media screen and (max-width: 640px) {
				#oc #course12 .request_btn {
					width: calc(469 / 640 * 100vw);
					margin: calc(26 / 640 * 100vw) auto 0;
				}
				#oc .box #course12 .course_body .time_btn {
					margin: calc(29 / 640 * 100vw) 0 calc(15 / 640 * 100vw);
				}
				#oc .box #course12 .course_body .course_dt .small {
					margin: calc(16 / 640 * 100vw) 0 calc(4 / 640 * 100vw)
				}
				#oc #course12 .toggle:checked + .Label + .course_body {
					padding: 0 0 calc(85 / 640 * 100vw);
				}
			}
			
			
			
			#oc #course13 .course_title{
				background:#E8B9FD;
			}
			#oc #course13 .course_body .time_btn {
				background:#F4DCFE;
				margin: 35px 0 15px;
			}
			#oc #course13	 .schedule .schedule_wrap {
				background:#FCF5FF;
			}
			#oc #course13 .request_btn {
				width:609px;
			}
			#oc #course13 .toggle:checked + .Label + .course_body {
				padding: 0 0 85px;
			}
			@media screen and (max-width: 866px) {
			#oc #course13 .request_btn {
				width:100%;
				height:auto;
				padding:0 30px;
			}
			}
			@media screen and (max-width: 640px) {
				#oc .box #course13 .course_body .time_btn {
					margin: calc(35 / 640 * 100vw) 0 calc(15 / 640 * 100vw);
				}
				#oc #course13 .request_btn {
					width: calc(549 / 640 * 100vw);
				}
			}
			
			
			#oc .box #course14 .course_title{
				background:#7CE7F5;
			}
			#oc .box #course14 .course_body .time_btn {
				background:#BEF3FA;
				margin: 30px 0 15px;
			}
			#oc .box #course14 .schedule .schedule_wrap {
				background:#ECFCFE;
			}
			#oc .box #course14 .course_body .catch {
				margin:12px 0 0;
				line-height:1.7;
			}
			#oc .box #course14 .course_body .catch .marker{
				background: linear-gradient(transparent 45%, #6EF5D1 45%);
				font-weight:bold;
				padding: 0 5px;
			}
			#oc #course14 .request_btn {
				margin:23px auto 0;
			}
			#oc #course14 .toggle:checked + .Label + .course_body {
				padding: 0 0 85px;
			}
			@media screen and (max-width: 640px) {
				#oc .box #course14 .course_body .time_btn {
					margin: calc(30 / 640 * 100vw) 0 calc(15 / 640 * 100vw);
				}
				#oc #course14 .request_btn {
					margin:calc(23 / 640 * 100vw) auto 0;
				}
				#oc #course14 .toggle:checked + .Label + .course_body {
					padding: 0 0 calc(85 / 640 * 100vw);
				}
			}	
			

			#oc .box #course15 .course_title{
				background:#cbff8f;
			}
			#oc .box #course15 .course_body .time_btn {
				background:#cbff8f;
				margin: 30px 0 15px;
			}
			#oc .box #course15 .schedule .schedule_wrap {
				background:#f2ffe3;
			}
			#oc .box #course15 .course_body .catch {
				margin:12px 0 0;
				line-height:1.7;
			}
			#oc .box #course15 .course_body .catch .marker{
				background: linear-gradient(transparent 45%, #6EF5D1 45%);
				font-weight:bold;
				padding: 0 5px;
			}
			#oc #course15 .request_btn {
				margin:23px auto 0;
			}
			#oc #course15 .toggle:checked + .Label + .course_body {
				padding: 0 0 85px;
			}
			@media screen and (max-width: 640px) {
				#oc .box #course15 .course_body .time_btn {
					margin: calc(30 / 640 * 100vw) 0 calc(15 / 640 * 100vw);
				}
				#oc #course15 .request_btn {
					margin:calc(23 / 640 * 100vw) auto 0;
				}
				#oc #course15 .toggle:checked + .Label + .course_body {
					padding: 0 0 calc(85 / 640 * 100vw);
				}
			}	

            #oc .box #course16 .course_title{
				background:#7CE7F5;
			}
			#oc .box #course16 .course_body .time_btn {
				background:#BEF3FA;
				margin: 30px 0 15px;
			}
			#oc .box #course16 .schedule .schedule_wrap {
				background:#ECFCFE;
			}
			#oc .box #course16 .course_body .catch {
				margin:12px 0 0;
				line-height:1.7;
			}

			#oc .box #course16 .course_body .course_dt {
				line-height:1.3;
			}
			#oc .box #course16 .course_body .course_dt .small {
				margin: 16px 0 4px;
			}

			#oc .box #course16 .course_body .catch .marker{
				background: linear-gradient(transparent 45%, #6EF5D1 45%);
				font-weight:bold;
				padding: 0 5px;
			}
			#oc #course16 .request_btn {
				margin:23px auto 0;
			}
			#oc #course16 .toggle:checked + .Label + .course_body {
				padding: 0 0 85px;
			}
			@media screen and (max-width: 640px) {
				#oc .box #course16 .course_body .time_btn {
					margin: calc(30 / 640 * 100vw) 0 calc(15 / 640 * 100vw);
				}
				#oc #course16 .request_btn {
					margin:calc(23 / 640 * 100vw) auto 0;
				}
				#oc ##course16 .toggle:checked + .Label + .course_body {
					padding: 0 0 calc(85 / 640 * 100vw);
				}
			}

            #oc .box #course17 .course_title{
				background:#96ffe0;
			}
			#oc .box #course17 .course_body .time_btn {
				background:#96ffe0;
				margin: 30px 0 15px;
			}
			#oc .box #course17 .schedule .schedule_wrap {
				background:#d2fff2;
			}
			#oc .box ##course17 .course_body .catch {
				margin:12px 0 0;
				line-height:1.7;
			}
			#oc .box #course17 .course_body .catch .marker{
				background: linear-gradient(transparent 45%, #96ffe0 45%);
				font-weight:bold;
				padding: 0 5px;
			}
			#oc ##course17 .request_btn {
				margin:23px auto 0;
			}
			#oc #course17 .toggle:checked + .Label + .course_body {
				padding: 0 0 85px;
			}
			@media screen and (max-width: 640px) {
				#oc .box #course17 .course_body .time_btn {
					margin: calc(30 / 640 * 100vw) 0 calc(15 / 640 * 100vw);
				}
				#oc #course17 .request_btn {
					margin:calc(23 / 640 * 100vw) auto 0;
				}
				#oc ##course17 .toggle:checked + .Label + .course_body {
					padding: 0 0 calc(85 / 640 * 100vw);
				}
			}	
			
            #oc .box #course18 .course_title{
				background:#fff89d;
			}
			#oc .box #course18 .course_body .time_btn {
				background:#fffab4;
				margin: 30px 0 15px;
			}
			#oc .box #course18 .schedule .schedule_wrap {
				background:#fffbca;
			}
			#oc .box ##course18 .course_body .catch {
				margin:12px 0 0;
				line-height:1.7;
			}
			#oc .box #course18 .course_body .catch .marker{
				background: linear-gradient(transparent 45%, #96ffe0 45%);
				font-weight:bold;
				padding: 0 5px;
			}
			#oc ##course18 .request_btn {
				margin:23px auto 0;
			}
			#oc #course18 .toggle:checked + .Label + .course_body {
				padding: 0 0 85px;
			}
			@media screen and (max-width: 640px) {
				#oc .box #course18 .course_body .time_btn {
					margin: calc(30 / 640 * 100vw) 0 calc(15 / 640 * 100vw);
				}
				#oc #course18 .request_btn {
					margin:calc(23 / 640 * 100vw) auto 0;
				}
				#oc ##course18 .toggle:checked + .Label + .course_body {
					padding: 0 0 calc(85 / 640 * 100vw);
				}
			}	  

			@media screen and (max-width: 640px) {
				.footer_nav ul li{
					width: 60%;
				}
			}