@charset "utf-8";


/*-----------------------------------------------------
10px = 77%     11px = 85%     12px = 93%     13px = 100%
14px = 108%    15px = 116%    16px = 123.1%  17px = 131%
18px = 138.5%  19px = 146.5%  20px = 153.9%  21px = 161.6%
22px = 167%    23px = 174%    24px = 182%    25px = 189%
26px = 197%
------------------------------------------------------*/

article section.flow{
	padding: 0 0 30px 11px;
}
article section.flow ul li{
	width: 185px;
	float: left;
}
article section.flow ul li.first{
	width: 162px;
}
article section.flow ul li p{
	padding: 10px 10px 0 20px;
	font-size: 93%;
	line-height: 1.3;
}
.win article section.flow ul li p{
	font-size: 85%;
}
article section.flow ul li.first p{
	padding: 10px 10px 0 0;
}
article section.outer{
	padding: 0 1px 0;
	border:1px solid #1e7145;
	border-top: none;
	-moz-border-radius:0 0 5px 5px ;
	-webkit-border-radius:0 0 5px 5px ;
	border-radius:0 0 5px 5px ;
	margin-bottom: 20px;
	background-color: #fff;
	position: relative;
	behavior: url(/common/PIE/PIE.htc);
}
article section.unit{
	border-top:1px solid #1e7145;
	padding: 20px 20px 20px 20px;
}
article section.unit h4{
	padding-bottom: 20px;
}
article section.unit .inner .fLeft{
	width: 445px;
}
article section.unit .inner .fRight{
	width: 230px;
}
/*article section.unit .inner .fRight a{
	border: 1px solid #ebebeb;
	display: block;
}
article section.unit .inner .fRight a:hover{
	border: 1px solid #aba39a;
}*/
article section.unit h5{
	padding-bottom: 15px;
	font-weight: bold;
	font-size: 123.1%;
}
article section.unit p{
	font-size: 108%;
	line-height: 1.6;
	overflow:hidden;
}
article section.unit p strong{
	font-size: 93%;
	color: #666;
	line-height: 2;
}
article p.pagetop{
	text-align: right;
	margin-bottom: 30px;
}

article section.menuanc{
	background-color: #e5ddcf;
	padding: 13px 0 9px 12px;
	margin-bottom: 30px;
}
article section.menuanc li{
	float: left;
	margin-right: 7px;
	margin-bottom: 4px;
}

article section.outer.word{
	border:1px solid #2b5797;
	border-top: none;
}
article section.outer.word section.unit{
	border-top:1px solid #2b5797;
}
article section.outer.powerpoint{
	border:1px solid #d04525;
	border-top: none;
}
article section.outer.powerpoint section.unit{
	border-top:1px solid #d04525;
}
article section.outer.illustrator{
	border:1px solid #e77000;
	border-top: none;
}
article section.outer.illustrator section.unit{
	border-top:1px solid #e77000;
}
article section.outer.photoshop{
	border:1px solid #1775d5;
	border-top: none;
}
article section.outer.photoshop section.unit{
	border-top:1px solid #1775d5;
}

article section.review {
	margin-bottom: 50px;
}
article section.review .each{
	margin-bottom: 5px;
}
article section.review .each .fLeft{
	width: 67px;
	text-align: center;
	padding-top: 7px;
}
article section.review .each .fRight{
	margin-right: 15px;
	width: 648px;
	background: url(../images/review_bg_bottom.gif) 0 bottom no-repeat;
}
article section.review .each .fRight .inner{
	background: url(../images/review_bg_top.gif) 0 top no-repeat;
	padding: 15px 20px 14px 30px;
}



/*---------------------------------------------
menu全体
---------------------------------------------*/

.mar{
	margin:5px 0 6px 0;
	font-size:14px;
}

.free_ttl{margin-top:10px;}

div#menu{
	background:url(../images/bg_main.gif) bottom left no-repeat;
	width:700px;
	margin:20px auto 30px;
	padding-bottom:2px;
}
div#menu h3{
	margin-bottom: 12px;
}
div#menu div.box{
	margin-left:12px;
	margin-bottom:5px;
	display: inline-block;
	overflow:hidden;
}

div#menu p.ttl{
	font-size:14px;
	line-height:1.2em;
	font-weight:bold;
	margin:0 11px;
	margin-top:13px;
}

div#menu p.txt{
	float:left;
	width:102px;
	margin:5px 0 0 11px;
	color:#333333;
	line-height:1.2em;
	overflow:hidden;
	display:inline;
	font-size:12px;
}

div#menu p.img{
	margin-top:5px;
	float:right;
	width:90px;
	margin-right:11px;
	overflow:hidden;
	display:inline;
	border:#dddddd;
	border-style:solid;
	border-width:2px;
}

/*---------------------------------------------
ソフト指定
---------------------------------------------*/
/*powerpoint*/
#menu .power_point{
	background:url(../images/power_point.png) top left no-repeat; 
	float:left;
	width:219px;
	margin-right:9px;
	display: inline;
	cursor: pointer;
    height: 160px;
}

