@charset "utf-8";

/* import
--------------------------------------------------*/
@import "util.css";

@media screen and (min-width:736px){
	body {
		width:364px;
		padding-left: 12px;
		padding-right: 12px;
	}
	.greet img {
		width:80px;
		height: auto;
	  display: block;
	}
	.greet-main2{
		width: auto;
	}
	.header{
		width:auto;
	}
	.foot-bottom{
		overflow: hidden;
		padding-left:10px;
	}
}


/* layout
--------------------------------------------------*/
	body {
		background: #f1eee3 url(../img/bg-body.gif) repeat-y center top;
		background-size: 388px auto;
		-webkit-background-size: 388px auto;
		margin:0 auto;
	}
/* wrapper */
	#LPWrapper {
		width: 320px;
		margin: 0 auto;
		background: url(../img/bg.gif) repeat left top;
		background-size: 5px auto;
		-webkit-background-size: 5px auto;
	}

/* header */
	#LPHeader {
		padding: 8px 10px;
		background: #ffffff;
	}
	#LPHeader #benesseLogo {
		float: left;
	}
	#LPHeader #challengeLogo {
		text-align: right;
	}

/* contents */
	#contents {
		color: #6c6c6c;
		line-height: 1.73;
		/*letter-spacing: -1px;*/
		padding: 0;
	}
	#contents .mainImage {
		margin: 20px 0;
	}
	#contents .title01 {
		text-align: center;
	}
	#contents .title02 {
		padding: 8px 30px;
		font-weight: bold;
		line-height: 1.47;
	}
	#contents.index .title02 { background:#dff1f7; color:#307fa1; }
	#contents.age2 .title02 { background:#e66583; color:#ffffff; }
	#contents.age3 .title02 { background:#ed9e0c; color:#ffffff; }
	#contents.age4 .title02 { background:#6bb3ad; color:#ffffff; }
	#contents.age5-6 .title02 { background:#6b93c4; color:#ffffff; }
	#contents .title03 {
		position: relative;
		width: 230px;
		padding-left: 60px;
		font-size: 107%;
		font-weight: bold;
		line-height: 1.5;
	}
	#contents.age2 .title03 { color:#e66583; }
	#contents.age3 .title03 { color:#ed9e0c; }
	#contents.age4 .title03 { color:#6bb3ad; }
	#contents.age5-6 .title03 { color:#6b93c4; }
	#contents .title03 .icon {
		position: absolute;
		top: -5px;
		left: -3px;
	}
	#contents .title03.line_1 .icon {
		top: -20px;
	}
	#contents .title03.icon_top {
		position: static;
		width: auto;
		padding-left: 0;
	}
	#contents .title03.icon_top .icon {
		display: block;
		position: static;
		margin-bottom: 5px;
	}
	#contents .textArea {
		margin-right: 15px;
		margin-left: 15px;
	}
	#contents .caption {
		color: #858585;
		font-size: 80%;
		line-height: 1.5;
	}
	#contents .imgCap {
		color: #999999;
		font-size: 67%;
	}
	#contents .small {
		font-size: 80%;
	}
	#contents .indent {
		padding-left: 1.2em;
	}
	#contents .indent .mk {
		display: inline-block;
		width: 1.2em;
		margin-left: -1.2em;
	}
	#contents .bdrArea {
		padding-top: 30px;
		background: url(../img/bdr.gif) repeat-x left top;
		background-size: 5px 3px;
		-webkit-background-size: 5px 3px;
	}
	#contents .dotArea {
		border-top: #cecece dotted 1px;
	}
	/* imageArea */
	#contents .imageArea {
		width: 265px;
		margin-right: auto;
		margin-left: auto;
	}
	#contents .imageArea .image {
		position: relative;
		padding: 15px;
		width: 240px;
		height: 155px;
		background: url(../img/bg-image.png) no-repeat center center;
		background-size: 265px auto;
		-webkit-background-size: 265px auto;
	}
	#contents .imageArea .image02 {
		position: relative;
		padding: 25px;
		width: 240px;
		height: 190px;
		background: url(../img/bg-image02.png) no-repeat center center;
		background-size: 265px auto;
		-webkit-background-size: 265px auto;
	}
	#contents .imageArea .image img,
	#contents .imageArea .image02 img {
		position: absolute;
		top: 15px;
		left: 15px;
	}
	#contents .imageArea .image img.bottom {
		top: auto;
		bottom: 25px;
	}
	#contents .imageArea .imgCap {
		width: 250px;
		margin: 0 auto;
		text-align: right;
	}
	/* tipsArea */
	#contents .tipsArea {
		width: 293px;
		margin-left: 15px;
		padding-bottom: 3px;
		background: url(../img/bg-tips02.png) no-repeat left bottom;
		background-size: 293px auto;
		-webkit-background-size: 293px auto;
	}
	#contents .tipsArea dd {
		padding: 20px 23px 20px 20px;
		background: url(../img/bg-tips01.png) repeat-y left top;
		background-size: 293px auto;
		color: #8e6144;
		font-size: 93%;
	}
	#contents .tipsArea dd h4 {
		margin-bottom: 15px;
	}
	/* program */
	.program {
		width: 290px;
		margin-right: auto;
		margin-left: auto;
		padding-bottom: 10px;
		background-repeat: no-repeat;
		background-position: center bottom;
	}
	.program .inner {
		padding: 15px 15px 5px;
		background-repeat: repeat-y;
		background-position: center top;
	}
	.program .inner .image {
		margin: 15px 0 10px;
	}
	.program .inner .capArea {
		color: #858585;
		text-align: center;
	}
	.program .inner .capArea dt {
		font-size: 67%;
	}
	.program .inner .capArea dd {
		font-size: 87%;
		line-height: 1.23;
	}
	.program .inner .link {
		margin-top: 15px;
	}
	.program .inner .link a {
		display: block;
		height: 30px;
		color: #ffffff;
		font-size: 87%;
		font-weight: bold;
		line-height: 30px;
		text-align: center;
		text-decoration: none;
	}
	/* sNav */
	#contents #sNav {
		width: 300px;
		margin-right: auto;
		margin-left: auto;
		padding-bottom: 20px;
		background: url(../img/bg-snav02.png) no-repeat center bottom;
		background-size: 300px auto;
		-webkit-background-size: 300px auto;
	}
	#contents #sNav dd {
		padding-top: 20px;
		background: url(../img/bg-snav01.gif) repeat left top;
		background-size: 50px auto;
		-webkit-background-size: 50px auto;
	}
	#contents #sNav dd ul {
		width: 280px;
		margin: 0 auto;
	}
	#contents #sNav dd ul li {
		margin-top: 10px;
	}
	#contents #sNav dd ul li:first-child {
		margin-top: 0;
	}
	#contents #sNav dd ul li a {
		display: block;
		position: relative;
		width: 280px;
		color: #6c6c6c;
		font-size: 80%;
		line-height: 1.42;
		text-decoration: none;
	}
	#contents #sNav dd ul li a span {
		position: absolute;
		top: 40px;
		left: 85px;
		cursor: pointer;
	}
	#contents .navTop {
		margin-top: 20px;
	}
	#contents .navTop a {
		display: block;
		height: 40px;
		background: url(../img/bg-top.png) no-repeat center top;
		background-size: 300px auto;
		-webkit-background-size: 300px auto;
		color: #757575;
		font-size: 93%;
		line-height: 40px;
		text-align: center;
		text-decoration: none;
	}


