@charset "UTF-8";
/*-----------------------------------------------------

	Top CSS (LastUpDate:2012.07.02)
	
		- Contents Layout
		- Main Area
		- Contents Area
		- Index Footer

-----------------------------------------------------*/


/*-----------------------------------------------------

	Contents Layout

-----------------------------------------------------*/
#ContentsArea {
	margin-top: 0px;
}

/*-----------------------------------------------------
	SNS
-----------------------------------------------------*/
#SNS {
	margin-top: 30px;
}

#SNS ul li {
	margin: 0 5px 0 0 !important;
	padding: 0 0 0 0 !important;
	width: auto !important;
	border: none !important;
	float: left;
	display: inline;
}


/*-----------------------------------------------------

	Main Area

-----------------------------------------------------*/
#MainArea {
	width: 900px;
	height: 285px;
	overflow: hidden;
}
    /* 20121127 ここから追記 */
    
    #MainArea {
	    position: relative;
    }    

    #MainArea #index_mainvisual {
		
    }
		
		#MainArea #index_mainvisual ul#mvs{
			position: relative;	
		}
		
			#MainArea #index_mainvisual ul#mvs li.mv {
				position: absolute;
				top:0;
				left:0px;				
			}
	
	#MainArea #index_mainvisual_thumbs {
		width: 170px;
		height: 285px;
    	position: absolute;
		top: 0;
		right: 0;
		cursor: pointer;
    }
		
		#MainArea #index_mainvisual_thumbs ul#thumbs {	
    		width: 170px;
    		height: 249px;		
    		position: absolute;
			top: 18px;
			right: 0;
			overflow: hidden;
		}
			#MainArea #index_mainvisual_thumbs ul#thumbs .thumb {
				position: absolute;
			}
			    
			    #MainArea #index_mainvisual_thumbs ul#thumbs li img {
    			    border: solid 1px #ffffff;
			    }
			    
			    #MainArea #index_mainvisual_thumbs ul#thumbs .a img {
    			    border: solid 1px #0594ce;
			    }
			
        #MainArea #index_mainvisual_thumbs #arrowUp{
			position: absolute;
			top: 0;
			right: 0;
			width: 170px;
			height: 15px;
			background: url("../img/index_btn_arrowup.gif") no-repeat;
		}

		#MainArea #index_mainvisual_thumbs #arrowDown{
			position: absolute;
			bottom: 0;
			right: 0;
			width: 170px;
			height: 15px;
			background: url("../img/index_btn_arrowdown.gif") no-repeat;	
		}
    
    /* 20121127 ここまで追記 */

/*-----------------------------------------------------

	Contents Area

-----------------------------------------------------*/
#Contents {
	width: 650px;
	float: right;
}

#Contents .ContentsBox {
	margin-left: 5px;
}


/*-----------------------------------------------------
	Special Banner
-----------------------------------------------------*/
#Contents #SpecialBanner {
	margin-bottom: 10px;
}

#Contents #SpecialBanner li {
	padding-bottom: 10px;
}


/*-----------------------------------------------------
	資料請求 Banner　2012/11/29追記
-----------------------------------------------------*/
#Contents p.DocBanner {
	text-align:center;
	margin-top: 25px;
}








/*-----------------------------------------------------
	Support
-----------------------------------------------------*/
#Contents #Support {
	margin-bottom: 30px;
}

#Contents #Support h2 {
	margin-bottom: 10px;
}

#Contents #Support .ContentsBox {
	padding: 12px 0 0 17px;
	background: #FFF7D9;
	border: solid 1px #FFE6BB;
}

#Contents #Support .ContentsBox .TextArea {
	padding-bottom: 0;
}

#Contents #Support .ContentsBox .TextArea ul {
	padding: 0px 0 0 0;
}

#Contents #Support .ContentsBox .TextArea ul li {
	width: 173px;
	float: left;
	background: url(../img/index_support_stepbtm.png) no-repeat bottom #fff;
	margin-right: 10px;
	padding: 11px;
	height: 245px;
}

#Contents #Support .ContentsBox .TextArea ul li p {
	margin-bottom: 7px;
	padding: 0;
}

#Contents #Support .ContentsBox .TextArea ul li dl {
}

