@charset "utf-8";
/*===============================================
 コース案内
===============================================*/

#gNav li#g_course a span {
	background:url(../../images/1x1.png) repeat;
}

.body_class_course .mainImage {
	line-height: 0;
	padding: 0 0 1px;
}


/* index
-----------------------------------------------*/

/* year_list */
.body_class_course ul.year_list {
	padding: 20px;
}
.body_class_course ul.year_list li {
	width: 260px;
	float: left;
	padding: 0 60px 0 0;
}
.body_class_course ul.year_list li.last_year { padding: 0; }
.body_class_course ul.year_list li h2 { padding: 0 0 15px; }
.body_class_course ul.year_list li p.link { padding: 10px 0 0; }

h2.course {
	border-top: solid 5px #7a0029;
	padding:15px 20px 15px 20px;
	margin: 0 20px;
	font-weight:bold;
	font-size:133%;
	color: #7a0029;
}

.top_first {
	padding: 20px 20px 0px 35px;
}

.body_class_course div.top_first p.icn {
	float: left;
}

.body_class_course div.top_first div.detail {
	width: 305px;
	padding: 0 12px 0 15px;
	float: left;
}

.body_class_course div.top_first h3 {
	padding: 5px 0 10px;
	margin: 0 0 15px;
	font-size: 208%;
	border-bottom: #5e5e5e solid 1px;
	color: #7a0029;
}

.body_class_course div.top_first p.link {
	padding: 15px 0 0;
}

.body_class_course div.top_first ul.course_img { padding: 0 0 0 7px; }
.body_class_course div.top_first ul.course_img li {
	float: left;
	padding: 0 0 0 3px;
	border-top: none;
}

/* 2年次・3年次 */
div.year_list {
	margin: 0 0 0px 35px;
}
div.year_list li {
	float:left;
}
div.year_list li.year2 {
	width:46%;
}
div.year_list li.year3 {
	width:54%;
}
div.year_list li img {
	float:left;
	margin: 0 10px 0 0;
}
div.year_list li p {
	float:left;
	margin: 0 0 0 0%;
	padding:20px 0 0 0;
}
div.year_list li.year2 p {
	width:60%;
}
div.year_list li.year3 p {
	width:50%;
}

/* course_list */
.body_class_course ul#course_list { margin: 0 20px 120px; }
.body_class_course ul#course_list li {
	padding: 20px 0 20px 15px;
	border-top: #7a0029 solid 3px;
}
.body_class_course ul#course_list li p.icn {
	float: left;
}

.body_class_course ul#course_list div.detail {
	width: 305px;
	padding: 0 12px 0 15px;
	float: left;
}

.body_class_course ul#course_list li h3 {
	padding: 5px 0 10px;
	margin: 0 0 15px;
	font-size: 208%;
	border-bottom: #5e5e5e solid 1px;
}
.body_class_course ul#course_list li.arts h3 { color: #009944; }
.body_class_course ul#course_list li.manga h3 { color: #6eb92b; }
.body_class_course ul#course_list li.modeling h3 { color: #e8340c; }
.body_class_course ul#course_list li.design h3 { color: #0068b7; }
.body_class_course ul#course_list li.media h3 { color: #f08200; }	

.body_class_course ul#course_list li p.link {
	padding: 15px 0 0;
}

.body_class_course ul#course_list li ul.course_img { padding: 0 0 0 7px; }
.body_class_course ul#course_list li ul.course_img li {
	float: left;
	padding: 0 0 0 3px;
	border-top: none;
}

h2.first_course_menu {
	width: 70%;
	margin: 0 auto 15px;
	padding: 10px;
	font-size: 116%;
	background-color: #f0f0f0;
	border-top: dotted 1px #999;
	border-bottom: dotted 1px #999;
	color: #111;
	line-height: 1;
}
ul#course_menu {
	width: 70%;
	margin: 0 auto;
}
ul#course_menu li {
	width: 18%;
	padding: 0 1%;
	float: left;
	text-align: center;
}

ul#course_menu li p { padding: 5px 0 0; line-height: 1.4; }


@media screen and (max-width: 640px){
	.body_class_course ul.year_list li {
		width: 28%;
		float: left;
		padding: 0 2% 0;
	}
  	.body_class_course ul#course_list { margin-left: 10px;margin-right: 10px;  }

	.body_class_course ul#course_list li p.link { text-align: right; }
	.body_class_course ul.year_list li.second_year { width: 33%; }
	.body_class_course ul.year_list li.last_year { width: 27%; padding: 0 2% 0; }
	.body_class_course ul#course_list li p.icn { width: 25%; }
	.body_class_course ul#course_list div.detail {
		width: 70%;
		padding: 0 2%;
	}
	.body_class_course ul#course_list li ul.course_img {
		width: 70%;
		float: right;
		padding: 0 2%;
	}
	.body_class_course ul#course_list li ul.course_img li {
		width: 48%;
		padding: 20px 0 0 1%;
	}
	
	.body_class_course div.top_first { padding-left:10px;}
	.body_class_course div.top_first p.link { text-align: right; }
	.body_class_course div.top_first p.icn { width: 25%; }
	.body_class_course div.top_first div.detail {
		width: 70%;
		padding: 0 2%;
	}
	.body_class_course div.top_first ul.course_img {
		width: 70%;
		float: right;
		padding: 0 2%;
	}
	.body_class_course div.top_first ul.course_img li {
		width: 48%;
		padding: 20px 0 0 1%;
	}

	h2.first_course_menu { width: 82%; }
	ul#course_menu { width: 85%; }
	

	.body_class_course div.year_list li.year2 img { height: 87px; }
	.body_class_course div.year_list li.year3 img { height: 87px; }

	div.year_list { padding:10px 0 20px 10px; margin:0;}
	div.year_list li.year2 p {
		width:98%;
		padding-right:2%;
	}
	div.year_list li.year3 p {
		padding-left:6%;
		width:84%;
	}

	
}