/* footer */
	#LPFooter {
		overflow: hidden;
		width: 100%;
		margin-top: 20px;
		background: #ffffff;
	}
	#LPFooter #fText {
		border-top: #d9d9d9 solid 1px;
	}
	#LPFooter #fNav p {
		padding: 5px 0;
		background: #0075c1;
		color: #ffffff;
		font-size: 95%;
		font-weight: bold;
		text-align: center;
	}
	#LPFooter #fNav p span {
		padding-left: 20px;
		background: url(../img/ftr-arw.gif) no-repeat left center;
		background-size: 6px auto;
		-webkit-background-size: 6px auto;
	}
	#LPFooter #fNav ul {
		border-top: #dbdbdb solid 1px;
	}
	#LPFooter #fNav ul li {
		border-bottom: #dbdbdb solid 1px;
		background: url(../img/fnav-arw.gif) no-repeat right center;
		background-size: 22px auto;
		-webkit-background-size: 22px auto;
		font-size: 130%;
		font-weight: bold;
	}
	#LPFooter #fNav ul li a {
		display: block;
		padding: 10px 30px 10px 70px;
		background-repeat: no-repeat;
		background-position: 12px center;
		background-size: 45px auto;
		-webkit-background-size: 45px auto;
		text-decoration: none;
	}
	#LPFooter #fNav ul li a .small {
		font-size: 75%;
	}
	#LPFooter #fNav ul li a .course {
		margin-left: 0.5em;
		font-size: 75%;
		font-weight: normal;
	}
	#LPFooter #fNav ul li.nav01 a {
		background-image:url(../img/fnav-icon01.gif); color:#ee86b4;
	}
	#LPFooter #fNav ul li.nav02 a {
		background-image:url(../img/fnav-icon02.gif); color:#e61953;
	}
	#LPFooter #fNav ul li.nav03 a {
		background-image:url(../img/fnav-icon03.gif); color:#e61953;
	}
	#LPFooter #fNav ul li.nav04 a {
		background-image:url(../img/fnav-icon04.gif); color:#fdb300;
	}
	#LPFooter #fNav ul li.nav05 a {
		background-image:url(../img/fnav-icon05.gif); color:#00b0ec;
	}
	#LPFooter #fNav ul li.nav06 a {
		background-image:url(../img/fnav-icon06.gif); color:#14a83b;
	}
	#LPFooter #fNav ul li.nav07 a {
		background-image:url(../img/fnav-icon07.gif); color:#006ebc;
	}
	#LPFooter #fSNS {
		margin: 30px 0 20px;
		text-align: center;
	}
	#LPFooter #fSNS li {
		display: inline;
		padding: 0 5px;
	}
	#LPFooter #copyright {
		padding: 18px 0 17px;
		border-top: #30a6db solid 2px;
		color: #666666;
		font-size: 83%;
		font-weight: bold;
		text-align: center;
	}


