/* CSS Document */
@media screen  and (max-width: 480px) { 
body {
	overflow-x:hidden;
}

.wrap {
    width: 480px;
}
.rainbow {
    width: 115%;
	top: 270px;
	font-size: 18px;
	line-height: 25px;
	margin-left: -6%;
	height: 510px;
	 background: transparent url(../images/rainbow_slider_m.png) no-repeat  0% 0%;
	background-size: contain;
}
#slideshow {
    width: 70%;
	top: 270px;
	margin-left: 17.5%;
	font-size: 18px;
	line-height: 25px;
}
#slideshow .yellow_title img {
	width:120px;
}
#slideshow .yellow_title {
	margin-top:-40px;
}
.course_wrap .blue_title, .course_wrap .glay_title {
    padding: 5% 0;
}
.menu-btn {
    width: 25px;
    left: 15px;
}
.form_table_phone {
	display: block !important;
}

.form_table_phone th textarea {
	min-height:250px;
}
.form_table {
	display:none;
	width: 96%;
    margin: 0 2%;
}

.table_phone .w_50 {
    width: 100%;
    border-bottom: 1px dashed #CCC;
	padding: 15px 0;
}
.table_phone .w_50:last-child {
    border-bottom: none;
}
.form_table tbody tr:nth-child(6) td,
.form_table tbody tr:nth-child(7) td,
.form_table tbody tr:nth-child(8) td {
    border-bottom: none;
	padding:0 10px;
}
.form_table tbody td input[type="text"], .form_table tbody td textarea {
    margin-left: 10px;
	margin-top:5px;
}
.table_phone .blue_h4 {
    padding: 10px 0px;
}
.table_phone tbody td ul {
    margin-left: 15px;
    width: 97%;
}
.table_phone tbody td ul li p a {
	display: block;
}
.book_info {
    margin: 0px 0px 10px;
}
.popup-box {
	width: 300px !important;
    left: 50% !important;
    height: 530px !important;
    margin-left: -150px;


}
.popup-content {
	height: 500px !important;
    width: 270px !important;
	padding:15px;
}
.popup-box .info, .popup-box .info2 {
    overflow-y: auto;
    height: 220px;
}
.popup-box .close {
}
.popup-box .h5 {
	line-height: 18px;
}
.book_img {
    margin: 15px auto;
    display: block;
    float: none;
    padding-bottom: 0;
	width:80px;

}
.popup-box hr {
    margin: 5px 0;
}
.popup-box article {
    padding: 5px 0 0;
}
.popup-box .blue_h4 {
    float: none;
    width: 100%;
    margin-left: 0px;
	line-height: 26px;

}
.popup-box .info2 .form_table {

	display:block !important;
}
.popup-box .info2 {
	width:100%;
		height:300px; 
	overflow-y:auto;
}
.popup-box .info2 .form_table td:first-child {
	width:80px;
}
.popup-box .form_table tbody th:first-child, 
.popup-box .form_table tbody th:nth-child(2),
.popup-box .form_table tbody th:last-child   {
	width:30%;
}
.ex_reading img {
    width: 100%;
}
.toni img {
	width:100%;
	margin-left: -30px;
}
/*book list*/
section .books_list {
    width: 100%;
}
.white_bg .section02 img, .white_bg .section03 img {
	position: inherit;
	margin: 30px 0px;
	width: 100%;
}

.light_area {
    width: 320px;
	background-size: contain
}
.email_wrap, .news_wrap {
    width: 295px;
	background-size: contain;
	font-size:14px;
}
.btn_more {

    margin-top: 0px;
}
.mobile_410 {
	width:90%;
	
}
.news_wrap, .email_wrap {
	width: 100%;
	margin: 0;
	
}
.news {
overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;}
  
/* exReading */
.reading_more {
	display:block;
	line-height: 35px;
}
.blue_title_m span {
	margin-left:0;
}
.sharing .w_25 {
    margin-right: 0%;
    width: 100%;
}
.ui-tabs.ui-tabs-vertical .ui-tabs-nav li {
    width: 50%;
}
/* msg */
.msg .w_60, .msg .w_35 {
	width:100%;

}

.lesson_table {
	display:none;
} 
.lesson_ul .cell {
	display:block;
	text-align: initial;

}
.lesson_ul li {
	overflow:hidden;
}
.lesson_ul .table {
    border-bottom: 1px dashed rgb(102, 102, 102);
    width: 100%;
    padding: 5px 10px;
    margin-top: -30px;
}
.lesson_ul .text_center {
    border-bottom: 1px solid #CCC;
}
.lesson_ul {
	display:block;
}
header img {
    position: relative;
    left: 50%;
    margin-left: -40%;
    width: 80%;
}
footer {
	padding:5px 0px;
	line-height: 20px;
	font-size: 12px;
}
footer span {
	display:block;
}
.msg_tab .w_60, .msg_tab .w_36{
	width:100%;
	
}
#tabs .w_36 { 
	text-align:left;
}

.news_date {
	display:block;
}
.wrap {
    width: 480px;
}
#slideshow {
    width: 300px;
    top: 280px;
    margin-left: 75px;
	line-height:30px;
	height: 450px;
}
.rainbow {
	height:450px;
}

}
@media all and (min-width: 320px) and (max-width: 480px) {
    body{
      font-size:28px !important;
    }
}
@media all and (max-width: 320px) {
    body{
      font-size:32px !important;
    }