/* first
-----------------------------------------------*/

.first_section {
	padding: 20px 20px 2px;
}
.first_section p.icn {
	float: left;
}
.first_section div.detail {
	width: 380px;
	padding: 0 0 0 20px;
	float: left;
}
.first_section div.detail h2 {
	padding: 15px 0 15px;
}
.first_section p.description {
	float: right;
}

/* first_list */
.body_class_course ul#first_list { margin: 20px 20px 50px; }
.body_class_course ul#first_list li {
	padding: 20px 0 20px 15px;
	border-top: #7a0029 solid 3px;
}

.body_class_course ul#first_list li div.title {
	width: 170px;
	float: left;
}
.body_class_course ul#first_list li div.title h3 {
	padding: 0 0 10px;
	margin: 0 0 15px;
	border-bottom: #7a0029 solid 1px;
	font-size: 93%;
	font-weight: normal;
	color: #666666;
	vertical-align: middle;
	line-height: 1;
}
.body_class_course ul#first_list li div.title h3 span {
	font-size: 231%;
	color: #7a0029;
	font-weight: bold;
	padding: 0 0.2em 0 0;
}
.body_class_course ul#first_list li div.title h3.spacing span {
	letter-spacing: 0.2em;
	padding: 0;
}
	
.body_class_course ul#first_list li p.text {
	display: block;
	float: left;
	width: 275px;
	padding: 0 12px 0 15px; 
}

.body_class_course ul#first_list li ul.first_img { padding: 0 0 0 7px; }
.body_class_course ul#first_list li ul.first_img li {
	float: left;
	padding: 0 0 0 3px;
	border-top: none;
}

@media screen and (max-width: 640px){
	.first_section {
		padding: 20px;
	}
	.first_section p.icn {
		width: 15%;
	}
	.first_section div.detail {
		width: 40%;
		padding: 0 0 0 3%;
		float: left;
	}
	.first_section div.detail h2 {
		padding: 0 0 10px;
	}
	.first_section p.description {
		width: 40%;
	}
	.body_class_course ul#first_list li div.title {
		width: 30%;
	}
	.body_class_course ul#first_list li p.text {
		width: 65%;
		padding: 0 2% 0 2%;
	}
	.body_class_course ul#first_list li ul.first_img {
		width: 65%;
		float: right;
		padding: 0 2%;
	}
	.body_class_course ul#first_list li ul.first_img li {
		width: 48%;
		padding: 20px 0 0 1%;
	}
}

/* course
-----------------------------------------------*/

.body_class_course #mainTitle {
	padding: 0 0 1px 0;
	margin: 0;
}
.body_class_course .course_title {
	width: 285px;
	height: 430px;
	float: left;
}
.body_class_course #mainTitle.arts .course_title { background: #009944; }
.body_class_course #mainTitle.manga .course_title { background: #87b73e; }
.body_class_course #mainTitle.design .course_title { background: #0068b2; }
.body_class_course #mainTitle.modeling .course_title { background: #c73a18; }
.body_class_course #mainTitle.media .course_title { background: #d68013; }

.body_class_course .course_title p {
	width: 236px;
	display: block;
	margin: 0 auto;
	color: #fff;
}

.body_class_course .course_title p.title {
	width: 260px;
	text-align: center;
	padding: 25px 0 15px;
}

.body_class_course div#mainTitle p.img {
	float: right;
	line-height: 0;
}

.body_class_course .top_section {
	padding: 2%;
}
.body_class_course .top_section p.img { width: 30%; float: left; }
.body_class_course .top_section div.detail {
	width: 68%;
	float: right;
}
.body_class_course .top_section div.detail h2 { padding: 15px 0; }

.body_class_course .section {
	border-top: #7a0029 solid 3px;
	padding: 20px 0 40px 20px;
}

.body_class_course .section h3 {
	padding: 0 0 10px;
	margin: 0 20px 15px 0;
	font-size: 216%;
	color: #7a0029;
	border-bottom: #7a0029 solid 1px;
	line-height: 1;
}

div.curriculum {
	padding: 0 0 30px;
}