#Contents #Support .ContentsBox .TextArea ul li dt {
	height: 46px;
}

#Contents #Support .ContentsBox .TextArea ul li dd.Text {
	color: #666666;
	font-size: 85%;
}

#Contents #Support .ContentsBox .TextArea ul li dd.Detail {
	margin-top: 10px;
	text-align: right;
}

#Contents #Support .ContentsBox .BtnArea {
	padding: 0 60px 20px 44px;
}


/*-----------------------------------------------------
	Shikaku
-----------------------------------------------------*/
#Contents #Shikaku {
	
}

#Contents #Shikaku h2 {
	margin-bottom: 10px;
}

#Contents #Shikaku .ContentsBox {
	padding: 20px 20px;
	background: #EEF7E4;
	border: solid 1px #C8E9C9;
	margin-bottom: 30px;
}


#Contents #Shikaku .ContentsBox .TextArea {
	margin-bottom: 10px;
	width: 602px;
}

#Contents #Shikaku .ContentsBox .TextArea dl.kokusai {
	float: left;
	width: 294px;
	display: block;
}

#Contents #Shikaku .ContentsBox .TextArea dl.kokunai {
	float: right;
	width: 294px;
	display: block;
}

#Contents #Shikaku .ContentsBox .TextArea dl dt {
	margin-bottom: 10px;
}

#Contents #Shikaku .ContentsBox .TextArea dl dd {
	background: #fff;
	padding: 10px;
}

#Contents #Shikaku .ContentsBox .TextArea dl.detail_01,
#Contents #Shikaku .ContentsBox .TextArea dl.detail_02 {
	height: 140px;
}

#Contents #Shikaku .ContentsBox .TextArea dl.detail_01 dt,
#Contents #Shikaku .ContentsBox .TextArea dl.detail_02 dt {
	border-bottom: 1px solid #99CC99;
	padding-bottom: 7px;
}

#Contents #Shikaku .ContentsBox .TextArea dl.detail_02 dt {
	margin-top: 10px;
}

#Contents #Shikaku .ContentsBox .TextArea dl.detail_01 dd,
#Contents #Shikaku .ContentsBox .TextArea dl.detail_02 dd {
	padding: 0 3px 0 3px;
}

#Contents #Shikaku .ContentsBox .TextArea dl dd ul {
	margin: 15px 0;
	/margin: 0;
	zoom:1;
}

#Contents #Shikaku .ContentsBox .TextArea dl dd ul li {
	font-size: 10px;
	margin-bottom: 8px;
	padding: 0 0 0 10px;
	background: url(../img/arrow_green.gif) no-repeat;
	zoom: 1;
}

#Contents #Shikaku .ContentsBox .TextArea dl dd ul li a,
#Contents #Shikaku .ContentsBox .TextArea dl dd ul li a:hover {
	color: #666;
}

#Contents #Shikaku .ContentsBox .TextArea dl dd p.point {
	margin: 20px 0 0 0;
	/margin: 0;
}

#Contents #Shikaku div.BtnArea {
	background: url(../img/index_sstit_shikaku_arrow.gif) no-repeat;
	padding-top: 20px;
	width: 607px;
}

#Contents #Shikaku div.BtnArea p {
	padding-top: 15px;
}


/*-----------------------------------------------------
	Experience
-----------------------------------------------------*/
#Contents #Experience {
	margin-bottom: 30px;
}

#Contents #Experience .ContentsBox {
	padding: 20px 15px;
	background: #FFF6EF;
	border: solid 1px #FFE2E9;
}

#Contents #Experience h2 {
	margin-bottom: 10px;
}

#Contents #Experience ul {
	background: #fff;
	padding: 15px 7px;
	/*background: url(../img/index_dot_experience.gif) repeat-y top center;*/
}

#Contents #Experience ul li {
	padding: 10px 5px 0 5px;
	width: 188px;
	float: left;
	display: inline;
	border-right: 1px dotted #ccc;
}

* html #Contents #Experience ul li {
	padding: 10px 0px 0 5px;
	width: 188px;
	float: left;
	display: inline;
	border-right: 1px dotted #ccc;
}

#Contents #Experience ul li.end {
	margin: 0;
	border-right: none;
	float: left;
}