#menu .power_point.hover{
	cursor: pointer;
	background:url(../images/power_point_over.png) top left no-repeat;
}

#menu .power_point a{
	color:#cd5d15;
	text-decoration: none;
}

#menu .power_point a:hover{
	color:#cd5d15;
	text-decoration: underline;
}


/*excel*/
#menu .excel{
	background:url(../images/excel.png) top left no-repeat; 
	float:left;
	width:219px;
	margin-right:9px;
	display: inline;
	cursor: pointer;
    height: 160px;
}

#menu .excel.hover{
	cursor: pointer;
	background:url(../images/excel_over.png) top left no-repeat;
	
}

#menu .excel a{
	color:#367f00;
	text-decoration:none;
}

#menu .excel a:hover{
	color:#367f00;
	text-decoration: underline;
}


/*word*/
#menu .word{
	background:url(../images/word.png) top left no-repeat; 
	float:left;
	width:219px;
	margin-right:9px;
	display: inline;
	cursor: pointer;
    height: 160px;
}

#menu .word.hover{
	cursor: pointer;
	background:url(../images/word_over.png) top left no-repeat;
}

#menu .word a{
	color:#014f91;
	text-decoration:none;
}

#menu .word a:hover{
	color:#014f91;
	text-decoration: underline;
}


/*photo_shop*/
#menu .photo_shop{
	background:url(../images/photo_shop.png) top left no-repeat; 
	float:left;
	width:219px;
	margin-right:9px;
	display: inline;
	cursor: pointer;
    height: 160px;
}

#menu .photo_shop.hover{
	cursor: pointer;
	background:url(../images/photo_shop_over.png) top left no-repeat;
}

#menu .photo_shop a{
	color:#07457d;
	text-decoration:none;
}

#menu .photo_shop a:hover{
	color:#07457d;
	text-decoration: underline;
}


/*illustrator*/
#menu .illustrator{
	background:url(../images/illustrator.png) top left no-repeat; 
	float:left;
	width:219px;
	margin-right:9px;
	display: inline;
	cursor: pointer;
    height: 160px;
}

#menu .illustrator.hover{
	cursor: pointer;
	background:url(../images/illustrator_over.png) top left no-repeat;
}

#menu .illustrator a{
	color:#e46600;
	text-decoration:none;
}

#menu .illustrator a:hover{
	color:#e46600;
	text-decoration: underline;
}

/*---------------------------------------------
難易度指定
---------------------------------------------*/
#menu .star5{
	margin:5px 5px 0 0;
	background:url(../images/star.png) top right no-repeat;
	position:relative;
	top:0;
	left:137px;
	width:73px;
	height:13px;
}

#menu .star4{
	margin:5px 5px 0 0;
	background:url(../images/star.png) top right no-repeat;
	position:relative;
	top:0;
	left:152px;
	width:58px;
	height:13px;
}


#menu .star3{
	margin:5px 5px 0 0;
	background:url(../images/star.png) top right no-repeat;
	position:relative;
	top:0;
	left:166px;
	width:44px;
	height:13px;
}


#menu .star2{
	margin:5px 5px 0 0;
	background:url(../images/star.png) top right no-repeat;
	position:relative;
	top:0;
	left:181px;
	width:29px;
	height:13px;
}


#menu .star1{
	margin:5px 5px 0 0;
	background:url(../images/star.png) top right no-repeat;
	position:relative;
	top:0;
	left:196px;
	width:14px;
	height:13px;
}


/*clearfix直打ち*/
.box3:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
}

.box3 {
    display: inline-block;
}

* html .box3 {
    height: 1px;
}

.box2:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
}

.box2 {
    display: inline-block;
}

* html .box2 {
    height: 1px;
}

.box1:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
}

.box1 {
    display: inline-block;
}

* html .box1 {
    height: 1px;
}

article section.unit2 h5{
	background-image: url("/course/images/course_bg_01.gif");
	background-position: 0 0;
	background-repeat: no-repeat;
	height: 40px;
	line-height: 42px;
	color: #fff;
	font-size: 123.1%;
	padding-left: 32px;
	font-weight: bold;
}

article section.unit2 .each{
	width: 688px;
	margin:0 0 20px;
	-moz-border-radius:0 0 5px 5px ;
	-webkit-border-radius:0 0 5px 5px ;
	border-radius:0 0 5px 5px ;
	border:1px solid #ccc;
	border-top: none;
	background-color: #fff;
	position: relative;
	behavior: url(/common/PIE/PIE.htc);
}

article section.unit2 .each .inner{
	padding: 13px 15px 15px 15px;
}

article section.unit2 dl{
	margin:10px 15px 5px 20px;
}

article section.unit2 dl dt{
	background:url(../images/ico_point.gif) no-repeat left 5px;
	padding:0 0 5px 10px;
	margin:3px auto 0 0;
}
