@media only screen and (max-width: 768px) {

html{ font-size : 87.5%;}

body {
	border-top:3px solid #f8b505;
}

header {
width: 100%;
height: auto;
text-align:left;
}

#navbar {
width: auto;
height: auto;
position: relative;
left: auto;
top:auto;
z-index:1;
}
#navbar ul {
width: auto;
height: auto;
/*margin: 7.5px -15px;*/
list-style: none;
line-height: normal;
}
#navbar ul li {
text-align:left;
}

.navbar-fl .navbar-nav > li > a {
  padding:15px 30px;
}
.navbar-fl .navbar-nav > li:first-child > a {
border-radius:0;
}
.navbar-fl .navbar-nav > li:last-child > a {
border-radius:0;
}
.navbar-fl .navbar-collapse,
.navbar-fl .navbar-form {
  clear: both;
}

#program_list {
width: 100%;
height: 100%;
}

div.curriculum div{
	max-width: 100%;
	clear:both;
	margin-bottom:10px;
	text-align: left;
}

img{
max-width: 100%;
height: auto;
width: auto;
}
.col-sm-4,
.col-sm-8,
.col-xs-12 {
	text-align:center;
}
#indexUpper {
	padding-bottom: 10px;
}
#indexLower .col-sm-4,
#indexLower .col-sm-8,
#indexLower .col-xs-12 {
	text-align:left;
}

header h1#topDescription,
header p#firstlearing_logo,
header p.schoolName {
text-align:left;
position:static;
}
header p#firstlearing_logo img { width: 50%; }
header h1#topDescription { font-size:80%;padding-top:8px; }
header p.schoolName img { width: 90%; }

header .telephone {
font-size:1.4em;
margin-left:10px;
padding-left:50px;
background:url("../images/icon_telephone_sp.gif") no-repeat left 0;
line-height:1em;
text-align:left;
clear:both;
}

#index_concept h3 {
	font-size: 1.4em;
	line-height:1.2;
}

#index_campain p {
	text-align:left;
}

#index_concept p, #whatsNew {
	text-align: left;
}
#whatsNew {
	width:100%;
	height:150px;
}

#whatsNew ul{
	width: auto;
	height: 98px;
	-webkit-overflow-scrolling: touch;
	overflow-scrolling: touch;
}

#whatsNew li{
	width: auto;
}

#school-diary{
	padding-bottom:10px;
}

#topFeature,
#topNetwork,
#topCurriculum {
	max-width: 100%;
	text-align: left;
}

#content h1 {
	font-size:1.2em;
	min-height:2.3em;
	line-height:1em;
}
#content h1 span {
	font-size:0.8em;
}
#content h2 {
font-size:1.15em;
min-height:2.3em;
line-height:1em;
}

#content h2 span {
font-size:0.8em;
}

#content h3,
#content h4 {
font-size:1.1em;
line-height:1em;
min-height:1.8em;
margin-top:0.7em;
}
#content h5 {
font-size:1em;
}
#footer-outer-block {
position:static;
font-size:0.9em;
}
#footer-area {
max-width:320px;
}
.footer-segment {
text-align:center;
margin-right:0;
clear:left;
}
#copyright {
text-align:center;
}

dl.application {
	width: auto;
}

strong.catch {
	font-size:1em;
}
.index_topic {
	margin-right:15px;
	margin-left:15px;
	width:95%;
}

/*----------------------------------------------------
    .feature
----------------------------------------------------*/
    .feature caption{
		margin-left: 15px;
    }
    .feature th,
    .feature td{
        width: 93%;
        display: block;
		margin: 0 15px;
    }
}

@media only screen and (max-width: 479px) {

  header ul.submenu li.telephone {
    font-size:1.2em;
    padding:0.3em 0 0.3em 45px;
  }
  header p#schoolName img {
    width: 90%;
  }
  .index_program h2 {
    font-size: 1em;
  }
  .index_program h2 span {
    font-size: 0.8em;
  }
  .index_program .balloon_link_inner p {
    font-size: 0.7em;
  }
  .index_topic {
    width:93%;
  }
}