#Contents #Experience ul li dl {
	margin: 0 5px;
	width: 183px;
}

#Contents #Experience ul li dt {
	margin-bottom: 5px;
}

#Contents #Experience ul li dd.Lead {
	margin-bottom: 10px;
}

#Contents #Experience ul li dd.Text {
	color: #666666;
	font-size: 85%;
}

#Contents #Experience ul li dd.Detail {
	margin-top: 15px;
	text-align: right;
}

/*-----------------------------------------------------
	Curriculum
-----------------------------------------------------*/
#Contents #Curriculum {
	margin-bottom: 30px;
	clear: both;
}

#Contents #Curriculum h2 {
	margin-bottom: 5px;
}

#Contents #Curriculum p.Lead {
	margin-bottom: 10px;
	padding-left:5px;
	text-align: center;
	color: #666666;
	font-size: 85%;
}

#Contents #Curriculum h3 {
	margin-bottom: 10px;
}

/*----- Common -----*/
#Contents #Curriculum dl {
	margin: 0 10px 10px 10px;
	padding-left: 115px;
}

#Contents #Curriculum dt {
	margin-bottom: 2px;
	line-height: 0.5;
}

#Contents #Curriculum dd ul li {
	padding: 4px 0 7px 0;
	background: url(../img/index_dot_curriculum.gif) repeat-x bottom left;
	line-height: 0.5;
}

#Contents #Curriculum .BannerArea ul li.TextLink {
	margin-bottom: 5px;
}

#Contents #Curriculum .BannerArea ul li.TextLink a {
	padding-left: 10px;
	background: url(../common/img/cmn_arrow_textlink.gif) no-repeat;
	background-position: 0 3px;
	font-size: 85%;
	display: block;
	
}

/*----- Main Course -----*/
#Contents #Curriculum #MainCourse {
	width: 315px;
	background: url(../img/index_curriculumbg01.gif) repeat-y;
	float: left;
}

#Contents #Curriculum #MainCourse dl {
	background: url(../img/index_pic_curriculum01_01.jpg) no-repeat top left;
}

#Contents #Curriculum #MainCourse .Detail {
	margin-left: 10px;
	background: url(../img/index_pic_curriculum01_02.jpg) no-repeat top left;	
}

#Contents #Curriculum #MainCourse .Detail p.Text {
	padding: 11px 0 15px 71px;
}

#Contents #Curriculum #MainCourse .Detail p.Button {
	padding: 0 0 17px 78px;
}

#Contents #Curriculum #MainCourse .BannerArea {
	padding: 0 10px 10px;
	background: url(../img/index_curriculumbtm01.gif) no-repeat bottom left;
}

#Contents #Curriculum #MainCourse .BannerArea ul {
	padding: 0 5px 5px;
	background: url(../img/index_curriculumbtm03.gif) #fff5f4 no-repeat bottom left;
}
	
/*----- SkillUp Course -----*/
#Contents #Curriculum #SkillUpCourse {
	width: 315px;
	background: url(../img/index_curriculumbg02.gif) repeat-y;
	float: right;
}

#Contents #Curriculum #SkillUpCourse dl {
	background: url(../img/index_pic_curriculum02_01.jpg) no-repeat top left;
}

#Contents #Curriculum #SkillUpCourse .Detail {
	margin-left: 10px;
	background: url(../img/index_pic_curriculum02_02.jpg) no-repeat top left;	
}

#Contents #Curriculum #SkillUpCourse .Detail p.Text {
	padding: 11px 0 10px 67px;
}

#Contents #Curriculum #SkillUpCourse .Detail p.Button {
	padding: 0 0 17px 88px;
}

#Contents #Curriculum #SkillUpCourse .BannerArea {
	padding: 0 10px 10px;
	background: url(../img/index_curriculumbtm02.gif) no-repeat bottom left;
}

#Contents #Curriculum #SkillUpCourse .BannerArea ul {
	padding: 0 5px 5px;
	background: url(../img/index_curriculumbtm04.gif) #fff4df no-repeat bottom left;
}

	

/*-----------------------------------------------------
	School Blog
-----------------------------------------------------*/
#Contents #SchoolBlog {
	padding-top: 10px;
	background: url(../img/index_schoolblogbg.gif) no-repeat top right;
	clear: both;
}