/* index
--------------------------------------------------*/
/* indexText01 */
	#indexText01 {
		min-height: 140px;
		padding: 0 15px 0 145px;
		background: url(../img/index/img-01.png) no-repeat left top;
		background-size: 145px auto;
		-webkit-background-size: 145px auto;
		line-height: 1.5;
	}
	#indexText01 h4 {
		margin-bottom: 15px;
		color: #b2b2b2;
		font-size: 80%;
		font-weight: bold;
	}

/* indexQuestion */
	#indexQuestion {
		height: 64px;
		margin-right: 15px;
		margin-left: 15px;
		padding: 9px 5px 0;
		background: url(../img/index/bg-question.png) no-repeat center top;
		background-size: 290px auto;
		-webkit-background-size: 290px auto;
	}
	#indexQuestion a {
		display: block;
		height: 46px;
		color: #757575;
		padding: 6px 35px 0 25px;
		font-size: 90%;
		line-height: 1.6;
		text-decoration: none;
	}

/* indexText02 */
	#indexText02 {
		min-height: 202px;
		padding: 15px 150px 0 15px;
		background: url(../img/index/img-03.png) no-repeat right top;
		background-size: 155px auto;
		-webkit-background-size: 155px auto;
	}

/* indexText03 */
	#indexText03 {
		min-height: 150px;
		padding: 7px 15px 0 150px;
		background: url(../img/index/img-06.png) no-repeat left top;
		background-size: 145px auto;
		-webkit-background-size: 145px auto;
	}

/* indexText04 */
	#indexText04 {
		min-height: 140px;
		padding: 0 175px 0 15px;
		background: url(../img/index/img-07.png) no-repeat right top;
		background-size: 175px auto;
		-webkit-background-size: 175px auto;
	}

/* indexPoint */
	#indexPoint {
		width: 290px;
		margin-right: auto;
		margin-left: auto;
	}
	#indexPoint li {
		margin-top: 15px;
		padding-bottom: 10px;
		background: url(../img/index/bg-point02.png) no-repeat center bottom;
		background-size: 290px auto;
		-webkit-background-size: 290px auto;
	}
	#indexPoint li:first-child {
		margin-top: 0;
	}
	#indexPoint li .inner {
		padding: 15px 15px 5px;
		background: url(../img/index/bg-point01.gif) repeat-y center top;
		background-size: 290px auto;
		-webkit-background-size: 290px auto;
	}
	#indexPoint li .inner .image {
		margin: 10px 0 15px;
	}


/* age2
--------------------------------------------------*/
/* age2Text01 */
	#age2Text01 {
		position: relative;
		width: 153px;
		padding-right: 67px;
	}
	#age2Text01 .image {
		position: absolute;
		top: -10px;
		right: -85px;
	}