.body_class_course .study_contents {
	width: 280px;
	float: left;
}
.body_class_course .study_contents h3 {
	margin: 0 0 15px 0;
}

table.curriculum {
	width: 570px;
	float: right;
}

table.curriculum thead th { color: #7a0029; }

table.curriculum th, table.curriculum td {
	border: 1px solid #7a0029;
	padding: 10px;
	vertical-align: top;
	text-align: left;
}
table.curriculum td { white-space: nowrap; }

table.curriculum th.common { width: 20em; }

table.curriculum dl dt {
	float: left;
}
table.curriculum dl.indent dt {
	float: none;
}
table.curriculum dl.dt_07 dd {
	padding-left: 7em;
}
table.curriculum dl.dt_04 dd {
	padding-left: 4em;
}

.body_class_course ol.task { background: #FFF; }

ol.task li { float: left; }
	ol.task_2 li {
		width: 48%;
		padding: 0 4% 20px 0;
	}
	ol.task_3 li {
		width: 32%;
		padding: 0 2% 20px 0;
	}
		
ol.task li.last {
	padding: 0 0 20px 0;
}
	
ol.task li h4 {
	font-size: 185%;
	font-weight: bold;
}
ol.arts li h4 { color: #009944; }
ol.manga li h4 { color: #64a927; }
ol.design li h4 { color: #005fa7; }
ol.modeling li h4 { color: #d3300b; }
ol.media li h4 { color: #da7700; }

	ol.task_2 div.detail { width: 68%; float: left; }
	ol.task_2 p.txt { padding: 15px 0 0; }
	ol.task p.img { float: right; }
	ol.task_2.media div.detail { width: 60%; }

	ol.task_3 p { padding: 15px 0 0; }
	ol.task_3 p.txt { width: 52%; float:left; }	

ol.task li h4 img {
	padding: 0 10px 0 0;
	vertical-align: middle;
}

ol.task li h4 span.small { font-size: 77%; padding: 0 0 0 5px; }
ol.task li h4.clearfix img { float: left; }
ol.task li h4.clearfix span { display: inline-block; padding: 15px 0 0; }

.body_class_course .section_2 {
	padding: 20px 20px 40px;
}

.body_class_course .section_2 h3 {
	margin: 0 0 15px 0;
	position: relative;
}
.body_class_course .section_2 h3 span {
	position: absolute;
	right: 0;
	font-size: 62%;
	line-height: 1.4;
}

p.voice_img { float: left; }
p.voice_txt {
	width: 395px;
	float:right;
	line-height:180%;
	font-size:117%;
}

ul.img_list li {
	float: left;
	padding: 0 30px 0 0;
}

ul.img_list li.last {
	padding: 0;
}

@media screen and (max-width: 640px){
	.body_class_course .course_title {
		width: 100%;
		height: 100%;
		padding: 30px 0;
	}
	.body_class_course .course_title p.title {
		width: 30%;
		float: left;
		padding: 0 0 0 5%;
	}
	.body_class_course .course_title p {
		width: 55%;
		padding: 0 0 0 40%;
	}
	.body_class_course .course_title p.img { width: 100%; }	
	
	.body_class_course .top_section div.detail h2 { width: 95%; padding: 5px 0 15px; }
	
	table.curriculum { width: 100%; }
	table.curriculum dl dd { width: 100%; }
	table.curriculum th, table.curriculum td { padding: 2%; }
	table.curriculum td { white-space: normal; }
	
	.body_class_course .section {
		width: 94%;
		margin: 0 auto;
		padding: 20px 2% 50px;
	}
	.body_class_course .study_contents {
		width: 100%;
		float: none;
		padding: 0 0 20px;
	}
	ol.task li h4 { font-size: 131%; }
		ol.task_2 li { padding: 0 2% 20px; width: 96%; }
		ol.task_2.media div.detail { width: 65%; }
		ol.task_3 li { padding: 0 10% 20px; width: 80%; }
		ol.task_3 li p.txt { width: 65%; }
			
		ol.task_2 li.last { padding: 0 2% 20px; }
		ol.task_3 li.last { padding: 0 10% 20px; }
		.body_class_course .section_2 h3 span {
			position: static;
			display:block;
			float: right;
		}
	p.voice_img {
		float: none;
		padding: 0 0 20px;
		text-align: center;
	}
	p.voice_txt {
		width: 90%;
		float: none;
		padding: 0 5px 0;
	}
	
	ul.img_list li {
		width: 29%;
		padding: 0 2% 0;
	}
	
	ul.img_list li.last {
		padding: 0 2% 0;
	}
}

@media screen and (max-width: 520px){
	table.curriculum dl dt { float: none; }
	table.curriculum dl.dt_07 dd,
	table.curriculum dl.dt_04 dd { padding-left: 0; }
	ol.task_2 p.img { width: 30%; text-align: right; }
	ol.task_3 p.img { width: 33%; text-align: right; }
	.body_class_course .section_2 h3 { font-size: 153.9%; }
	.body_class_course .section_2 h3 span { font-size: 77%; }
	ol.task li h4 img { width: 20%; }
}