@charset "utf-8";
/* CSS Document */
/****************************** Tag ******************************/
html,body,div,h1,h2,h3,h4,p,ul,ol,dl,dt,dd,input,form{ margin:0;padding:0;}
html,body,input,textarea,select,th,td{ font-family: sqmarket, 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', メイリオ, Meiryo, 'ＭＳ Ｐゴシック', Helvetica, Arial, 'Microsoft YaHei', Georgia, sans-serif;}
.zh_fontold{font-family: "Microsoft JhengHei", serif, SimSun, SimHei, Heiti SC,sans-serif;}
.zh_font{font-family:"Microsoft Yahei","PingHei" ,"sans-serif";letter-spacing:2px;}
html,body,input,textarea,select{ font-size:12px;}
body{ background-color:#FFFFFF;background: url(/Public/images/bg_header_big_line.jpg) repeat-x;}
ul,ol{ list-style-type:none;}
img{ border:0;margin:0;padding:0;}
a{ text-decoration:none; color:#558ed5}
.content-box{
	-moz-box-sizing:content-box;
	-ms-box-sizing:content-box;
	box-sizing:content-box;
}
/****************************** Padding and Margin ******************************/
.pt5 { padding-top:5px !important; }
.pt10 { padding-top:10px !important; }
.pt15 { padding-top:15px !important; }
.pt20 { padding-top:20px !important; }
.pb5 { padding-bottom:5px !important;}
.pb10 { padding-bottom:10px !important; }
.pb15 { padding-bottom:15px !important; }
.pb20 { padding-bottom:20px !important; }
.pl5 { padding-left:5px !important; }
.pl10 { padding-left:10px !important; }
.pl15 { padding-left:15px !important; }
.pl20 { padding-left:20px !important; }
.pr5 { padding-right:5px !important; }
.pr10 { padding-right:10px !important; }
.pr15 { padding-right:15px !important; }
.pr20 { padding-right:20px !important; }
.p5 { padding:5px !important; }
.p10 { padding:10px !important; }
.ptb5 { padding:5px 0px !important; }
.ptb10 { padding:10px 0px !important; }
.ptb15 { padding:15px 0px !important; }
.ptb20 { padding:20px 0px !important; }
.plr5 { padding:0px 5px !important; }
.plr10 { padding:0px 10px !important; }
.plr15 { padding:0px 15px !important; }
.plr20 { padding:0px 20px !important; }

.mt0 { margin-top:0px !important; }
.mt5 { margin-top:5px !important; }
.mt10 { margin-top:10px !important; }
.mt15 { margin-top:15px !important; }
.mt20 { margin-top:20px !important; }
.mt30 { margin-top:30px !important; }
.mt40 { margin-top:40px !important; }
.mt50 { margin-top:50px !important; }
.mb0 { margin-bottom:0 !important; }
.mb5 { margin-bottom:5px!important; }
.mb10 { margin-bottom:10px!important; }
.mb15 { margin-bottom:15px !important;}
.mb20 { margin-bottom:20px !important; }
.mb30 { margin-bottom:30px !important; }
.mb40 { margin-bottom:40px !important; }
.mb50 { margin-bottom:50px !important; }
.ml0 { margin-left:0px !important; }
.ml5 { margin-left:5px !important; }
.ml10 { margin-left:10px !important; }
.ml15 { margin-left:15px !important; }
.ml20 { margin-left:20px !important; }
.ml30 { margin-left:30px !important; }
.ml40 { margin-left:40px !important; }
.ml50 { margin-left:50px !important; }
.mr5 { margin-right:5px !important; }
.mr10 { margin-right:10px !important; }
.mr15 { margin-right:15px !important; }
.mr20 { margin-right:20px !important; }
.mr30 { margin-right:30px !important; }
.mr40 { margin-right:40px !important; }
.mr50 { margin-right:50px !important; }
.m5 { margin:5px !important; }
.m10 { margin:10px !important; }
.mtb5 { margin:5px 0px !important; }
.mtb10 { margin:10px 0px !important; }
.mtb15 { margin:15px 0px !important; }
.mtb20 { margin:20px 0px !important; }
.mlr5 { margin:0px 5px !important;}
.mlr10 { margin:0px 10px !important; }
.mlr15 { margin:0px 15px !important; }
.mlr20 { margin:0px 20px !important; }
.margin_auto{margin:auto;}

/****************************** Color ******************************/
.explaincolor{ color:#A9A9A9;}
.answercolor{ color:#800000;}
.black{ color:#000000;}
.orange{ color:#E46B0A;}
.darkorange{ color:#EB4F38;}
.yellow{ color:#FC0;}
.green{ color:#99CC00;}
.smachugreen{ color:#5cb85c;}
.gray{ color:#2F2F2F;}
.gray333{ color:#333333;}
.grayccc{ color:#CCCCCC;}
.blue{ color:#558ed5;}
.darkblue{ color:#1f497d;}
.lightblue{ color:#f81bd;}
.red{ color:#F00;}
.white{ color:#FFF;}
.pink{ color:#fdeada;}
.pinkbg{ background-color:#fdeada;}
.graybg{ background-color:#CCCCCC;}
/****************************** Font ******************************/
.txt10{ font-size:10px !important;}
.txt12{ font-size:12px !important;}
.txt14{ font-size:14px !important;}
.txt16{ font-size:16px !important;}
.txt18{ font-size:18px !important;}
.txt20{ font-size:20px !important;}
.txt22{ font-size:22px !important;}
.txt24{ font-size:24px !important;}
.txt28{ font-size:28px !important;}
.txt30{ font-size:30px !important;}
.txt32{ font-size:32px !important;}
.txt36{ font-size:36px !important;}
.bold{ font-weight:bold;}
.nobold{font-weight:normal;}
.txtdec_ul{text-decoration:underline;}
.bitexcontent { font-size: 14px;color: #333333;line-height: 1.4;}
.inputthright th{ text-align:right !important;}
/****************************** Common ******************************/
.cf:before, .cf:after { content:"";display:table;}
.cf:after { clear:both;}
.cf{ zoom:1;}
.alignleft{ text-align:left !important;}
.aligncenter{text-align:center !important;}
.alignright{ text-align:right !important;}
.valignbottom{ vertical-align:bottom !important;}
.valigntop{ vertical-align:top !important;}
.valignmiddle{ vertical-align:middle !important;}

.red_box{border:1px solid #f00;padding:10px;}

.fr{ float:right;}
.fl{ float:left;}
.dashedtop{ border-top:1px dashed #CCC;}
.dashedbottom{ border-bottom:1px dashed #CCC;}
.hidden{ display:none;}
.dis_n{display:none;}
.dis_b{display:block;}
.auto{ margin:auto;}

/****************************** 图标字体 ******************************/
@font-face {font-family: 'iconfont';
    src: url('../font/iconfont.eot'); /* IE9*/
    src: url('../font/iconfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../font/iconfont.woff') format('woff'), /* chrome、firefox */
    url('../font/iconfont.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
    url('../font/iconfont.svg#uxiconfont') format('svg'); /* iOS 4.1- */
}
.iconfont{
    font-family:"iconfont" !important;
    font-style:normal;
    -webkit-font-smoothing: antialiased;
    -webkit-text-stroke-width: 0.2px;
    -moz-osx-font-smoothing: grayscale;}

.commoninput{margin-left:10px;background-color:#FFFFFF;height:28px;border:1px solid #1f497d;}
.commonbutton{margin-left:10px;background-color:#1f497d;height:28px;border:0px;color:#FFF;padding: 0 10px;cursor:pointer;}
.searchinput{ margin-left:10px;background-color:#FFFFFF;height:28px;width:356px;border:1px solid #1f497d;}
.searchbutton{ margin-left:10px;background-color:#1f497d;height:28px;width:100px;border:0px;color:#FFF;cursor:pointer;}
.greenbutton{ background-color: #9BBB59;-weikit-border-radius: 6px;-moz-border-radius: 6px;-o-border-radius: 6px;border-radius: 6px; color:#FFFFFF; padding:3px 10px; font-size:14px;}
.bluebutton{ background-color: #558ed5;-weikit-border-radius: 6px;-moz-border-radius: 6px;-o-border-radius: 6px;border-radius: 6px; color:#FFFFFF; padding:3px 10px; font-size:14px;}
.redbutton{ background-color: #b94a48;-weikit-border-radius: 6px;-moz-border-radius: 6px;-o-border-radius: 6px;border-radius: 6px; color:#FFFFFF; padding:3px 10px; font-size:14px;}

.audio_s{ width:35px !important;  height:35px !important;border-radius:5px;}
.audio_b{ border-radius:5px;}
/****************************** audio ******************************/
.audio_s .mejs__horizontal-volume-total {display:none !important;}
.audio_s .mejs__duration {display:none !important;}
.audio_s .mejs__volume-button {display:none !important;}
.audio_s .mejs__time-float-current{ display:none !important;}
.audio_s .mejs__time{display:none !important;}
.audio_s .mejs__button > button{margin-top:13px !important;margin-left:-2px !important;}
.audio_s .mejs__replay > button{background-position: 0 0;}
/****************************** audio ******************************/



.mejs-inner{border-radius:5px;}
.mejs-controls{border-radius:5px;}
/****************************** table ******************************/
.bitex_table{width:100%;border-collapse:collapse;}
.bitex_table th,.bitex_table td {padding:5px;border:1px solid #A8A8A8;}
.bitex_table th{font-weight:normal;background:#EEEEEE;}
.channel_table{width:100%;background:#FFFFFF;}
.channel_table th, .channel_table td{vertical-align:middle; padding:5px;}
.channel_table th{background:#9bbb59; color:#FFFFFF;}
.channel_table td{text-align:center;background:#dee7d1;}
.channel_table .even_row td, .channel_table .even_row{background:#eff3ea;}
/****************************** tab ******************************/
.nav_menu li{float:left;margin-left:4px;}
.nav_menu li:first-child{margin-left:0;}
.nav_menu li span{display:block;border: 1px solid #7F7F7F;padding: 9px;border-radius: 4px 4px 0 0;text-align:center;}
.nav_menu li .on{border-bottom: 1px solid #FFF;}
.nav_menu_box_line{border:1px solid #7F7F7F;margin-top:-1px;padding:10px 5px;}
/****************************** Head and Footer ******************************/
#main{ width:1210px;margin:auto;}
#mainchannel{ width:1010px;margin:auto;}
#header{ height:35px;padding:2px 10px 0px 0px;text-align:right;color:#FFF;}
#headernav{ display: inline-block;}
#headernav>li{ line-height:34px;height:34px;float:left;font-size:13px;padding:0px 10px 0px 10px;}
#headernav>li>a{ color:#FFF;}
#headernav>li>a:hover{text-decoration:underline;}
#footer{ padding:8px 0px 8px 0px;text-align:center;color:#333;}
#footernav{ padding-top:10px;display: inline-block;}
#footernav>li{ float:left;font-size:8px;padding:0px 10px 0px 10px;}
#footernav>li>a{ color:#333;}
#copyright>img{ padding-right:5px;}
/****************************** container ******************************/
#main>div, #main>div>div, #mainchannel>div, #mainchannel>div>div{
	-moz-box-sizing:content-box;
	-ms-box-sizing:content-box;
	box-sizing:content-box;
}
#main{ margin:auto;}
#container{ padding:5px;margin:auto;background-color:#3072c2;border-radius:5px;}
#container>div{ float:left;margin:5px;padding:10px;border-radius:5px;background-color:#FFF;font-size:12px;}
/****************************** title ******************************/
#bitexmenunav{ width:170px;}
.boxwidth1{ width:170px;}
.boxwidth2{ width:370px;}
.boxwidth3{ width:570px;}
.boxwidth4{ width:750px; padding:20px !important;}
.title1{ color:#E46B0A;background-color:#EEE;margin-bottom:20px;padding:5px 10px;font-size:24px;font-weight:bold;}
.title2{ color:#000000;margin:20px 0 10px 0;padding:3px 0;font-size:18px;font-weight:bold;border-top: 3px solid #E46B0A;border-bottom: 1px solid #CCC;}
.title3{ color:#E46B0A;background-color:#EEE;border-radius:10px;margin-bottom:10px;padding:5px 10px;font-size:14px;font-weight:bold;}
.title4{ color:#E46B0A;margin-bottom:10px;font-size:14px;font-weight:bold;border-bottom: 3px solid #E46B0A;}
.title5{ color:#E46B0A;margin:0px;padding-left:20px;font-size:14px;vertical-align:middle;background:url(/Public/images/star5.png) no-repeat left;}
.trace{ background-color:#EEE;border-radius:10px;margin-bottom:10px;padding:5px 10px;font-size:10px; }
.trace ul{zoom:1; margin-bottom:0;}
.trace ul:before, .trace ul:after { content:"";display:table;}
.trace ul:after { clear:both;}
.trace li{ float:left;padding:0 3px;}
.trace li:first-child { padding-left:15px;background:url(/Public/images/home.png) no-repeat left;}
/****************************** bitexmenu ******************************/
#menulogo{ margin:10px 0;}
#bitexmenunav a:hover { text-decoration: none;}
#bitexmenunav ul { list-style: none; position: relative; }
#bitexmenunav ul li { background:url(/Public/images/arrow.gif) no-repeat right;border-top:1px dashed #CCC;font-size:14px;font-weight:bold;padding:5px 0;position:relative;z-index:1;line-height:0;}
#bitexmenunav ul li:last-child { border-bottom: 1px dashed #CCC;}
#bitexmenunav ul li a.bigmenu { color:#333;display: block;width: 165px;overflow: hidden;padding:5px 0 5px 5px;line-height: 1;-webkit-border-radius: 4px;-moz-border-radius: 4px;-o-border-radius: 4px;border-radius: 4px;}
#bitexmenunav ul li.current a.bigmenu { -webkit-border-radius: 4px 4px 0 0 !important;-moz-border-radius: 4px 4px 0 0 !important;-o-border-radius: 4px 4px 0 0 !important;border-radius: 4px 4px 0 0 !important;}
#bitexmenunav ul li:hover a.bigmenu { background-color: #ececec;}
#bitexmenunav ul li ul { visibility:hidden;opacity:0;position: absolute;top: 5px;left: 145px;padding: 5px 7px 5px 10px;background-color: #ececec;border-bottom: none;-webkit-border-radius: 6px;-webkit-border-top-left-radius: 0;-moz-border-radius: 6px;-moz-border-radius-topleft: 0;border-radius: 6px;border-top-left-radius: 0;box-shadow: 2px 2px 2px rgba(0,0,0,0.3);-o-transition: opacity .5s; -moz-transition: opacity .5s;-webkit-transition: opacity .5s;}
#bitexmenunav ul li:hover { z-index: 100;}
#bitexmenunav ul li:hover > ul { visibility: visible;opacity: 1;}
#bitexmenunav ul li ul li { border: none !important;font-weight:normal;font-size:12px;margin: 0;padding: 0;}
#bitexmenunav ul li ul li a { width: 155px;display: block;padding: 5px 17px 5px 0px;border: none;background-image: none;text-indent: 0;line-height: 1.3;}
#bitexmenunav ul li ul li:hover { background-color: #e0e0e0;}
#bitexmenunav ul li ul li a:hover { text-decoration: none;}
#bitexmenunav ul li.current a.bigmenu { background-color: #ececec;-webkit-border-radius: 6px;-moz-border-radius: 6px;border-radius: 6px;}
#bitexmenunav ul li.current ul { visibility: visible;opacity:1;position: static;background-color: #ececec;border-bottom: none;-webkit-border-radius: 0 0 6px 6px;-moz-border-radius: 0 0 6px 6px;border-radius: 0 0 6px 6px;box-shadow: 0 0 0 rgba(0,0,0,0);}
#bitexmenunav ul li.current ul li a { width: auto;}
#bitexmenunav ul li.current ul li.current a { color: #333;}
#submenu { display: none;margin-bottom: 10px;}
#submenu ul { padding: 0 5px;}
#submenu ul li { display: inline-block;margin: 0.3em;padding: 0 0 0 15px;background: url(/Public/images/arrow_s.png) no-repeat left center !important;}
/****************************** bitexapp ******************************/
.more{ text-align:right;}
.more>a{ padding-left:15px;font-size:12px;background:url(/Public/images/play_orange.png) no-repeat left;}
/****************************** exam ******************************/
li.exam1 { background:url(/Public/images/examrank.gif) no-repeat 0 -8px;}
li.exam2 { background:url(/Public/images/examrank.gif) no-repeat 0 -111px;}
li.exam3 { background:url(/Public/images/examrank.gif) no-repeat 0 -204px;}
li.exam4 { background:url(/Public/images/examrank.gif) no-repeat 0 -297px;}
li.exam5 { background:url(/Public/images/examrank.gif) no-repeat 0 -390px;}
li.exam6 { background:url(/Public/images/examrank.gif) no-repeat 0 -475px;}
li.exam7 { background:url(/Public/images/examrank.gif) no-repeat 0 -564px;}
li.exam8 { background:url(/Public/images/examrank.gif) no-repeat 0 -652px;}
li.exam9 { background:url(/Public/images/examrank.gif) no-repeat 0 -743px;}
li.exam10{ background:url(/Public/images/examrank.gif) no-repeat 0 -832px;}
.exam{ padding-top:10px;	border-top:1px dashed #ccc;}
.exam>li { list-style-type:none;height:auto;padding:0 0 8px 35px;position:static;margin-bottom:10px;float:none;border-bottom:1px dashed #ccc;clear:both;}
/****************************** exam ******************************/
.shoparea{ width: 170px;}
.shoparea .photo { width: 85px;float: left;}
.shoparea .text { width: 85px;float: left;}
/****************************** sns ******************************/
.sns a{ font-size:10px;}
.studentnotes{ padding-left:15px;font-size:12px;background:url(/Public/images/notes.gif) no-repeat left;}
/****************************** block ******************************/
.getFlashPlayer { margin:20px 0px;padding:10px;border-top:1px dotted #ccc;border-bottom:1px dotted #ccc;overflow:hidden;}
.getFlashPlayer img { margin-right:10px;float:left;}
/****************************** index ******************************/
#newword{ text-align:center;padding:10px 0;}
#newword>a{ color:#558ed5;font-size:24px;padding:0 10px;}
#conversationtext{ width:400px;float:left;}
.test_ft{ font-size:16px;color:#E46B0A;font-weight:bold;text-align:center;}
.test-red{ color:#ff0000;font-weight:bold;font-size:16px;text-align:center;}
.test-green{ color:#5b9400;font-weight:bold;font-size:16px;text-align:center;}
.news li{ list-style-type: none;overflow: auto;padding:5px 0px 5px 0px;}
.news li:first-child { padding-top: 0;}
.news li:last-child { border-bottom: 1px dashed #CCC;}
.news span{ position:static;float:left;width:70px;}
.news p{ float:left;width:300px;}

#container{position:relative;}
#bitex_smachu{ position:absolute;top:10px; left:210px; z-index:10;}

.spellwhiteborder{ border:3px solid #FFF;}
.spellborder{ border:3px solid #CCC;}
.test_newft{ font-size:30px;color:#333333;text-align:center;}
/****************************** change ******************************/
@media only screen and (max-width:1220px) { 
	#main{ width:1010px;}
	#mainchannel{ width:1010px;}
	.boxwidth4{ width:750px;}
}
@media only screen and (max-width:1020px) { 
	#main{ width:810px;}
	#mainchannel{ width:810px;}
	.boxwidth4{ width:550px;}
}
@media only screen and (max-width:820px) { 
	#main{ width:610px;}
	#mainchannel{ width:610px !important;}
	.boxwidth4{ width:550px;}
	#bitexmenunav{ width:550px;padding:20px !important;}
	#menulogo{ width:170px;float:left;margin:0;}
	#submenu { display: block;}
	#bitexmenunav ul { float:left;width:370px;}
	#bitexmenunav ul li { width:165px;float:left;margin-left:20px;}
	#bitexmenunav ul .nenunav_bb { border-bottom:1px dashed #CCC;}
	#bitexmenunav ul li ul { display: none;}

	#bitex_smachu{ position:absolute;top:237px; left:10px;}
}
/****************************** regfinish ******************************/
.regfinish{
width:450px;max-width:99%;position:absolute;z-index:2;top:50%;left:50%;margin-left:-150px;margin-top:-75px;padding:50px 25px;background:#A5C269;line-height:1.5;border:solid 1px #71893F;font-size:16px;}
.regfinish a{
position:absolute;top:0;right:10px;font-size:36px;color:#000000;}
.opacity{
-moz-opacity:0.9;-khtml-opacity: 0.9;-webkit-opacity: 0.9;-o-opacity: 0.9;-ms-opacity: 0.9;opacity: 0.9;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)"; /*IE8*/
filter:alpha(opacity=90);  /*IE5、IE5.5、IE6、IE7*/
}
.radius4{
border-radius: 4px;-moz-border-radius: 4px; -weikit-border-radius: 4px; -o-border-radius: 4px; -khtml-border-radius: 4px; -ms-border-radius: 4px;}
@media only screen and (max-width:820px) { 
.regfinish{margin-left:-250px;} 
}
@media only screen and (max-width:500px) { 
.regfinish{left:50%;margin-left:-50%;font-size:12px;padding:30px 10px;}	
}
/******************************  ******************************/

/****************************** scoial ******************************/
.hanamaru{
	background:url(../images/hanamaru.png) center top no-repeat !important;
}
/****************************** scoial ******************************/
/****************************** essay ******************************/
.essay_dailywordbox {POSITION: relative;}
.essay_dailywordbox A {POSITION: relative; PADDING-BOTTOM: 0px; LINE-HEIGHT: 20px; BACKGROUND-COLOR: #666; MARGIN: 4px 12px 4px 0px; PADDING:2px 10px 2px 14px; ; DISPLAY: inline; FLOAT: left; COLOR: #FFF;TEXT-DECORATION: none; border-radius: 0 2px 2px 0; -webkit-border-radius: 0 2px 2px 0; -moz-border-radius: 0 2px 2px 0; -o-border-radius: 0 2px 2px 0; -ms-border-radius: 0 2px 2px 0;}
.essay_dailywordbox A:after {BORDER-BOTTOM: #FFF 2px solid; POSITION: absolute; BORDER-LEFT: #FFF 2px solid; BORDER-TOP: #FFF 2px solid; CONTENT: ""; TOP: 10px; BORDER-RIGHT: #FFF 2px solid; LEFT: -1px; border-radius: 50%;}
.essay_dailywordbox A:before {BORDER-BOTTOM: transparent 12px solid; POSITION: absolute; BORDER-LEFT: transparent 12px solid; WIDTH: 0px; HEIGHT: 0px; BORDER-TOP: transparent 12px solid; CONTENT: ""; TOP: 0px; RIGHT: 100%; BORDER-RIGHT: #666 12px solid;}
/****************************** essay ******************************/


