@charset "UTF-8";


/* -----------------------------------------------------------------
   course_contents
----------------------------------------------------------------- */
#course_contents{
	width: 1000px;
	margin:0 auto;
	}
	#course_contents h3{
		font-size: 2rem;
		line-height: 2.2rem;
		font-weight: bold;
		margin:0 0 20px 0;
	}
	#course_contents .tabs {
		margin-top: 30px;
		padding-bottom: 60px;
		background-color: #fff;
		width: 1000px;
		margin: 0 auto;
	}
	#course_contents .tabs .lab{
		font-size: 1.1rem;
		line-height: 1.5rem;
}
/* ------------------- */
#course_contents .tab_item_a {
	width: calc(100%/2);
	height: 95px;
	border-bottom: 8px solid #F09393;
	background-color: #F7C3BF;
	font-size: 1.7rem;
	line-height: 2.4rem;
	text-align: center;
	color: #fff;
	display: block;
	float: left;
	text-align: center;
	font-weight: bold;
	transition: all 0.2s ease;
	padding:15px 0 0 0;
	}
	#course_contents .tab_item_a:hover {
		opacity: 0.75;
}
#course_contents .tabs input:checked + .tab_item_a {
  background-color: #F09393;
  color: #fff;
}
/* ------------------- */
#course_contents .tab_item_b {
	width: calc(100%/3);
	height: 95px;
	border-bottom: 8px solid #F2933B;
	background-color: #F8C28C;
	font-size: 1.7rem;
	line-height: 2.4rem;
	text-align: center;
	color: #fff;
	display: block;
	float: left;
	text-align: center;
	font-weight: bold;
	transition: all 0.2s ease;
	padding:15px 0 0 0;
	}
	#course_contents .tab_item_a:hover {
		opacity: 0.75;
}
#course_contents .tabs input:checked + .tab_item_b {
  background-color: #F2933B;
  color: #fff;
}
/* ------------------- */
#course_contents .tab_item_c {
	width: calc(100%/2);
	height: 95px;
	border-bottom: 8px solid #E0CA00;
	background-color: #F3E377;
	font-size: 1.7rem;
	line-height: 2.4rem;
	text-align: center;
	color: #fff;
	display: block;
	float: left;
	text-align: center;
	font-weight: bold;
	transition: all 0.2s ease;
	padding:15px 0 0 0;
	}
	#course_contents .tab_item_a:hover {
		opacity: 0.75;
}
#course_contents .tabs input:checked + .tab_item_c {
  background-color: #E0CA00;
  color: #fff;
}
/* ------------------- */
#course_contents .tab_item_d {
	width: calc(100%/2);
	height: 95px;
	border-bottom: 8px solid #6FBD62;
	background-color: #ACD59A;
	font-size: 1.7rem;
	line-height: 2.4rem;
	text-align: center;
	color: #fff;
	display: block;
	float: left;
	text-align: center;
	font-weight: bold;
	transition: all 0.2s ease;
	padding:15px 0 0 0;
	}
	#course_contents .tab_item_a:hover {
		opacity: 0.75;
}
#course_contents .tabs input:checked + .tab_item_d {
  background-color: #6FBD62;
  color: #fff;
}
/* ------------------- */
#course_contents .tab_item_e {
	width: calc(100%/2);
	height: 95px;
	border-bottom: 8px solid #00B4C1;
	background-color: #8DD0D7;
	font-size: 1.7rem;
	line-height: 2.4rem;
	text-align: center;
	color: #fff;
	display: block;
	float: left;
	text-align: center;
	font-weight: bold;
	transition: all 0.2s ease;
	padding:15px 0 0 0;
	}
	#course_contents .tab_item_a:hover {
		opacity: 0.75;
}
#course_contents .tabs input:checked + .tab_item_e {
  background-color: #00B4C1;
  color: #fff;
}
/* ------------------- */
#course_contents .tab_item_f {
	width: calc(100%/2);
	height: 95px;
	border-bottom: 8px solid #00A5EA;
	background-color: #67C7F2;
	font-size: 1.7rem;
	line-height: 2.4rem;
	text-align: center;
	color: #fff;
	display: block;
	float: left;
	text-align: center;
	font-weight: bold;
	transition: all 0.2s ease;
	padding:15px 0 0 0;
	}
	#course_contents .tab_item_a:hover {
		opacity: 0.75;
}
#course_contents .tabs input:checked + .tab_item_f {
  background-color: #00A5EA;
  color: #fff;
}
/* ------------------- */
#course_contents .tab_item_g {
	width: calc(100%/2);
	height: 95px;
	border-bottom: 8px solid #0071BE;
	background-color: #69A1D7;
	font-size: 1.7rem;
	line-height: 2.4rem;
	text-align: center;
	color: #fff;
	display: block;
	float: left;
	text-align: center;
	font-weight: bold;
	transition: all 0.2s ease;
	padding:15px 0 0 0;
	}
	#course_contents .tab_item_a:hover {
		opacity: 0.75;
}
#course_contents .tabs input:checked + .tab_item_g {
  background-color: #0071BE;
  color: #fff;
}
/* ------------------- */
#course_contents .tab_item_h {
	width: calc(100%/2);
	height: 95px;
	border-bottom: 8px solid #865BA3;
	background-color: #B59BC8;
	font-size: 1.7rem;
	line-height: 2.4rem;
	text-align: center;
	color: #fff;
	display: block;
	float: left;
	text-align: center;
	font-weight: bold;
	transition: all 0.2s ease;
	padding:15px 0 0 0;
	}
	#course_contents .tab_item_a:hover {
		opacity: 0.75;
}
#course_contents .tabs input:checked + .tab_item_h {
  background-color: #865BA3;
  color: #fff;
}
/* ------------------- */
#course_contents .tab_item_i {
	width: calc(100%/2);
	height: 95px;
	border-bottom: 8px solid #B16DAA;
	background-color: #D0ABCF;
	font-size: 1.7rem;
	line-height: 2.4rem;
	text-align: center;
	color: #fff;
	display: block;
	float: left;
	text-align: center;
	font-weight: bold;
	transition: all 0.2s ease;
	padding:15px 0 0 0;
	}
	#course_contents .tab_item_a:hover {
		opacity: 0.75;
}
#course_contents .tabs input:checked + .tab_item_i {
  background-color: #B16DAA;
  color: #fff;
}
/* ------------------- */
#course_contents .tab_item_j {
	width: calc(100%/2);
	height: 95px;
	border-bottom: 8px solid #EE8074;
	background-color: #F6B7AA;
	font-size: 1.7rem;
	line-height: 2.4rem;
	text-align: center;
	color: #fff;
	display: block;
	float: left;
	text-align: center;
	font-weight: bold;
	transition: all 0.2s ease;
	padding:15px 0 0 0;
	}
	#course_contents .tab_item_a:hover {
		opacity: 0.75;
}
#course_contents .tabs input:checked + .tab_item_j {
  background-color: #EE8074;
  color: #fff;
}
/* ------------------- */