/* program */
	#program_age2_1 { background-image: url(../img/age2/bg-program1_02.png); }
	#program_age2_1 .inner { background-image: url(../img/age2/bg-program1_01.gif); }
	#program_age2_1 .inner .link a { background-image: url(../img/age2/link-01.gif); }
	#program_age2_2 { background-image: url(../img/age2/bg-program2_02.png); }
	#program_age2_2 .inner { background-image: url(../img/age2/bg-program2_01.gif); }
	#program_age2_2 .inner .link a { background-image: url(../img/age2/link-02.gif); }
	#program_age2_1, #program_age2_1 .inner, #program_age2_2, #program_age2_2 .inner {
		background-size: 290px auto;
		-webkit-background-size: 290px auto;
	}
	#program_age2_1 .inner .link a, #program_age2_2 .inner .link a {
		background-size: 260px auto;
		-webkit-background-size: 260px auto;
	}


/* age3
--------------------------------------------------*/
/* program */
	#program_age3_1 { background-image: url(../img/age3/bg-program1_02.png); }
	#program_age3_1 .inner { background-image: url(../img/age3/bg-program1_01.gif); }
	#program_age3_1 .inner .link a { background-image: url(../img/age3/link-01.gif); }
	#program_age3_2 { background-image: url(../img/age3/bg-program2_02.png); }
	#program_age3_2 .inner { background-image: url(../img/age3/bg-program2_01.gif); }
	#program_age3_2 .inner .link a { background-image: url(../img/age3/link-02.gif); }
	#program_age3_1, #program_age3_1 .inner, #program_age3_2, #program_age3_2 .inner {
		background-size: 290px auto;
		-webkit-background-size: 290px auto;
	}
	#program_age3_1 .inner .link a, #program_age3_2 .inner .link a {
		background-size: 260px auto;
		-webkit-background-size: 260px auto;
	}


/* age4
--------------------------------------------------*/
/* program */
	#program_age4_1 { background-image: url(../img/age4/bg-program1_02.png); }
	#program_age4_1 .inner { background-image: url(../img/age4/bg-program1_01.gif); }
	#program_age4_1 .inner .link a { background-image: url(../img/age4/link-01.gif); }
	#program_age4_2 { background-image: url(../img/age4/bg-program2_02.png); }
	#program_age4_2 .inner { background-image: url(../img/age4/bg-program2_01.gif); }
	#program_age4_2 .inner .link a { background-image: url(../img/age4/link-02.gif); }
	#program_age4_1, #program_age4_1 .inner, #program_age4_2, #program_age4_2 .inner {
		background-size: 290px auto;
		-webkit-background-size: 290px auto;
	}
	#program_age4_1 .inner .link a, #program_age4_2 .inner .link a {
		background-size: 260px auto;
		-webkit-background-size: 260px auto;
	}


/* age5-6
--------------------------------------------------*/
/* program */
	#program_age5-6_1 { background-image: url(../img/age5-6/bg-program1_02.png); }
	#program_age5-6_1 .inner { background-image: url(../img/age5-6/bg-program1_01.gif); }
	#program_age5-6_1 .inner .link a { background-image: url(../img/age5-6/link-01.gif); }
	#program_age5-6_2 { background-image: url(../img/age5-6/bg-program2_02.png); }
	#program_age5-6_2 .inner { background-image: url(../img/age5-6/bg-program2_01.gif); }
	#program_age5-6_2 .inner .link a { background-image: url(../img/age5-6/link-02.gif); }
	#program_age5-6_1, #program_age5-6_1 .inner, #program_age5-6_2, #program_age5-6_2 .inner {
		background-size: 290px auto;
		-webkit-background-size: 290px auto;
	}
	#program_age5-6_1 .inner .link a, #program_age5-6_2 .inner .link a {
		background-size: 260px auto;
		-webkit-background-size: 260px auto;
	}
.ac img{
	margin: 0 auto;
}
.foot-bottom{
	padding-left:10px;
	text-align: left;
}
.foot-middle div{
	text-align: left;
}
.foot-bottom p {
  text-align: left;
  width: 300px;
	float:none;
	clear: both;
}
.footer .fix{
	width:100%;
}
.tipsArea img,
.program img,
#sNav img{
  vertical-align: bottom;
}
/*20150626*/
.spForm input{
	display: inline-block !important;
}