#Contents #SchoolBlog h2 {
	float: left;
}

#Contents #SchoolBlog p.More {
	padding: 5px 15px 0 0;
	float: right;
}

#Contents #SchoolBlog dl {
	padding: 15px 15px 0 15px;	
}

#Contents #SchoolBlog dt {
	padding-bottom: 24px;
	width: 7em;
	clear: left;
	float: left;
	display: block;
}

#Contents #SchoolBlog dd {
	padding-bottom: 24px;
	background: url(../img/index_dot_blog.gif) repeat-x bottom left;
	display: block;
}

/*-----------------------------------------------------
	App Area
-----------------------------------------------------*/
#Contents .AppArea {
	background: url(../img/app_area_bg.jpg) no-repeat;
	width: 632px;
	height: 148px;
	margin: 20px 0 0 4px;
}


#Contents .AppArea dl {	
	width: 361px;
	margin: 0 0 0 241px;
	padding-top: 20px;
}

#Contents .AppArea dl dt {
	width: 204px;
	background: url(../img/app_lead.gif) no-repeat left top;
	padding: 16px 0 0 0;
	overflow: hidden;
	height: 0px!important;
	height /**/:16px;/* for ie5.x */
	display: block;
	margin: 0 0 10px 0;
}

#Contents .AppArea dl dd {
	width: 361px;
	background: url(../img/app_tel.gif) no-repeat left top;
	padding: 35px 0 0 0;
	overflow: hidden;
	height: 0px!important;
	height /**/:35px;/* for ie5.x */
	display: block;
}


#Contents .AppArea .btn-area {
	width: 361px;
	height: 37px;
	margin: 10px 0 0 241px;
}

#Contents .AppArea .btn-area p.left a img {
	float: left;
	display:block;
	width: 172px;
	height:37px;
}

#Contents .AppArea .btn-area p.right a img {
	float: right;
	display:block;
	width: 172px;
	height:37px;
}
		



/*-----------------------------------------------------

	Index Footer

-----------------------------------------------------*/
#FooterArea #Footer #Access {
	margin-bottom: 30px;
}

/*-----------------------------------------------------
	Common
-----------------------------------------------------*/
#FooterArea #Footer #Access .Kyoto,
#FooterArea #Footer #Access .Osaka {
	width: 414px;
	padding: 18px;
	border: 1px solid #ccc;
}

#FooterArea #Footer #Access h3 {
	margin-bottom: 15px;
}

#FooterArea #Footer #Access p.Map {
	margin: 0 auto 20px auto;
}

#FooterArea #Footer #Access .clearfix {
	text-align: left;
}

#FooterArea #Footer #Access .clearfix p.Spec {
	width: 300px;
	color: #666666;
	font-size: 85%;
	float: left;
}

#FooterArea #Footer #Access .clearfix p.Button {
	float: right;
}

/*-----------------------------------------------------
	Kyoto
-----------------------------------------------------*/
#FooterArea #Footer #Access .Kyoto {
	float: left;
}

/*-----------------------------------------------------
	Osaka
-----------------------------------------------------*/
#FooterArea #Footer #Access .Osaka {
	float: right;
}





/*-----------------------------------------------------

	2013/11/29　トップページ改修後

-----------------------------------------------------*/
#Contents h2.index_stit_cam {
	width: 240px;
	margin-left: 5px;
	background: url(../img/index_stit_cam.gif) no-repeat left top;
	padding: 18px 0 0 0;
	overflow: hidden;
	height: 0px!important;
	height /**/:18px;/* for ie5.x */
}

/*-----------------------------------------------------
	3column Banner 2013/11/29追記
-----------------------------------------------------*/
#Contents ul#BannerArea3clm {
	width: 645px;
	margin: 5px 0 10px 5px;
}

#Contents ul#BannerArea3clm li {
	float: left;
	margin-right: 13px;	
}

#Contents ul#BannerArea3clm li.last {
	float: right;
	margin-right: 0 !important;	
}





.clearfix:after{
  content: "."; 
  display: block; 
  height: 0; 
  font-size:0;	
  clear: both; 
  visibility:hidden;
}
.clearfix{display: inline-block;} 
* html .clearfix {height: 1%;}
.clearfix{display:block;}