#course_contents .tab_content {
	display: none;
	padding: 20px 40px 0;
	clear: both;
	overflow: hidden;
	}
	#course_contents .tab_content h3{	
		font-size: 1.55rem;
		line-height: 2rem;
		font-weight: bold;
		margin:5px;
		padding:10px;
	}
	#course_contents .tab_content h3.c_a{	
		background-color:#FDF0EE;
	}
	#course_contents .tab_content h3.c_b{	
		background-color:#FEF3E7;
	}
	#course_contents .tab_content h3.c_c{	
		background-color:#FAF3C8;
	}
	#course_contents .tab_content h3.c_d{	
		background-color:#EBF5E7;
	}
	#course_contents .tab_content h3.c_e{	
		background-color:#D6EDF0;
	}
	#course_contents .tab_content h3.c_f{	
		background-color:#DFF2FC;
	}
	#course_contents .tab_content h3.c_g{	
		background-color:#EAF0F9;
	}
	#course_contents .tab_content h3.c_h{	
		background-color:#F3EFF7;
	}
	#course_contents .tab_content h3.c_i{	
		background-color:#EDE2EF;
	}
	#course_contents .tab_content h3.c_j{	
		background-color:#FCE4DD;
	}
	#course_contents .tab_content p{	
		text-align:left;
		line-height: 1.5rem;
	}
	#course_contents .tab_content .photo{	
		margin:5px;
	}
	#course_contents .tab_content .photo img{	
		width:600px;
		margin:10px 0;
	}
	#course_contents .tab_content p.midashi{	
		font-size: 1.15rem;
		line-height: 1.4rem;
		font-weight: bold;
		margin:15px 0 7px;
	}

/*ラジオボタンを全て消す*/
input[name="tab_item_a"],[name="tab_item_b"],[name="tab_item_c"],[name="tab_item_d"],[name="tab_item_e"],[name="tab_item_f"],[name="tab_item_g"],[name="tab_item_h"],[name="tab_item_i"],[name="tab_item_j"] {
  display: none;
}

/*選択されているタブのコンテンツのみを表示*/
#all:checked ~ #all_content,
#programming:checked ~ #programming_content,
#design:checked ~ #design_content {
  display: block;
}


/* --- responsive --- */
@media screen and (max-width:1000px){
	#course_contents{
		width: 100%;
	}
	#course_contents h3{
		font-size: 1.7rem;
		line-height: 2rem;
	}
	#course_contents .tabs {
		width: 100%;
	}
	#course_contents .tabs .lab{
		font-size: 0.8rem;
		line-height: 1.2rem;
	}
	#course_contents .tab_item_a,#course_contents .tab_item_b,#course_contents .tab_item_c,#course_contents .tab_item_d,#course_contents .tab_item_e,#course_contents .tab_item_f,#course_contents .tab_item_g,#course_contents .tab_item_h,#course_contents .tab_item_i,#course_contents .tab_item_j {
		height: 110px;
		font-size: 1.4rem;
		line-height: 2rem;
	}
	#course_contents .tab_content h3{	
		font-size: 1.3rem;
		line-height: 1.8rem;
		padding:16px 10px;
	}
	#course_contents .tab_content p{	
		text-align:left;
		line-height: 1.3rem;
	}
	#course_contents .tab_content .photo img{	
		width: 100%;
	}
}


/* -----------------------------------------------------------------
  setting
----------------------------------------------------------------- */
.pc{display:block !important;}
.sp{display:none !important;}
.pc_i{display:inline-block !important;}
.sp_i{display:none !important;}
@media only screen and (max-width:1000px){
	.pc{display:none !important;}
	.sp{display:block !important;}
	.pc_i{display:none !important;}
	.sp_i{display:inline-block !important;}
}

.hr_dotted{border-bottom:1px dotted #999999;margin-bottom:15px;padding-bottom:15px;}

.btn{
	width:fit-content;
	margin:40px auto 0px;
	padding:10px 30px;
	background-color:#007F2C;
	-moz-border-radius:12px;
	-webkit-border-radius:12px;
	border-radius:12px;
	}
	.btn a{
		font-size: 1.15rem;
		font-weight: bold;
		color:#fff;
	}
	.btn:hover{
		opacity:0.6;
}
/* --- responsive --- */
@media screen and (max-width:1000px){
	.btn a{
		font-size: 1rem;
	}

}