@charset "utf-8";

/**** reset ****/
body { margin:0; padding:0; border:0; outline:0; background-color:#f3f3f3; color:#000000; font-size:13px; font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,Meiryo,"メイリオ","ＭＳ Ｐゴシック","MS PGothic",Helvetica,Arial,sans-serif; line-height:1.5; vertical-align:baseline; /*word-break:break-all;*/ }
html,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,em,i,img,strong,dl,dt,dd,ol,ul,li,form,label,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,dialog,figure,figcaption,footer,header,hgroup,menu,nav,section,time,mark,audio,video,button
{ margin:0; padding:0; border:0; outline:0; background:transparent; font-size:inherit; font-family:inherit; vertical-align:inherit; list-style-type:none; font-weight:inherit; font-style:normal; /*word-break:break-all;*/ }
img { vertical-align:top; }
select,input,textarea { font-family:inherit; font-size:inherit; font-weight:inherit; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
article,aside,dialog,div,figure,footer,header,hgroup,nav,section { display:block; }
a { color:#418abb; text-decoration:none; }
a:hover,a:active { color:#1da0d0; text-decoration:none; }
.clear { clear:both; zoom:1; } .clear:after { content:''; display:block; clear:both; }
audio { position:absolute; display:none; } /* for iOS 7 */
[hidden] {
    display: none!important;
}
/**** fonts ****/
.lang-en,.lang-ja { font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,Meiryo,"メイリオ","ＭＳ Ｐゴシック","MS PGothic",Helvetica,Arial,sans-serif; }
.lang-zh,.lang-ce,.lang-hj,.lang-zh_cp { font-family:"Hiragino Sans GB","Microsoft YaHei","微软雅黑","MS PGothic",Helvetica,Arial,sans-serif; }
.lang-tw { font-family:"Hiragino Sans GB","Microsoft JhengHei","微軟正黑體","MS PGothic",Helvetica,Arial,sans-serif; }
.lang-pt { font-family:Helvetica,Arial,sans-serif; }
.lang-ko { font-family:Helvetica,Arial,sans-serif; }
.lang-it { font-family:Helvetica,Arial,sans-serif; }
.lang-ru { font-family:Helvetica,Arial,sans-serif; }
.lang-fa { font-family:Helvetica,Arial,sans-serif; }
.lang-mm { font-family:Myanmar3,Arial,Tahoma,Georgia,serif; }

/**** form ****/
input { line-height:normal; }
input[type="text"],input[type="password"],textarea { height:32px; padding:7px 8px 4px 8px; font-size:13px; line-height:19px; vertical-align:middle; color:#000000; background:#ffffff; border:1px solid #c7cad3; outline:none; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; border-radius:0; -webkit-appearance:none; }
input[type="text"]:focus,input[type="password"]:focus,textarea:focus { background-color:#fdfdfd; /*background-color:#faffba;*/ }
input[type="text"]:disabled,input[type="password"]:disabled,textarea:disabled { background-color:#f6f6f6; }
textarea { height:auto; }
input::-ms-clear { visibility:hidden; }
::-moz-placeholder { color:#cccccc !important; opacity:1 !important; }
:-ms-input-placeholder { color:#cccccc !important; }
::-webkit-input-placeholder { color:#cccccc !important; }
button::-moz-focus-inner, input::-moz-focus-inner { padding:0; border:0; }
input[type="text"].warning,input[type="password"].warning,textarea.warning { border-color:#ee0000; }
/* default checkbox,radio,select */
label { line-height:32px; vertical-align:middle; }
label+label { margin-left:10px; }
input[type="checkbox"],input[type="radio"] { display:inline; height:32px; line-height:32px; vertical-align:middle; margin:0 6px 0 0; }
input[type="checkbox"] { position:relative; top:-1px; }
select { height:32px; font-size:13px; line-height:32px; vertical-align:middle; border:1px solid #c7cad3; background:#ffffff; outline:none; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
/* customized checkbox */
.form-checkbox { display:inline-block; position:relative; padding:0 8px 0 0; min-width:40px; height:32px; line-height:32px; font-size:13px; vertical-align:middle; background:transparent; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; user-select:none; -moz-user-select:none; -webkit-user-select:none; -ms-user-select:none; }
.form-checkbox:before { content:""; display:inline-block; position:absolute; top:7px; left:0; width:16px; height:16px; border:1px solid #c7cad3; }
.form-checkbox.checked:after { content:"\e6fe"; font-family:"icon"; display:inline-block; position:absolute; top:0; left:3px; font-size:12px; line-height:32px; vertical-align:middle; color:#000000; }
.form-checkbox > label { padding:0 0 0 22px; }
.form-checkbox.disabled { color:#aaaaaa; }
.form-checkbox.disabled.checked:after { color:#aaaaaa; }
.form-checkbox.padding1px > label { padding:0 0 0 23px; }
.form-checkbox.padding2px > label { padding:0 0 0 24px; }
.form-checkbox.padding3px > label { padding:0 0 0 25px; }
.form-checkbox.box-only { padding:0; min-width:18px; width:18px; }
.form-checkbox.box-only > label { padding:0; }
.form-checkbox.wide-span > label { padding-left:27px; }
.form-checkbox.warning:before { border-color:#ee0000; }
.form-checkbox.warning.checked:after { color:#ee0000; }
.form-checkbox.warning > label { color:#ee0000; }
.form-checkbox.strong-blue.checked > label { color:#418abb; }
.form-checkbox.strong-blue.checked:before { border-color:#418abb; }
.form-checkbox.strong-blue.checked:after { color:#418abb; }
.form-checkbox.strong-blue.checked.disabled { opacity:0.5; }
.form-checkbtn { display:inline-block; }
/* customized radio-button */
.form-radio { display:inline-block; position:relative; padding:0 8px 0 0; min-width:40px; height:32px; line-height:32px; font-size:13px; vertical-align:middle; background:transparent; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; user-select:none; -moz-user-select:none; -webkit-user-select:none; -ms-user-select:none; }
.form-radio:before { content:""; display:inline-block; position:absolute; top:7px; left:0; width:16px; height:16px; border:1px solid #c7cad3; border-radius:8px; background:#ffffff; }
.form-radio.checked:after { content:""; display:inline-block; position:absolute; top:12px; left:5px; width:8px; height:8px; background:#000000; border-radius:4px; }
.form-radio > label { padding:0 0 0 22px; }
.form-radio.disabled { color:#aaaaaa; }
.form-radio.disabled.checked:after { background:#aaaaaa; }
.form-radio.radio-only { padding:0; min-width:18px; width:18px; }
.form-radio.radio-only > label { padding:0; }
.form-radio.wide-span > label { padding-left:27px; }
.form-radio.strong-orange.checked > label { color:#d94d38; font-weight:bold; }
.form-radio.strong-orange.checked:before { border-color:#d94d38; }
.form-radio.strong-orange.checked:after { background:#d94d38; }
.form-radio.warning:before { border-color:#ee0000; }
.form-radio.warning.checked:after { background-color:#ee0000; }
/* customized select-box */
.form-select { display:inline-block; position:relative; cursor:pointer; padding:0 32px 0 0; height:32px; line-height:32px; font-size:13px; vertical-align:middle; border:1px solid #c7cad3; background:#ffffff; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; user-select:none; -moz-user-select:none; -webkit-user-select:none; -ms-user-select:none; }
.form-select > label { display:block; padding:0 8px 0 8px; vertical-align:middle; cursor:pointer; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; -webkit-text-overflow:ellipsis; }
.form-select > label.placeholder { color:#cccccc; }
.form-select > div { position:absolute; top:30px; left:-1px; z-index:1; min-width:100px; max-height:200px; overflow-x:hidden; overflow-y:auto; background:#ffffff; border-bottom:1px solid #c7cad3; }
.form-select > div > button { display:block; width:100%; border:1px solid #c7cad3; border-bottom:none; padding:0 30px 0 8px; line-height:31px; font-size:13px; font-weight:normal; text-align:left; vertical-align:middle; white-space:nowrap; }
.form-select > div > button:hover,.form-select > div > button.selected { background-color:#f0f0f0; }
.form-select > a.carret { outline:none; position:absolute; bottom:0; right:0; }
.form-select > a.carret:after { content:"\e8c9"; font-family:"icon"; display:inline-block; position:absolute; bottom:-1px; right:-1px; width:32px; height:32px; line-height:32px; font-size:10px; text-align:center; vertical-align:middle; color:#747474; background:#ffffff; border:1px solid #c7cad3; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
.form-select.disabled > label { color:#aaaaaa; }
.form-select.disabled > a.carret:after { color:#c7cad3; }
.form-select.warning { border-color:#ee0000; }
.form-select.warning > a.carret:after { border-color:#ee0000; color:#ee0000; }
.form-select.order { padding:0 28px 0 0; height:28px; line-height:28px; font-size:11px; border-color:#dadada; }
.form-select.order > label { line-height:28px; }
.form-select.order > div { position:absolute; top:26px; }
.form-select.order > div > button { padding:0 26px 0 8px; line-height:29px; font-size:11px; }
.form-select.order > a.carret:after { width:28px; height:28px; line-height:28px; border-color:#dadada;  }
/* customized date-field */
.form-date { display:inline-block; position:relative; }
/* inline blocks */
.form-inline { display:inline-block; height:32px; line-height:32px; vertical-align:middle; }
.form-inline.small,.form-inline.xsmall,.form-inline.xxsmall { line-height:32px !important; }
.form-inline.mini { display:inline-block; height:28px; line-height:28px; vertical-align:middle; }
/* layouts for forms */
dl.form-field { display:table; width:100%; border-bottom:1px solid #e1e1e1; }
dl.form-field.border-top { border-top:1px solid #e1e1e1; }
dl.form-field.border-bottom-none { border-bottom:none; }
dl.form-field > dt { display:table-cell; width:100px; padding:8px 20px 8px 8px; text-align:right; vertical-align:top; line-height:32px; background:#f9f9f9; border-right:1px solid #e1e1e1;position:relative; color:#222222; }
dl.form-field > dt:before { content:""; display:block; position:absolute; top:0; left:0; width:100%; height:1px; border-top:1px solid #ffffff; }
dl.form-field > dt.required:after { content:"\e6fb"; display:inline-block; font-family:"icon"; font-size:11px; line-height:32px; color:#d38b8b; padding:0 0 0 8px; }
dl.form-field > dd { display:table-cell; padding:8px; text-align:left; vertical-align:top;  }
dl.form-field > dd + dd.border-left { border-left:1px solid #e1e1e1; }
dl.form-field > dd + dd.min { width:1%; white-space:nowrap; }
dl.form-field > dd.list { padding:0; }
dl.form-field > dd.list > dl { display:table; width:100%; }
dl.form-field > dd.list > dl > dt,
dl.form-field > dd.list > dl > dd { display:table-cell; border-top:1px solid #e1e1e1; padding:8px; line-height:32px; vertical-align:middle; }
dl.form-field > dd.list > dl:first-child > dt,
dl.form-field > dd.list > dl:first-child > dd { border-top:none; }
dl.form-field > dd.list > dl > dd { border-left:1px solid #e1e1e1; }
dl.form-field > dd.list > dl > dd.status { width:40px; text-align:center; }
dl.form-field > dd.list > dl > dd.min { width:1%; white-space:nowrap; }
dl.form-field > dd.list > dl.invalid { background:#fdfdfd; }
dl.list-field { display:table; width:100%; border-bottom:1px solid #e1e1e1; }
dl.list-field.border-none { border-bottom:none; }
dl.list-field.border-top { border-top:1px solid #e1e1e1; }
dl.list-field > dt { display:table-cell; padding:6px 20px 6px 12px; text-align:left; vertical-align:top; line-height:22px; font-size:12px;  white-space:nowrap; position:relative; }
dl.list-field > dd { display:table-cell; padding:6px 12px 6px 6px; text-align:right; vertical-align:top; line-height:22px; font-size:12px; }

/*
dl.form-field-vertical { display:block; padding:8px 6px 6px 6px; border-bottom:1px solid #e1e1e1; }
dl.form-field-vertical.border-top { border-top:1px solid #e1e1e1; }
dl.form-field-vertical > dt { display:block; margin:0 0 6px 0; padding:1px 0 0 6px; border-left:5px solid #ddddee; }
dl.form-field-vertical > dt.required:after { content:"\e6fb"; display:inline-block; font-family:"icon"; font-size:11px; line-height:32px; color:#d38b8b; padding:0 0 0 8px; }
dl.form-field-vertical > dd { display:block;  }
*/
dl.form-field-vertical { display:block; }
dl.form-field-vertical.border-top { border-top:1px solid #e1e1e1; }
dl.form-field-vertical > dt { display:block; padding:8px 20px 8px 8px; line-height:32px; background:#f9f9f9; border-bottom:1px solid #e1e1e1; position:relative; color:#222222; }
dl.form-field-vertical > dt:before { content:""; display:block; position:absolute; top:0; left:0; width:100%; height:1px; border-top:1px solid #ffffff; }
dl.form-field-vertical > dt.required:after { content:"\e6fb"; display:inline-block; font-family:"icon"; font-size:11px; line-height:32px; color:#d38b8b; padding:0 0 0 8px; }
dl.form-field-vertical > dd { padding:8px; text-align:left; vertical-align:top; border-bottom:1px solid #e1e1e1;  }
dl.form-field-vertical.border-bottom-none > dd { border-bottom:none; }



/**** display,position ****/
.block { display:block !important; } .inline { display:inline !important; } .inline-block { display:inline-block !important; }
.tl { text-align:left !important; } .tr { text-align:right !important; } .tc { text-align:center !important; }
.vt { vertical-align:top !important; } .vb { vertical-align:bottom !important; } .vm,.vc { vertical-align:middle !important; } .vbase { vertical-align:baseline !important; }
.fl { float:left !important; } .fr { float:right !important; }
.nr { white-space:nowrap !important; }
.wp { white-space:wrap !important; }
.nr-force { white-space:nowrap !important; overflow:hidden !important; }
.absolute { position:absolute !important; } .relative { position:relative !important; } .fixed { position:fixed !important; }
.absolute-top-right { position:absolute !important; top:0 !important; right:0 !important; }
.absolute-top-left { position:absolute !important; top:0 !important; left:0 !important; }
.absolute-bottom-right { position:absolute !important; bottom:0 !important; right:0 !important; }
.absolute-bottom-left { position:absolute !important; bottom:0 !important; left:0 !important; }
.absolute-left-50p { position:absolute !important; left:50% !important; }
.absolute-top-50p { position:absolute !important; top:50% !important; }
.absolute-top-left-50p { position:absolute !important; left:50% !important; top:50% !important; }
.reset-position { position:relative !important; top:0 !important; left:0 !important; }
.top1px { position:relative; top:1px; } .top2px { position:relative; top:2px; } .top3px { position:relative; top:3px; }  .top4px { position:relative; top:4px; } .top5px { position:relative; top:5px; } .top10px { position:relative; top:10px; }
.top-1px { position:relative; top:-1px; } .top-2px { position:relative; top:-2px; } .top-3px { position:relative; top:-3px; } .top-4px { position:relative; top:-4px; } .top-5px { position:relative; top:-5px; } .top-10px { position:relative; top:-10px; }
.left1px { position:relative; left:1px; } .left2px { position:relative; left:2px; } .left3px { position:relative; left:3px; }
.left-1px { position:relative; left:-1px; } .left-2px { position:relative; left:-2px; } .left-3px { position:relative; left:-3px; }
.break-all { word-break:break-all; }

/**** font,color ****/
.f7px { font-size:7px !important; } .f8px { font-size:8px !important; } .f9px { font-size:9px !important; } .f10px { font-size:10px !important; } .f11px { font-size:11px !important; } .f12px { font-size:12px !important; } .f13px { font-size:13px !important; } .f14px { font-size:14px !important; } .f15px { font-size:15px !important; } .f16px { font-size:16px !important; } .f17px { font-size:17px !important; } .f18px { font-size:18px !important; } .f19px { font-size:19px !important; } .f20px { font-size:20px !important; } .f21px { font-size:21px !important; } .f22px { font-size:22px !important; } .f23px { font-size:23px !important; } .f24px { font-size:24px !important; } .f25px { font-size:25px !important; } .f30px { font-size:30px !important; }
div.small,p.small,span.small,strong.small,em.small,i.small,ul.small,li.small { font-size:12px !important; }
div.xsmall,p.xsmall,span.xsmall,strong.xsmall,em.xsmall,i.xsmall,ul.xsmall,li.xsmall { font-size:11px !important; }
div.xxsmall,p.xxsmall,span.xxsmall,strong.xxsmall,em.xxsmall,i.xxsmall,ul.xxsmall,li.xxsmall { font-size:10px !important; }
div.xxxsmall,p.xxxsmall,span.xxxsmall,strong.xxxsmall,em.xxxsmall,i.xxxsmall,ul.xxxsmall,li.xxxsmall { font-size:9px !important; }
div.small,p.small { line-height:17px; } div.xsmall,p.xsmall { line-height:16px; }
div.bold,p.bold,span.bold,strong.bold,em.bold,i.bold,a.bold,h1.bold,h2.bold { font-weight:bold !important; } div.normal,p.normal,span.normal,strong.normal,em.normal,i.normal,a.normal { font-weight:normal !important; }
.line-through { text-decoration:line-through; }
.underline { text-decoration:underline; }
a.underline:hover { text-decoration:underline; }
.black { color:#000000; }
.blue { color:#418abb; }
.red { color:#ee0000; }
.gray { color:#999999; }
.lightgray { color:#bbbbbb; }
.bordergray { color:#c7cad3; }
.bluegray { color:#858da3; }
.blackgray { color:#555555; }
.orange { color:#d94d38; }
.green { color:#11aa11; }
.purple { color:#d82974; }
.skype-blue { color:#009fe3; }

/**** border ****/
.r0 { border-radius:0 !important; } .r1 { border-radius:1px !important; } .r2 { border-radius:2px !important; } .r3 { border-radius:3px !important; } .r4 { border-radius:4px !important; } .r5 { border-radius:5px !important; } .r6 { border-radius:6px !important; } .r7 { border-radius:7px !important; } .r8 { border-radius:8px !important; } .r9 { border-radius:9px !important; } .r10 { border-radius:10px !important; }

/**** opacity ****/
.op50 { opacity:0.5 !important; } .op75 { opacity:0.75 !important; }

/**** width,height,margin,padding ****/
.wauto { width:auto !important; }
.w10 { width:10px !important; } .w20 { width:20px !important; } .w30 { width:30px !important; } .w40 { width:40px !important; } .w50 { width:50px !important; } .w60 { width:60px !important; } .w70 { width:70px !important; } .w80 { width:80px !important; } .w90 { width:90px !important; }
.w100 { width:100px !important; } .w110 { width:110px !important; } .w120 { width:120px !important; } .w130 { width:130px !important; } .w140 { width:140px !important; } .w150 { width:150px !important; } .w160 { width:160px !important; } .w170 { width:170px !important; } .w180 { width:180px !important; } .w190 { width:190px !important; }
.w200 { width:200px !important; } .w210 { width:210px !important; } .w220 { width:220px !important; } .w230 { width:230px !important; } .w240 { width:240px !important; } .w250 { width:250px !important; } .w260 { width:260px !important; } .w270 { width:270px !important; } .w280 { width:280px !important; } .w290 { width:290px !important; }
.w300 { width:300px !important; } .w350 { width:350px !important; } .w400 { width:400px !important; } .w450 { width:450px !important; } .w500 { width:500px !important; } .w600 { width:600px !important; } .w700 { width:700px !important; } .w800 { width:800px !important; } .w900 { width:900px !important; } .w1000 { width:1000px !important; }
.w225 { width:225px !important; } .w255 { width:255px !important; } .w320 { width:320px !important; } .w720 { width:720px !important; }
.w10p { width:10% !important; } .w14p { width:14% !important; } .w16p { width:16% !important; } .w17p { width:17% !important; } .w20p { width:20% !important; } .w25p { width:25% !important; } .w30p { width:30% !important; } .w33p { width:33% !important; } .w40p { width:40% !important; } .w45p { width:45% !important; } .w49p { width:49% !important; } .w50p { width:50% !important; } .w60p { width:60% !important; } .w70p { width:70% !important; } .w80p { width:80% !important; } .w90p { width:90% !important; } .w100p { width:100% !important; }
.minw100 { min-width:100px; } .minw150 { min-width:150px; } .minw200 { min-width:200px; }
.minh100 { min-height:100px; } .minh150 { min-height:150px; } .minh200 { min-height:200px; }
.hauto { height:auto !important; }
.h10 { height:10px !important; } .h20 { height:20px !important; } .h30 { height:30px !important; } .h40 { height:40px !important; } .h50 { height:50px !important; } .h60 { height:60px !important; } .h70 { height:70px !important; } .h80 { height:80px !important; } .h90 { height:90px !important; }
.h100 { height:100px !important; } .h110 { height:110px !important; } .h120 { height:120px !important; } .h130 { height:130px !important; } .h140 { height:140px !important; } .h150 { height:150px !important; } .h160 { height:160px !important; } .h170 { height:170px !important; } .h180 { height:180px !important; } .h190 { height:190px !important; }
.h200 { height:200px !important; } .h210 { height:210px !important; } .h220 { height:220px !important; } .h230 { height:230px !important; } .h240 { height:240px !important; } .h250 { height:250px !important; } .h260 { height:260px !important; } .h270 { height:270px !important; } .h280 { height:280px !important; } .h290 { height:290px !important; }
.h300 { height:300px !important; } .h350 { height:300px !important; } .h400 { height:400px !important; } .h450 { height:450px !important; } .h500 { height:500px !important; } .h600 { height:600px !important; } .h700 { height:700px !important; } .h800 { height:800px !important; } .h900 { height:900px !important; } .h1000 { height:1000px !important; }
.h165 { height:165px !important; }
.h50p { height:50% !important; } .h100p { height:100% !important; }
.mauto { margin-left:auto !important; margin-right:auto !important; } .mrauto { margin-right:auto !important; } .mlauto { margin-left:auto !important; }
.m0 { margin:0px !important; } .m1 { margin:1px !important; } .m2 { margin:2px !important; } .m3 { margin:3px !important; } .m4 { margin:4px !important; } .m5 { margin:5px !important; } .m6 { margin:6px !important; } .m7 { margin:7px !important; } .m8 { margin:8px !important; } .m9 { margin:9px !important; }
.m10 { margin:10px !important; } .m15 { margin:15px !important; } .m20 { margin:20px !important; } .m30 { margin:30px !important; } .m40 { margin:40px !important; } .m50 { margin:50px !important; }
.mb0 { margin-bottom:0px !important; } .mb1 { margin-bottom:1px !important; } .mb2 { margin-bottom:2px !important; } .mb3 { margin-bottom:3px !important; } .mb4 { margin-bottom:4px !important; } .mb5 { margin-bottom:5px !important; } .mb6 { margin-bottom:6px !important; } .mb7 { margin-bottom:7px !important; } .mb8 { margin-bottom:8px !important; } .mb9 { margin-bottom:9px !important; }
.mb10 { margin-bottom:10px !important; } .mb15 { margin-bottom:15px !important; } .mb20 { margin-bottom:20px !important; } .mb25 { margin-bottom:25px !important; } .mb30 { margin-bottom:30px !important; } .mb40 { margin-bottom:40px !important; } .mb50 { margin-bottom:50px !important; } .mb60 { margin-bottom:60px !important; } .mb70 { margin-bottom:70px !important; } .mb80 { margin-bottom:80px !important; } .mb90 { margin-bottom:90px !important; }
.mb100 { margin-bottom:100px !important; } .mb110 { margin-bottom:110px !important; } .mb120 { margin-bottom:120px !important; } .mb130 { margin-bottom:130px !important; } .mb140 { margin-bottom:140px !important; } .mb150 { margin-bottom:150px !important; } .mb160 { margin-bottom:160px !important; } .mb170 { margin-bottom:170px !important; } .mb180 { margin-bottom:180px !important; } .mb190 { margin-bottom:190px !important; }
.mb200 { margin-bottom:200px !important; } .mb300 { margin-bottom:300px !important; }
.mt0 { margin-top:0px !important; } .mt1 { margin-top:1px !important; } .mt2 { margin-top:2px !important; } .mt3 { margin-top:3px !important; } .mt4 { margin-top:4px !important; } .mt5 { margin-top:5px !important; } .mt6 { margin-top:6px !important; } .mt7 { margin-top:7px !important; } .mt8 { margin-top:8px !important; } .mt9 { margin-top:9px !important; }
.mt10 { margin-top:10px !important; } .mt15 { margin-top:15px !important; } .mt20 { margin-top:20px !important; } .mt25 { margin-top:25px !important; } .mt30 { margin-top:30px !important; } .mt40 { margin-top:40px !important; } .mt50 { margin-top:50px !important; } .mt60 { margin-top:60px !important; } .mt70 { margin-top:70px !important; } .mt80 { margin-top:80px !important; } .mt90 { margin-top:90px !important; }
.mt100 { margin-top:100px !important; } .mt110 { margin-top:110px !important; } .mt120 { margin-top:120px !important; } .mt130 { margin-top:130px !important; } .mt140 { margin-top:140px !important; } .mt150 { margin-top:150px !important; } .mt160 { margin-top:160px !important; } .mt170 { margin-top:170px !important; } .mt180 { margin-top:180px !important; } .mt190 { margin-top:190px !important; }
.mt200 { margin-top:200px !important; } .mt300 { margin-top:300px !important; }
.mr0 { margin-right:0px !important; } .mr1 { margin-right:1px !important; } .mr2 { margin-right:2px !important; } .mr3 { margin-right:3px !important; } .mr4 { margin-right:4px !important; } .mr5 { margin-right:5px !important; } .mr6 { margin-right:6px !important; } .mr7 { margin-right:7px !important; } .mr8 { margin-right:8px !important; } .mr9 { margin-right:9px !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; }
.ml0 { margin-left:0px !important; } .ml1 { margin-left:1px !important; } .ml2 { margin-left:2px !important; } .ml3 { margin-left:3px !important; } .ml4 { margin-left:4px !important; } .ml5 { margin-left:5px !important; } .ml6 { margin-left:6px !important; } .ml7 { margin-left:7px !important; } .ml8 { margin-left:8px !important; } .ml9 { margin-left:9px !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; } .ml80 { margin-left:80px !important; }
.pauto { padding-left:auto !important; padding-right:auto !important; } .prauto { padding-right:auto !important; } .plauto { padding-left:auto !important; }
.p0 { padding:0px !important; } .p1 { padding:1px !important; } .p2 { padding:2px !important; } .p3 { padding:3px !important; } .p4 { padding:4px !important; } .p5 { padding:5px !important; } .p6 { padding:6px !important; } .p7 { padding:7px !important; } .p8 { padding:8px !important; } .p9 { padding:9px !important; }
.p10 { padding:10px !important; } .p15 { padding:15px !important; } .p20 { padding:20px !important; } .p30 { padding:30px !important; } .p40 { padding:40px !important; } .p50 { padding:50px !important; }
.pb0 { padding-bottom:0px !important; } .pb1 { padding-bottom:1px !important; } .pb2 { padding-bottom:2px !important; } .pb3 { padding-bottom:3px !important; } .pb4 { padding-bottom:4px !important; } .pb5 { padding-bottom:5px !important; } .pb6 { padding-bottom:6px !important; } .pb7 { padding-bottom:7px !important; } .pb8 { padding-bottom:8px !important; } .pb9 { padding-bottom:9px !important; }
.pb10 { padding-bottom:10px !important; } .pb15 { padding-bottom:15px !important; } .pb20 { padding-bottom:20px !important; } .pb25 { padding-bottom:25px !important; } .pb30 { padding-bottom:30px !important; } .pb40 { padding-bottom:40px !important; } .pb50 { padding-bottom:50px !important; } .pb60 { padding-bottom:60px !important; } .pb70 { padding-bottom:70px !important; } .pb80 { padding-bottom:80px !important; } .pb90 { padding-bottom:90px !important; }
.pb100 { padding-bottom:100px !important; } .pb110 { padding-bottom:110px !important; } .pb120 { padding-bottom:120px !important; } .pb130 { padding-bottom:130px !important; } .pb140 { padding-bottom:140px !important; } .pb150 { padding-bottom:150px !important; } .pb160 { padding-bottom:160px !important; } .pb170 { padding-bottom:170px !important; } .pb180 { padding-bottom:180px !important; } .pb190 { padding-bottom:190px !important; }
.pb200 { padding-bottom:200px !important; } .pb300 { padding-bottom:300px !important; }
.pt0 { padding-top:0px !important; } .pt1 { padding-top:1px !important; } .pt2 { padding-top:2px !important; } .pt3 { padding-top:3px !important; } .pt4 { padding-top:4px !important; } .pt5 { padding-top:5px !important; } .pt6 { padding-top:6px !important; } .pt7 { padding-top:7px !important; } .pt8 { padding-top:8px !important; } .pt9 { padding-top:9px !important; }
.pt10 { padding-top:10px !important; } .pt15 { padding-top:15px !important; } .pt20 { padding-top:20px !important; } .pt25 { padding-top:25px !important; } .pt30 { padding-top:30px !important; } .pt40 { padding-top:40px !important; } .pt50 { padding-top:50px !important; } .pt60 { padding-top:60px !important; } .pt70 { padding-top:70px !important; } .pt80 { padding-top:80px !important; } .pt90 { padding-top:90px !important; }
.pt100 { padding-top:100px !important; } .pt110 { padding-top:110px !important; } .pt120 { padding-top:120px !important; } .pt130 { padding-top:130px !important; } .pt140 { padding-top:140px !important; } .pt150 { padding-top:150px !important; } .pt160 { padding-top:160px !important; } .pt170 { padding-top:170px !important; } .pt180 { padding-top:180px !important; } .pt190 { padding-top:190px !important; }
.pt200 { padding-top:200px !important; } .pt300 { padding-top:300px !important; }
.pr0 { padding-right:0px !important; } .pr1 { padding-right:1px !important; } .pr2 { padding-right:2px !important; } .pr3 { padding-right:3px !important; } .pr4 { padding-right:4px !important; } .pr5 { padding-right:5px !important; } .pr6 { padding-right:6px !important; } .pr7 { padding-right:7px !important; } .pr8 { padding-right:8px !important; } .pr9 { padding-right:9px !important; }
.pr10 { padding-right:10px !important; } .pr15 { padding-right:15px !important; } .pr20 { padding-right:20px !important; } .pr30 { padding-right:30px !important; } .pr35 { padding-right:35px !important; } .pr40 { padding-right:40px !important; } .pr45 { padding-right:45px !important; } .pr50 { padding-right:50px !important; }
.pl0 { padding-left:0px !important; } .pl1 { padding-left:1px !important; } .pl2 { padding-left:2px !important; } .pl3 { padding-left:3px !important; } .pl4 { padding-left:4px !important; } .pl5 { padding-left:5px !important; } .pl6 { padding-left:6px !important; } .pl7 { padding-left:7px !important; } .pl8 { padding-left:8px !important; } .pl9 { padding-left:9px !important; }
.pl10 { padding-left:10px !important; } .pl15 { padding-left:15px !important; } .pl20 { padding-left:20px !important; } .pl30 { padding-left:30px !important; } .pl35 { padding-left:35px !important; } .pl40 { padding-left:40px !important; } .pl45 { padding-left:45px !important; } .pl50 { padding-left:50px !important; }

/**** icon ****/
.icon, [class^="icon-"], [class*=" icon-"] { font-family:"icon"; speak:none; font-size:inherit; font-style:normal; font-weight:normal; font-variant:normal; text-transform:none; line-height:inherit; vertical-align:middle; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
.icon-clock:before { content:"\e648"; }
.icon-clock-fill:before { content:"\e649"; }
.icon-info:before { content:"\e6f7"; }
.icon-info-fill:before { content:"\e6f8"; }
.icon-header-nav-arrow-down:before { content:"\e7af"; }
.icon-header-nav-arrow-right:before { content:"\e8cb"; }
.icon-footer-scroller-arrow-up:before { content:"\e8ca"; }
.icon-pager-prev:before { content:"\e8c8"; }
.icon-pager-next:before { content:"\e8cb"; }
.icon-schedule:before { content:"\e6b3"; }
.icon-teacher:before { content:"\e95f"; }
.icon-staff:before { content:"\e611"; }
.icon-curriculum:before { content:"\e626"; }
.icon-fixing:before { content:"\e6f1"; }
.icon-review:before { content:"\e6d0"; }
.icon-search:before { content:"\e67f"; }
.icon-arrow-up-small:before { content:"\e8c3"; }
.icon-arrow-down-small:before { content:"\e8c2"; }
.icon-arrow-left-small:before { content:"\e8c1"; }
.icon-arrow-right-small:before { content:"\e8c4"; }
.icon-arrow-up:before { content:"\e8ca"; }
.icon-arrow-down:before { content:"\e8c9"; }
.icon-arrow-left:before { content:"\e8c8"; }
.icon-arrow-right:before { content:"\e8cb"; }
.icon-star-fill:before { content:"\e6d0"; }
.icon-star-half:before { content:"\e6cf"; }
.icon-star-empty:before { content:"\e6ce"; }
.icon-information-forward:before { content:"\e800"; }
.icon-facebook:before { content:"\e76a"; color:#3b5999; }
.icon-googleplus:before { content:"\e766"; color:#db4a39; }
.icon-twitter:before { content:"\e76e"; color:#55acee; }
.icon-skype:before { content:"\e79d"; color:#009fe3; }
.icon-close:before { content:"\e6fa"; }
.icon-closed:before { content:"\e6fd"; }
.icon-cancel:before { content:"\e6fd"; }
.icon-error:before { content:"\e87b"; }
.icon-required:before { content:"\e6fb"; color:#d38b8b; }
.icon-coupons:before { content:"\e88e"; }
.icon-tickets:before { content:"\e890"; }
.icon-group:before { content:"\e66f"; }
.icon-status-on:before { content:""; display:inline-block; width:10px; height:10px; background-color:#9fdf7b; border-radius:6px; border:1px solid #9fdf7b; }
.icon-status-off:before { content:""; display:inline-block; width:10px; height:10px; background-color:transparent; border-radius:6px; border:1px solid #9fdf7b; }
.icon-sns:before { content:"\e6c1"; }
.icon-sns-teacher:before { content:"\e95f"; margin-left:4px; }
.icon-sns-staff:before { content:"\e611"; margin-left:5px; position:relative; top:-1px; }
.icon-sns-student { display:none; }
.icon-sns-student:before { content:""; display:none; }
.icon-entry-public:before { content:"\e8c2"; }
.icon-entry-required_approval:before { content:"\e831"; /*color:#d94d38;*/ }
.icon-entry-rejected:before { content:"\e6f9"; color:#ee0000; }
.ticket-status-invalid { color:#d94d38; }
.ticket-status-inactive { color:#d94d38; }
.ticket-status-expired { color:#d94d38; }
.ticket-status-completed { color:#c7cad3; }
.ticket-status-active { color:#c7cad3; }

/**** country-flag ****/
[class^="country-flag-"] { display:inline-block; background:#f3f3f3 url(../images/country-flag/sprite.png) top left no-repeat; background-size:16px 2346px; width:16px; line-height:inherit; vertical-align:middle; }
[class^="country-flag-"].border { border:1px solid #e1e1e1; }
.country-flag-afg { background-position:0 -0px; height:10px; } .country-flag-alb { background-position:0 -10px; height:11px; } .country-flag-ata { background-position:0 -21px; height:10px; } .country-flag-dza { background-position:0 -31px; height:10px; } .country-flag-asm { background-position:0 -41px; height:8px; } .country-flag-and { background-position:0 -49px; height:11px; } .country-flag-ago { background-position:0 -60px; height:10px; } .country-flag-atg { background-position:0 -70px; height:10px; } .country-flag-aze { background-position:0 -80px; height:8px; } .country-flag-arg { background-position:0 -88px; height:10px; } .country-flag-aus { background-position:0 -98px; height:8px; } .country-flag-aut { background-position:0 -106px; height:10px; } .country-flag-bhs { background-position:0 -116px; height:8px; } .country-flag-bhr { background-position:0 -124px; height:9px; } .country-flag-bgd { background-position:0 -133px; height:9px; } .country-flag-arm { background-position:0 -142px; height:8px; } .country-flag-brb { background-position:0 -150px; height:10px; } .country-flag-bel { background-position:0 -160px; height:14px; } .country-flag-bmu { background-position:0 -174px; height:8px; } .country-flag-btn { background-position:0 -182px; height:10px; }
.country-flag-bol { background-position:0 -192px; height:11px; } .country-flag-bih { background-position:0 -203px; height:8px; } .country-flag-bwa { background-position:0 -211px; height:10px; } .country-flag-bvt { background-position:0 -221px; height:11px; } .country-flag-bra { background-position:0 -232px; height:11px; } .country-flag-blz { background-position:0 -243px; height:10px; } .country-flag-iot { background-position:0 -253px; height:8px; } .country-flag-slb { background-position:0 -261px; height:8px; } .country-flag-vgb { background-position:0 -269px; height:8px; } .country-flag-brn { background-position:0 -277px; height:8px; } .country-flag-bgr { background-position:0 -285px; height:9px; } .country-flag-mmr { background-position:0 -294px; height:10px; } .country-flag-bdi { background-position:0 -304px; height:9px; } .country-flag-blr { background-position:0 -313px; height:8px; } .country-flag-khm { background-position:0 -321px; height:10px; } .country-flag-cmr { background-position:0 -331px; height:10px; } .country-flag-can { background-position:0 -341px; height:8px; } .country-flag-cpv { background-position:0 -349px; height:9px; } .country-flag-cym { background-position:0 -358px; height:8px; } .country-flag-caf { background-position:0 -366px; height:10px; }
.country-flag-lka { background-position:0 -376px; height:8px; } .country-flag-tcd { background-position:0 -384px; height:10px; } .country-flag-chl { background-position:0 -394px; height:10px; } .country-flag-chn { background-position:0 -404px; height:10px; } .country-flag-twn { background-position:0 -414px; height:10px; } .country-flag-cxr { background-position:0 -424px; height:8px; } .country-flag-cck { background-position:0 -432px; height:8px; } .country-flag-col { background-position:0 -440px; height:10px; } .country-flag-com { background-position:0 -450px; height:9px; } .country-flag-myt { background-position:0 -459px; height:10px; } .country-flag-cog { background-position:0 -469px; height:10px; } .country-flag-cod { background-position:0 -479px; height:12px; } .country-flag-cok { background-position:0 -491px; height:8px; } .country-flag-cri { background-position:0 -499px; height:9px; } .country-flag-hrv { background-position:0 -508px; height:8px; } .country-flag-cub { background-position:0 -516px; height:8px; } .country-flag-cyp { background-position:0 -524px; height:10px; } .country-flag-cze { background-position:0 -534px; height:10px; } .country-flag-ben { background-position:0 -544px; height:10px; } .country-flag-dnk { background-position:0 -554px; height:12px; }
.country-flag-dma { background-position:0 -566px; height:8px; } .country-flag-dom { background-position:0 -574px; height:10px; } .country-flag-ecu { background-position:0 -584px; height:10px; } .country-flag-slv { background-position:0 -594px; height:9px; } .country-flag-gnq { background-position:0 -603px; height:10px; } .country-flag-eth { background-position:0 -613px; height:8px; } .country-flag-eri { background-position:0 -621px; height:8px; } .country-flag-est { background-position:0 -629px; height:10px; } .country-flag-fro { background-position:0 -639px; height:11px; } .country-flag-flk { background-position:0 -650px; height:8px; } .country-flag-sgs { background-position:0 -658px; height:8px; } .country-flag-fji { background-position:0 -666px; height:8px; } .country-flag-fin { background-position:0 -674px; height:10px; } .country-flag-ala { background-position:0 -684px; height:10px; } .country-flag-fra { background-position:0 -694px; height:10px; } .country-flag-guf { background-position:0 -704px; height:10px; } .country-flag-pyf { background-position:0 -714px; height:10px; } .country-flag-atf { background-position:0 -724px; height:10px; } .country-flag-dji { background-position:0 -734px; height:10px; } .country-flag-gab { background-position:0 -744px; height:12px; }
.country-flag-geo { background-position:0 -756px; height:10px; } .country-flag-gmb { background-position:0 -766px; height:10px; } .country-flag-pse { background-position:0 -776px; height:8px; } .country-flag-deu { background-position:0 -784px; height:9px; } .country-flag-gha { background-position:0 -793px; height:10px; } .country-flag-gib { background-position:0 -803px; height:8px; } .country-flag-kir { background-position:0 -811px; height:8px; } .country-flag-grc { background-position:0 -819px; height:10px; } .country-flag-grl { background-position:0 -829px; height:10px; } .country-flag-grd { background-position:0 -839px; height:9px; } .country-flag-glp { background-position:0 -848px; height:10px; } .country-flag-gum { background-position:0 -858px; height:8px; } .country-flag-gtm { background-position:0 -866px; height:10px; } .country-flag-gin { background-position:0 -876px; height:10px; } .country-flag-guy { background-position:0 -886px; height:9px; } .country-flag-hti { background-position:0 -895px; height:9px; } .country-flag-hmd { background-position:0 -904px; height:8px; } .country-flag-vat { background-position:0 -912px; height:16px; } .country-flag-hnd { background-position:0 -928px; height:8px; } .country-flag-hkg { background-position:0 -936px; height:10px; }
.country-flag-hun { background-position:0 -946px; height:8px; } .country-flag-isl { background-position:0 -954px; height:11px; } .country-flag-ind { background-position:0 -965px; height:10px; } .country-flag-idn { background-position:0 -975px; height:10px; } .country-flag-irn { background-position:0 -985px; height:9px; } .country-flag-irq { background-position:0 -994px; height:10px; } .country-flag-irl { background-position:0 -1004px; height:8px; } .country-flag-isr { background-position:0 -1012px; height:11px; } .country-flag-ita { background-position:0 -1023px; height:10px; } .country-flag-civ { background-position:0 -1033px; height:10px; } .country-flag-jam { background-position:0 -1043px; height:8px; } .country-flag-jpn { background-position:0 -1051px; height:10px; } .country-flag-kaz { background-position:0 -1061px; height:8px; } .country-flag-jor { background-position:0 -1069px; height:8px; } .country-flag-ken { background-position:0 -1077px; height:10px; } .country-flag-prk { background-position:0 -1087px; height:8px; } .country-flag-kor { background-position:0 -1095px; height:10px; } .country-flag-kwt { background-position:0 -1105px; height:8px; } .country-flag-kgz { background-position:0 -1113px; height:9px; } .country-flag-lao { background-position:0 -1122px; height:10px; }
.country-flag-lbn { background-position:0 -1132px; height:10px; } .country-flag-lso { background-position:0 -1142px; height:10px; } .country-flag-lva { background-position:0 -1152px; height:8px; } .country-flag-lbr { background-position:0 -1160px; height:8px; } .country-flag-lby { background-position:0 -1168px; height:8px; } .country-flag-lie { background-position:0 -1176px; height:9px; } .country-flag-ltu { background-position:0 -1185px; height:9px; } .country-flag-lux { background-position:0 -1194px; height:9px; } .country-flag-mac { background-position:0 -1203px; height:10px; } .country-flag-mdg { background-position:0 -1213px; height:10px; } .country-flag-mwi { background-position:0 -1223px; height:10px; } .country-flag-mys { background-position:0 -1233px; height:8px; } .country-flag-mdv { background-position:0 -1241px; height:10px; } .country-flag-mli { background-position:0 -1251px; height:10px; } .country-flag-mlt { background-position:0 -1261px; height:10px; } .country-flag-mtq { background-position:0 -1271px; height:10px; } .country-flag-mrt { background-position:0 -1281px; height:10px; } .country-flag-mus { background-position:0 -1291px; height:10px; } .country-flag-mex { background-position:0 -1301px; height:9px; } .country-flag-mco { background-position:0 -1310px; height:13px; }
.country-flag-mng { background-position:0 -1323px; height:8px; } .country-flag-mda { background-position:0 -1331px; height:8px; } .country-flag-mne { background-position:0 -1339px; height:8px; } .country-flag-msr { background-position:0 -1347px; height:8px; } .country-flag-mar { background-position:0 -1355px; height:10px; } .country-flag-moz { background-position:0 -1365px; height:10px; } .country-flag-omn { background-position:0 -1375px; height:8px; } .country-flag-nam { background-position:0 -1383px; height:10px; } .country-flag-nru { background-position:0 -1393px; height:8px; } .country-flag-npl { background-position:0 -1401px; height:19px; } .country-flag-nld { background-position:0 -1420px; height:10px; } .country-flag-cuw { background-position:0 -1430px; height:10px; } .country-flag-abw { background-position:0 -1440px; height:10px; } .country-flag-sxm { background-position:0 -1450px; height:10px; } .country-flag-bes { background-position:0 -1460px; height:10px; } .country-flag-ncl { background-position:0 -1470px; height:8px; } .country-flag-vut { background-position:0 -1478px; height:9px; } .country-flag-nzl { background-position:0 -1487px; height:8px; } .country-flag-nic { background-position:0 -1495px; height:9px; } .country-flag-ner { background-position:0 -1504px; height:13px; }
.country-flag-nga { background-position:0 -1517px; height:8px; } .country-flag-niu { background-position:0 -1525px; height:8px; } .country-flag-nfk { background-position:0 -1533px; height:8px; } .country-flag-nor { background-position:0 -1541px; height:11px; } .country-flag-mnp { background-position:0 -1552px; height:8px; } .country-flag-umi { background-position:0 -1560px; height:8px; } .country-flag-fsm { background-position:0 -1568px; height:8px; } .country-flag-mhl { background-position:0 -1576px; height:8px; } .country-flag-plw { background-position:0 -1584px; height:10px; } .country-flag-pak { background-position:0 -1594px; height:10px; } .country-flag-pan { background-position:0 -1604px; height:10px; } .country-flag-png { background-position:0 -1614px; height:12px; } .country-flag-pry { background-position:0 -1626px; height:9px; } .country-flag-per { background-position:0 -1635px; height:10px; } .country-flag-phl { background-position:0 -1645px; height:8px; } .country-flag-pcn { background-position:0 -1653px; height:8px; } .country-flag-pol { background-position:0 -1661px; height:10px; } .country-flag-prt { background-position:0 -1671px; height:10px; } .country-flag-gnb { background-position:0 -1681px; height:8px; } .country-flag-tls { background-position:0 -1689px; height:8px; }
.country-flag-pri { background-position:0 -1697px; height:10px; } .country-flag-qat { background-position:0 -1707px; height:6px; } .country-flag-reu { background-position:0 -1713px; height:10px; } .country-flag-rou { background-position:0 -1723px; height:10px; } .country-flag-rus { background-position:0 -1733px; height:10px; } .country-flag-rwa { background-position:0 -1743px; height:10px; } .country-flag-blm { background-position:0 -1753px; height:10px; } .country-flag-shn { background-position:0 -1763px; height:8px; } .country-flag-kna { background-position:0 -1771px; height:10px; } .country-flag-aia { background-position:0 -1781px; height:8px; } .country-flag-lca { background-position:0 -1789px; height:8px; } .country-flag-maf { background-position:0 -1797px; height:10px; } .country-flag-spm { background-position:0 -1807px; height:10px; } .country-flag-vct { background-position:0 -1817px; height:10px; } .country-flag-smr { background-position:0 -1827px; height:12px; } .country-flag-stp { background-position:0 -1839px; height:8px; } .country-flag-sau { background-position:0 -1847px; height:10px; } .country-flag-sen { background-position:0 -1857px; height:10px; } .country-flag-srb { background-position:0 -1867px; height:10px; } .country-flag-syc { background-position:0 -1877px; height:8px; }
.country-flag-sle { background-position:0 -1885px; height:10px; } .country-flag-sgp { background-position:0 -1895px; height:10px; } .country-flag-svk { background-position:0 -1905px; height:10px; } .country-flag-vnm { background-position:0 -1915px; height:10px; } .country-flag-svn { background-position:0 -1925px; height:8px; } .country-flag-som { background-position:0 -1933px; height:10px; } .country-flag-zaf { background-position:0 -1943px; height:10px; } .country-flag-zwe { background-position:0 -1953px; height:8px; } .country-flag-esp { background-position:0 -1961px; height:10px; } .country-flag-ssd { background-position:0 -1971px; height:8px; } .country-flag-sdn { background-position:0 -1979px; height:8px; } .country-flag-esh { background-position:0 -1987px; height:8px; } .country-flag-sur { background-position:0 -1995px; height:10px; } .country-flag-sjm { background-position:0 -2005px; height:11px; } .country-flag-swz { background-position:0 -2016px; height:10px; } .country-flag-swe { background-position:0 -2026px; height:10px; } .country-flag-che { background-position:0 -2036px; height:16px; } .country-flag-syr { background-position:0 -2052px; height:10px; } .country-flag-tjk { background-position:0 -2062px; height:8px; } .country-flag-tha { background-position:0 -2070px; height:10px; }
.country-flag-tgo { background-position:0 -2080px; height:10px; } .country-flag-tkl { background-position:0 -2090px; height:8px; } .country-flag-ton { background-position:0 -2098px; height:8px; } .country-flag-tto { background-position:0 -2106px; height:9px; } .country-flag-are { background-position:0 -2115px; height:8px; } .country-flag-tun { background-position:0 -2123px; height:10px; } .country-flag-tur { background-position:0 -2133px; height:10px; } .country-flag-tkm { background-position:0 -2143px; height:10px; } .country-flag-tca { background-position:0 -2153px; height:8px; } .country-flag-tuv { background-position:0 -2161px; height:8px; } .country-flag-uga { background-position:0 -2169px; height:10px; } .country-flag-ukr { background-position:0 -2179px; height:10px; } .country-flag-mkd { background-position:0 -2189px; height:8px; } .country-flag-egy { background-position:0 -2197px; height:10px; } .country-flag-gbr { background-position:0 -2207px; height:8px; } .country-flag-ggy { background-position:0 -2215px; height:10px; } .country-flag-jey { background-position:0 -2225px; height:9px; } .country-flag-imn { background-position:0 -2234px; height:8px; } .country-flag-tza { background-position:0 -2242px; height:10px; } .country-flag-usa { background-position:0 -2252px; height:8px; }
.country-flag-vir { background-position:0 -2260px; height:10px; } .country-flag-bfa { background-position:0 -2270px; height:10px; } .country-flag-ury { background-position:0 -2280px; height:10px; } .country-flag-uzb { background-position:0 -2290px; height:8px; } .country-flag-ven { background-position:0 -2298px; height:10px; } .country-flag-wlf { background-position:0 -2308px; height:10px; } .country-flag-wsm { background-position:0 -2318px; height:8px; } .country-flag-yem { background-position:0 -2326px; height:10px; } .country-flag-zmb { background-position:0 -2336px; height:10px; }
.country-flag-none { display:none; }

/**** header ****/
body { padding:44px 0 0 0; }
header { position:fixed; top:0; left:0; z-index:100; width:100%; height:42px; background-color:#4f4f4f; border-top:2px solid #4f4f4f; border-bottom:1px solid #5d5d5d; box-shadow:0 1px 0 0 #4f4f4f; }
header .logo { position:absolute; top:0; left:10px; width:120px; height:42px; }
header .logo > a { display:block; width:100%; height:100%; background:url(../images/common/logo.header_new_logo_img.png) bottom left no-repeat; text-indent:-9999px; }
header .school_logo > a { display:block; width:100%; height:100%; background:url(../images/common/logo.header_school.png) center left no-repeat; text-indent:-9999px;background-size: 100% }
header .logo_jp > a {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../images/common/logo.header_jp_new_m_2025_6_4.png) bottom left no-repeat;
    text-indent: -9999px;
}
header .logo_lxj > a {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../images/common/logo.header_for_lxj.png) bottom left no-repeat;
    text-indent: -9999px;
}
header .logo_sky > a {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../images/common/logo.header_for_sky.png) bottom left no-repeat;
    text-indent: -9999px;
}
header .logo_ce > a {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../images/common/logo.header_for_ce.png) bottom left no-repeat;
    text-indent: -9999px;
}
header .logo_ds > a {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../images/common/logo.header_for_ds.png) bottom left no-repeat;
    text-indent: -9999px;
}
header .logo_hj > a {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../images/common/logo.header_for_hj.png) bottom left no-repeat;
    text-indent: -9999px;
}
header .logo_td > a {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../images/common/logo.header_for_td.png) bottom left no-repeat;
    text-indent: -9999px;
}
header .logo_ph {
    height: 35px;
}
header .logo_ph > a {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../images/common/logo.header_for_ph.png) bottom left no-repeat;
    text-indent: -9999px;
    background-size: 100%;
}
header .navigation-bar {width:120px; text-align: right; position:absolute; top:0; left:10px; font-size:20px; line-height:42px; vertical-align:middle; }
header .navigation-bar a, header .navigation-bar span {color:#fff;}
.lang-zh header .navigation-bar span, .lang-zh header .navigation-bar a{line-height:normal;}
header .menu { position:absolute; top:0; right:10px; width:60px; height:42px; line-height:42px; line-height:42px; vertical-align:middle; text-align:right; }
header .menu > a { display:inline-block; width:30px; height:30px; line-height:30px; vertical-align:middle; text-align:center; font-size:22px; color:#aaaaaa; background-color:#666666; border-radius:2px; }
header .menu > a > i { position:relative; top:-2px; }
/* slidemenu */
.slidemenu { display:none; position:fixed; top:44px; right:0;  height:100%; z-index:101; overflow-y:auto; background:#666666; border-left:1px solid #606060; }
.slidemenu > ul { padding-bottom:80px; }
.slidemenu > ul > li > a { display:block; height:40px; line-height:40px; vertical-align:middle; text-align:left; padding:0 16px 0 16px; border-top:1px solid #777777; border-bottom:1px solid #555555; color:#f0f0f0; }
.slidemenu-bg { display:none; position:fixed; top:44px; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:98; }

/**** footer ****/
footer { margin:40px 0 0 0; }
footer ul.nav { display:table; width:100%; border-top:1px solid #cccccc; }
footer ul.nav.first { border-top:5px solid #dddddd; }
footer ul.nav > li { display:table-cell; width:50%; background:#f0f0f0; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
footer ul.nav > li a { display:block; padding:0 0 0 8px; color:#858da3; font-size:12px; line-height:32px; vertical-align:middle; position:relative; }
footer ul.nav > li:first-child a { border-right:1px solid #cccccc; }
footer ul.nav > li a:after { content:"\e8c7"; font-family:"icon"; display:inline-block; color:#858da3; font-size:12px; line-height:32px; vertical-align:middle; position:absolute; top:0; right:4px; }
footer ul.nav > li a:active,footer ul.nav > li a:active:after { color:#1da0d0; }
footer .copyright { padding:12px 0 12px 0; background:#4f4f4f; text-align:center; }
footer .copyright em { color:#929292; font-size:11px; }

/**** grid system ****/



/**** heading ****/
h1.heading { margin:0; padding:20px 0 10px 6px; color:#414756; font-size:17px; font-weight:bold; vertical-align:middle; }
h1.heading > a { color:#414756; }
h1.heading > a:active { opacity:0.75; }
h2.heading { color:#414756; font-size:16px; font-weight:normal; vertical-align:middle; }



/**** message ****/
#message { position:fixed; top:46px; left:0; z-index:20; width:100%; background:transparent; overflow:hidden; }
#message > .inner { position:relative; z-index:21; padding:12px 0 12px 0; font-size:16px; font-weight:bold; color:#ffffff; text-align:center; vertical-align:middle; }
#message > .inner a.close { color:#ffffff; }
#message > .inner a.close > .icon-close { font-size:14px; font-weight:normal; margin-left:10px; }
#message > .inner a:hover > .icon-close { opacity:0.8; }
#message:before { content:""; position:absolute; top:0; left:0; z-index:20; width:100%; height:100%; background:#ced96c; opacity:0.9; }

/**** error ****/
.error { color:#ee0000; }

/**** box ****/
.box { border:1px solid #c7cad3; background-color:#ffffff; text-align:left; vertical-align:top; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
.box.no-border { border:none; }
.box.border-top { border:none; border-top:1px solid #c7cad3; }
.box.border-bottom { border:none; border-bottom:1px solid #c7cad3; }
.box.border-bottom-none { border-bottom:none; }
.box.border-top-bottom { border:none; border-top:1px solid #c7cad3; border-bottom:1px solid #c7cad3; }
.box.border-light { border-color:#e1e1e1; }
.box.border-blue { border-color:#418abb; }
.box.border-orange { border-color:#d94d38; }
.box.border-red { border-color:#ee0000; }
.box.border-purple { border-color:#d82974; }
.box.clickable { cursor:pointer; }
.box.clickable:hover { background-color:#f9f9f9; }
.box.clickable:hover .thumb { opacity:0.75; }
.box.hover:hover { background:#fcfcfc; }
.box.hover_with_op75:hover { opacity:0.75; }
.box.pointer { cursor:pointer; }
.box.error { border-color:#ee0000; }
.box.bg-transparent { background:transparent; }
.box.bg-gray { background:#fcfcfc; }
.box.bg-darkgray { background:#f3f3f3; }
/* dl table */
dl.box.table { display:table; width:100%; }
dl.box.table > dt { display:table-cell; }
dl.box.table > dd { display:table-cell; }
/* message */
.box.message { border:none; background:#d94d38; box-shadow:rgba(255,255,255,0.5) 0px 0px 1px 1px inset; -webkit-box-shadow:rgba(255,255,255,0.5) 0px 0px 1px 1px inset; -moz-box-shadow:rgba(255,255,255,0.5) 0px 0px 1px 1px inset; }
.box.message * { color:#ffffff; }
/* balloon */
.box.balloon { position:relative; }
.box.balloon:after { content:''; position:absolute; bottom:-12px; left:49%; border-top:14px solid #ffffff; border-right:7px solid transparent; border-left:7px solid transparent; }
.box.balloon:before { content:''; position:absolute; bottom:-14px; left:49%; border-top:14px solid #c7cad3; border-right:7px solid transparent; border-left:7px solid transparent; }
.box.balloon.error:before { border-top-color:#ee0000; }
.box.balloon.left-side:after { left:40px; }
.box.balloon.left-side:before { left:40px; }
/* tip */
.box.tip { position:relative; margin-bottom:7px; padding:1px 0 0 0; border-radius:4px; color:#666666; font-size:11px; font-weight:bold; line-height:19px; text-align:center; vertical-align:bottom; }
.box.tip:after { content:''; position:absolute; z-index:2; bottom:-6px; left:49%; border-top:8px solid #ffffff; border-right:4px solid transparent; border-left:4px solid transparent; }
.box.tip:before { content:''; position:absolute; z-index:1;  bottom:-8px; left:49%; border-top:8px solid #c7cad3; border-right:4px solid transparent; border-left:4px solid transparent; }
.box.tip.error:before { border-top-color:#ee0000; }
/* banner */
.box.banner {}
.box.banner:hover { opacity:0.75; }
.box.banner img { width:100%; }
/* box parts */
.box .box-inner.border-bottom { border-bottom:1px solid #e1e1e1; }
.box .box-inner.border-bottom.dotted { border-bottom:1px dotted #e1e1e1; }
.box .box-inner.border-top { border-top:1px solid #e1e1e1; }
.box .box-inner.border-top.dotted { border-top:1px dotted #e1e1e1; }
.box .box-inner.bg-gray { background:#fcfcfc; }
.box .box-inner.bg-darkgray { background:#f9f9f9;}
.box dl.box-inner.with-thumb { display:table; width:100%; }
.box dl.box-inner.with-thumb > dt { display:table-cell; width:102px; height:102px; text-align:left; vertical-align:top; }
.box dl.box-inner.with-thumb > dt img.thumb { width:102px; height:102px; }
.box dl.box-inner.with-thumb > dd { display:table-cell; text-align:left; vertical-align:top; }
.box dl.box-inner.with-thumb > dd.min { width:1%; white-space:nowrap; }
.box dl.box-inner.with-thumb.large > dt { width:152px; height:152px; }
.box dl.box-inner.with-thumb.large > dt img.thumb { width:152px; height:152px; }
.box dl.box-inner.with-thumb.half > dt { width:72px; height:72px; }
.box dl.box-inner.with-thumb.half > dt img.thumb { width:72px; height:72px; }
.box dl.box-inner.with-thumb.micro > dt { width:50px; height:50px; }
.box dl.box-inner.with-thumb.micro > dt img.thumb { width:50px; height:50px; }
.box dl.box-inner.with-thumb.xmicro > dt { width:30px; height:30px; }
.box dl.box-inner.with-thumb.xmicro > dt img.thumb { width:30px; height:30px; }
.box .box-inner.title { border-bottom:1px solid #e1e1e1; padding:10px 20px 7px 20px; vertical-align:middle; }
.box .box-inner.title h1 { color:#404040; font-size:16px; line-height:44px; vertical-align:middle; }
.box .box-inner.title h2 { color:#404040; font-size:16px; line-height:44px; vertical-align:middle; }


/**** thumb,points,star,voice, etc ****/
.thumb { border:1px solid #c7cad3; background-color:#f9f9f9; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
.thumb.hover:hover { opacity:0.75; }
.points { display:inline-block; display:inline-block; padding:2px 3px 0 3px; font-size:11px; font-weight:normal; line-height:15px; vertical-align:middle; color:#d94d38; background:transparent; border:1px solid #d94d38; border-radius:2px; }
.points > em { font-size:9px; vertical-align:baseline; margin-left:1px; }
.points.bluegray { border-color:#858da3; color:#858da3; }
.points.disabled { border-color:#858da3; color:#858da3; opacity:0.7; }
.star { color:#d94d38; }
.voice { display:inline; width:18px; height:18px; border-radius:9px; background:#111122; opacity:0.3; color:#ffffff; font-size:10px; line-height:18px; text-align:center; vertical-align:middle; box-shadow:0 0 2px 1px rgba(255,255,255,0.5); cursor:pointer; }
.voice:hover,.voice.active { background-color:#ed5cb7; color:#ffffff; opacity:1.0; }
.voice:before { display:inline; content:"\e715"; font-family:"icon"; }
.voice.active:before { display:inline; content:"\e718"; font-family:"icon"; }
.number-circle { display:inline-block; margin:0 3px 0 0; background-color:#d0d2d9; color:#ffffff; font-weight:bold; font-size:12px; width:22px; height:22px; line-height:22px; border-radius:11px; text-align:center; vertical-align:middle; }
.flag-dummy { display:inline-block; width:12px; height:12px; vertical-align:middle; }
/* btns */
ul.btns.sheet { padding:10px; background:#f9f9f9 url("../images/common/bg.dotted.png") top left repeat; border-top:1px solid #c7cad3; text-align:center; }
ul.btns.sheet.border-light { border-color:#e1e1e1 !important; }
ul.btns.sheet.with-form { border-top:none; }
ul.btns.sheet.border-bottom { border-bottom:1px solid #c7cad3; }
ul.btns.sheet > li { display:inline; vertical-align:middle; }
ul.btns.sheet > li + li { margin-left:4px; }

ul.btns.menu { margin:0 6px 0 0; }
ul.btns.menu > li { display:inline-block; width:50%; }
ul.btns.menu > li > a { display:block; margin:0 0 6px 6px; background:#ffffff; color:#333333; border:1px solid #c7cad3; border-radius:4px; padding:8px 8px 7px 8px; }
ul.btns.menu > li.active > a { background:#3cb6e3; border-color:#1fa9db; color:#ffffff; }

ul.btns.menu3 { margin:0 4px 0 0; }
ul.btns.menu3 > li { display:inline-block; width:33%; }
ul.btns.menu3 > li > a { display:block; margin:0 0 6px 6px; background:#ffffff; color:#333333; border:1px solid #c7cad3; border-radius:4px; padding:8px 8px 7px 8px; }
ul.btns.menu3 > li.active > a { background:#3cb6e3; border-color:#1fa9db; color:#ffffff; }


/* etc */
dl.ticket-counts { display:inline-block; min-width:90px; border:1px solid #c7cad3; background:transparent; }
dl.ticket-counts > dt { line-height:28px; padding:0 8px 0 8px; text-align:center; vertical-align:middle; border-bottom:1px solid #c7cad3; white-space:nowrap; }
dl.ticket-counts > dd { line-height:47px; padding:0 8px 0 8px; text-align:center; vertical-align:bottom; white-space:nowrap; }
dl.ticket-counts + dl.ticket-counts { border-left:none; }
dl.flush-detail { margin:0 0 12px 0; }
dl.flush-detail > dt { display:block; padding:0 0 6px 0; }
dl.flush-detail > dd { display:block; padding:0 0 0 0; }
dl.table { display:table; }
dl.table > dt, dl.table > dd { display:table-cell; }
div.divider { height:1px; padding:0; border-bottom:1px solid #fcfcfc; color:#fcfcfc; position:relative; }
div.divider:after { content:""; display:block; width:100%; position:absolute; bottom:0; left:0; border-bottom:1px solid #dddddd; }

/**** list ****/
ul.inline { display:block !important; }
ul.inline > li { display:inline; }
ul.notes {}
ul.notes > li { padding:0 0 0 14px; vertical-align:top; position:relative; }
ul.notes > li + li { margin-top:4px; }
ul.notes > li:before { display:inline-block; content:"\e8c0"; font-family:"icon"; width:16px; text-align:left; position:absolute; top:0; left:0; opacity:0.5; }
table.history { width:100%; border-collapse:collapse; }
table.history > thead > tr > th { padding:8px; border-bottom:1px solid #c7cad3; text-align:left; vertical-align:middle; }
table.history > tbody > tr > td { padding:8px; border-bottom:1px solid #c7cad3; text-align:left; vertical-align:middle; }
table.history > tbody > tr > td.min { width:1%; white-space:nowrap; }
table.history > tbody > tr.hover:hover > td { background:#fcfcfc; }
.memo { font-size:12px; line-height:17px; padding:0 0 0 16px; position:relative; }
.memo:after { content:"\e8c0"; display:inline-block; font-family:"icon"; font-size:12px; color:#aaaaaa; position:absolute; top:0; left:0; }
ul.list { border-top:1px solid #e1e1e1; background:#ffffff; }
ul.list > li { display:block; border-bottom:1px solid #e1e1e1; }
ul.list > li.next { padding-right:20px; position:relative; }
ul.list > li.next:after { content:"\e8cb"; font-family:"icon"; color:#dddddd; font-size:13px; display:table-cell; width:20px; height:100%; text-align:left; position:absolute; top:35%; right:0; }
ul.list.bg-darkgray { background:#f3f3f3; }


/**** button ****/
.btn { display:inline-block; margin:0; padding:0 8px 0 8px; font-size:13px; font-weight:normal; line-height:1; cursor:pointer; outline:0; text-decoration:none; text-align:center; vertical-align:middle; white-space:nowrap; overflow:hidden; border-radius:5px; position:relative; -moz-appearance:none; -webkit-appearance:none; appearance:none; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
.btn:hover { text-decoration:none; }
.btn { font-size:13px; line-height:30px; }
.btn.fill { width:100%; }
.btn.small { font-size:12px; line-height:26px; }
.btn.xsmall { font-size:11px; line-height:22px; }
.btn.disabled { cursor:default; opacity:0.5; }
.btn.prev { padding-left:20px; }
.btn.prev:after { content:"\e8c8"; font-family:"icon"; position:absolute; top:0; left:0; opacity:0.75; height:100%; vertical-align:middle; padding:0 10px 0 10px; border-right:1px solid #cccccc; box-shadow:rgba(255,255,255,0.3) -1px 0 0 0 inset; -webkit-box-shadow:rgba(255,255,255,0.3) -1px 0 0 0 inset; -moz-box-shadow:rgba(255,255,255,0.3) -1px 0 0 0 inset; }
.btn.next { padding-right:20px; }
.btn.next:after { content:"\e8cb"; font-family:"icon"; position:absolute; top:0; right:0; opacity:0.75; height:100%; vertical-align:middle; padding:0 10px 0 10px; border-left:1px solid #cccccc; box-shadow:rgba(255,255,255,0.3) 1px 0 0 0 inset; -webkit-box-shadow:rgba(255,255,255,0.3) 1px 0 0 0 inset; -moz-box-shadow:rgba(255,255,255,0.3) 1px 0 0 0 inset; }
.btn.blue.prev:after,.btn.blue.next:after { border-color:#1f98c6; }
.btn.red.prev:after,.btn.red.next:after { border-color:#bd2b83; }
.btn.orange.prev:after,.btn.orange.next:after { border-color:#d94d38; }
.btn.gray.prev:after,.btn.gray.next:after { border-color:#c7cad3; }
.btn.white.prev:after,.btn.white.next:after { border-color:#aeb3bf; }
.btn.facebook.prev:after,.btn.facebook.next:after { border-color:#3c47a1; }
.btn.twitter.prev:after,.btn.twitter.next:after { border-color:#008BE8; }
.btn.googleplus.prev:after,.btn.googleplus.next:after { border-color:#9a2f29; }
.btn > [class^="icon-"]:before { color:#ffffff; }
.btn.blue,.btn.blue.disabled,.btn.blue.disabled:hover {
    color:#ffffff; border:1px solid #1f98c6;
    background:#3cb6e3;
    background:-moz-linear-gradient(top,#3cb6e3 0%,#1fa9db 30%,#1c97c6 100%);
    background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#3cb6e3),color-stop(30%,#1fa9db),color-stop(100%,#1c97c6));
    background:-webkit-linear-gradient(top,#3cb6e3 0%,#1fa9db 30%,#1c97c6 100%);
    background:-o-linear-gradient(top,#3cb6e3 0%,#1fa9db 30%,#1c97c6 100%);
    background:-ms-linear-gradient(top,#3cb6e3 0%,#1fa9db 30%,#1c97c6 100%);
    background:linear-gradient(to bottom,#3cb6e3 0%,#1fa9db 30%,#1c97c6 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#3cb6e3',endColorstr='#1c97c6',GradientType=0);
    box-shadow:rgba(255,255,255,0.2) 0px 0px 1px 1px inset;
    -webkit-box-shadow:rgba(255,255,255,0.2) 0px 0px 1px 1px inset;
    -moz-box-shadow:rgba(255,255,255,0.2) 0px 0px 1px 1px inset;
}
.btn.blue:hover {
    background:#2dafe1;
    background:-moz-linear-gradient(top,#2dafe1 0%,#1fa9db 30%,#1c97c6 100%);
    background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#2dafe1),color-stop(30%,#1fa9db),color-stop(100%,#1c97c6));
    background:-webkit-linear-gradient(top,#2dafe1 0%,#1fa9db 30%,#1c97c6 100%);
    background:-o-linear-gradient(top,#2dafe1 0%,#1fa9db 30%,#1c97c6 100%);
    background:-ms-linear-gradient(top,#2dafe1 0%,#1fa9db 30%,#1c97c6 100%);
    background:linear-gradient(to bottom,#2dafe1 0%,#1fa9db 30%,#1c97c6 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#2dafe1',endColorstr='#1c97c6',GradientType=0);
    box-shadow:none; -webkit-box-shadow:none; -moz-box-shadow:none;
}
.btn.red,.btn.red.disabled,.btn.red.disabled:hover {
    color:#ffffff; border:1px solid #bd2b83;
    background:#ed5cb7;
    background:-moz-linear-gradient(top,#ed5cb7 0%,#cc2d98 100%);
    background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#ed5cb7),color-stop(100%,#cc2d98));
    background:-webkit-linear-gradient(top,#ed5cb7 0%,#cc2d98 100%);
    background:-o-linear-gradient(top,#ed5cb7 0%,#cc2d98 100%);
    background:-ms-linear-gradient(top,#ed5cb7 0%,#cc2d98 100%);
    background:linear-gradient(to bottom,#ed5cb7 0%,#cc2d98 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ed5cb7',endColorstr='#cc2d98',GradientType=0 );
    box-shadow:rgba(255,255,255,0.2) 0px 0px 1px 1px inset;
    -webkit-box-shadow:rgba(255,255,255,0.2) 0px 0px 1px 1px inset;
    -moz-box-shadow:rgba(255,255,255,0.2) 0px 0px 1px 1px inset;
}
.btn.red:hover {
    background:#ec55b4;
    background:-moz-linear-gradient(top,#ec55b4 0%,#bf2b8f 100%);
    background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#ec55b4),color-stop(100%,#bf2b8f));
    background:-webkit-linear-gradient(top,#ec55b4 0%,#bf2b8f 100%);
    background:-o-linear-gradient(top,#ec55b4 0%,#bf2b8f 100%);
    background:-ms-linear-gradient(top,#ec55b4 0%,#bf2b8f 100%);
    background:linear-gradient(to bottom,#ec55b4 0%,#bf2b8f 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ec55b4',endColorstr='#bf2b8f',GradientType=0 );
    box-shadow:none; -webkit-box-shadow:none; -moz-box-shadow:none;
}
.btn.orange,.btn.orange.disabled,.btn.orange.disabled:hover {
    color:#ffffff; border:1px solid #d94d38;
    background: #d87568;
    background: -moz-linear-gradient(top,  #d87568 0%, #d94d38 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d87568), color-stop(100%,#d94d38));
    background: -webkit-linear-gradient(top,  #d87568 0%,#d94d38 100%);
    background: -o-linear-gradient(top,  #d87568 0%,#d94d38 100%);
    background: -ms-linear-gradient(top,  #d87568 0%,#d94d38 100%);
    background: linear-gradient(to bottom,  #d87568 0%,#d94d38 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d87568', endColorstr='#d94d38',GradientType=0 );
    box-shadow:rgba(255,255,255,0.2) 0px 0px 1px 1px inset;
    -webkit-box-shadow:rgba(255,255,255,0.2) 0px 0px 1px 1px inset;
    -moz-box-shadow:rgba(255,255,255,0.2) 0px 0px 1px 1px inset;
}
.btn.orange:hover {
    background: #d6685c;
    background: -moz-linear-gradient(top,  #d6685c 0%, #d94d38 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d6685c), color-stop(100%,#d94d38));
    background: -webkit-linear-gradient(top,  #d6685c 0%,#d94d38 100%);
    background: -o-linear-gradient(top,  #d6685c 0%,#d94d38 100%);
    background: -ms-linear-gradient(top,  #d6685c 0%,#d94d38 100%);
    background: linear-gradient(to bottom,  #d6685c 0%,#d94d38 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d6685c', endColorstr='#d94d38',GradientType=0 );
    box-shadow:none; -webkit-box-shadow:none; -moz-box-shadow:none;
}
.btn.gray,.btn.gray.disabled,.btn.gray.disabled:hover { color:#868c9f; border:1px solid #c7cad3; background:#e9eaed; box-shadow:rgba(255,255,255,0.5) 0px 0px 1px 1px inset; -webkit-box-shadow:rgba(255,255,255,0.5) 0px 0px 1px 1px inset; -moz-box-shadow:rgba(255,255,255,0.5) 0px 0px 1px 1px inset; }
.btn.gray:hover { background:#e4e6e9; box-shadow:none; -webkit-box-shadow:none; -moz-box-shadow:none; }
.btn.gray > [class^="icon-"]:before { color:#868c9f; }
.btn.white,.btn.white.disabled,.btn.white.disabled:hover { color:#444444; border:1px solid #aeb3bf; background:#ffffff; }
.btn.white:hover { color:#555555; background:#f6f6f6; }
.btn.white > [class^="icon-"]:before { color:#444444; }
.btn.facebook,.btn.facebook.disabled,.btn.facebook.disabled:hover {
    color:#ffffff; border:1px solid #3c47a1;
    background:#5887d3;
    background:-moz-linear-gradient(top,#5887d3 0%,#3c72cc 100%);
    background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#5887d3),color-stop(100%,#3c72cc));
    background:-webkit-linear-gradient(top,#5887d3 0%,#3c72cc 100%);
    background:-o-linear-gradient(top,#5887d3 0%,#3c72cc 100%);
    background:-ms-linear-gradient(top,#5887d3 0%,#3c72cc 100%);
    background:linear-gradient(to bottom,#5887d3 0%,#3c72cc 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#5887d3',endColorstr='#3c72cc',GradientType=0 );
    box-shadow:rgba(255,255,255,0.3) 0px 0px 1px 1px inset;
    -webkit-box-shadow:rgba(255,255,255,0.3) 0px 0px 1px 1px inset;
    -moz-box-shadow:rgba(255,255,255,0.3) 0px 0px 1px 1px inset;
}

.btn.facebook:hover { box-shadow:none; -webkit-box-shadow:none; -moz-box-shadow:none; }
.btn.facebook > [class^="icon-"] { margin-right:3px; }
.btn.googleplus,.btn.googleplus.disabled,.btn.googleplus.disabled:hover {
    color:#ffffff; border:1px solid #9a2f29;
    background:#d65656;
    background:-moz-linear-gradient(top,#d65656 0%,#d65656 100%);
    background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#d65656),color-stop(100%,#d65656));
    background:-webkit-linear-gradient(top,#d65656 0%,#d65656 100%);
    background:-o-linear-gradient(top,#d65656 0%,#d65656 100%);
    background:-ms-linear-gradient(top,#d65656 0%,#d65656 100%);
    background:linear-gradient(to bottom,#d65656 0%,#d65656 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#d65656',endColorstr='#d65656',GradientType=0 );
    box-shadow:rgba(255,255,255,0.3) 0px 0px 1px 1px inset;
    -webkit-box-shadow:rgba(255,255,255,0.3) 0px 0px 1px 1px inset;
    -moz-box-shadow:rgba(255,255,255,0.3) 0px 0px 1px 1px inset;
}
.btn.googleplus:hover { box-shadow:none; -webkit-box-shadow:none; -moz-box-shadow:none; }
.btn.googleplus > [class^="icon-"] { margin-right:3px; }
.btn.googleplus > .icon-googleplus:before { content:"\e764"; }
.btn.twitter,.btn.twitter.disabled,.btn.twitter.disabled:hover {
    color:#ffffff; border:1px solid #008BE8;
    background:#55acee;
    background:-moz-linear-gradient(top,#55acee 0%,#289bed 100%);
    background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#55acee),color-stop(100%,#289bed));
    background:-webkit-linear-gradient(top,#55acee 0%,#289bed 100%);
    background:-o-linear-gradient(top,#55acee 0%,#289bed 100%);
    background:-ms-linear-gradient(top,#55acee 0%,#289bed 100%);
    background:linear-gradient(to bottom,#55acee 0%,#289bed 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#55acee',endColorstr='#289bed',GradientType=0 );
    box-shadow:rgba(255,255,255,0.3) 0px 0px 1px 1px inset;
    -webkit-box-shadow:rgba(255,255,255,0.3) 0px 0px 1px 1px inset;
    -moz-box-shadow:rgba(255,255,255,0.3) 0px 0px 1px 1px inset;
}
.btn.darkblue {
    color: #ffffff;
    border: 1px solid #2A7BFB;
    background: #2A7BFB;
}
.btn.twitter:hover { box-shadow:none; -webkit-box-shadow:none; -moz-box-shadow:none; }
.btn.twitter > [class^="icon-"] { margin-right:3px; }
.btn.twitter > .icon-twitter:before { content:"\e76d"; }

/**** pager,selector ****/
ul.pager { display:inline-block; letter-spacing:-.30em; height:28px; line-height:28px; vertical-align:middle; }
ul.pager > li { display:inline-block; letter-spacing:normal; width:28px; height:28px; margin:0 2px 0 0; padding:0; }
ul.pager > li > a:hover { background:#f5f5f5; }
ul.pager > li > a, ul.pager > li > span,
ul.pager > li.disabled > a, ul.pager > li.disabled > a:hover {
    display:inline-block; width:28px; height:28px; font-size:11px; font-weight:normal; line-height:28px; cursor:pointer; outline:0; text-decoration:none; text-align:center; vertical-align:middle; white-space:nowrap; overflow:hidden; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;
    color:#333333; border:1px #dadada solid;
    background:#ffffff;
    background:-moz-linear-gradient(top,#ffffff 0%,#ffffff 50%,#f5f5f5 51%,#f5f5f5 100%);
    background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#ffffff),color-stop(50%,#ffffff),color-stop(51%,#f5f5f5),color-stop(100%,#f5f5f5));
    background:-webkit-linear-gradient(top,#ffffff 0%,#ffffff 50%,#f5f5f5 51%,#f5f5f5 100%);
    background:-o-linear-gradient(top,#ffffff 0%,#ffffff 50%,#f5f5f5 51%,#f5f5f5 100%);
    background:-ms-linear-gradient(top,#ffffff 0%,#ffffff 50%,#f5f5f5 51%,#f5f5f5 100%);
    background:linear-gradient(to bottom,#ffffff 0%,#ffffff 50%,#f5f5f5 51%,#f5f5f5 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff',endColorstr='#f5f5f5',GradientType=0 );
}
ul.pager > li.disabled > a, ul.pager > li.disabled > a:hover, ul.pager > li.disabled > span { color:#999999; cursor:default; }
ul.pager > li.divider > a, ul.pager > li > span { cursor:default; }
ul.pager > li.current > span {
    text-decoration:none; color:#ffffff; border:1px #404040 solid;
    background:#6e6e6e;
    background:-moz-linear-gradient(top,#6e6e6e 0%,#3d3d3d 100%);
    background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#6e6e6e),color-stop(100%,#3d3d3d));
    background:-webkit-linear-gradient(top,#6e6e6e 0%,#3d3d3d 100%);
    background:-o-linear-gradient(top,#6e6e6e 0%,#3d3d3d 100%);
    background:-ms-linear-gradient(top,#6e6e6e 0%,#3d3d3d 100%);
    background:linear-gradient(to bottom,#6e6e6e 0%,#3d3d3d 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#6e6e6e',endColorstr='#3d3d3d',GradientType=0 );
}
ul.pager > li > a > em, ul.pager > li > span > em { display:inline-block; width:100%; text-align:center; vertical-align:center; transform:scale(0.9,1); -moz-transform:scale(0.9,1); -webkit-transform:scale(0.9,1); -ms-transform:scale(0.9,1); }
ul.selector { display:table; height:28px; line-height:28px; vertical-align:middle; }
ul.selector > li { display:table-cell; height:28px; text-align:left; vertical-align:middle; white-space:nowrap; }
ul.selector > li > a, ul.selector > li > span { display:block; height:28px; padding:0 8px 0 8px; color:#000000; background:#ffffff; border:1px #dadada solid; border-left:none; font-size:11px; font-weight:normal; line-height:28px; cursor:pointer; outline:0; text-decoration:none; text-align:center; vertical-align:middle; white-space:nowrap; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
ul.selector > li:first-child > span { border-left:1px #dadada solid; position:relative; padding:0 5px 0 8px; overflow:visible; }
ul.selector > li:first-child > span:before { content:''; position:absolute; top:0; right:-15px; border-top:13px solid transparent; border-bottom:13px solid transparent; border-left:7px solid #dadada; border-right:7px solid transparent; }
ul.selector > li:first-child > span:after { content:''; position:absolute; top:0; right:-14px; border-top:13px solid transparent; border-bottom:13px solid transparent; border-left:7px solid #ffffff; border-right:7px solid transparent; }
ul.selector > li:first-child+li > a { padding-left:15px; }
ul.selector > li > a:hover { background:#f5f5f5; }
ul.selector > li.active > a,ul.selector > li.active > a:hover { background:#ffffff; color:#cc2d98; cursor:default; }
ul.selector > li.disabled > a { color:#aaaaaa; cursor:default; }
ul.selector > li.disabled > a:hover { background:#ffffff; }


/**** pars > banners ****/
.banners-right-progress { height:80px; position:relative; }
.banners-right-progress .indicator { position:absolute; top:40px; left:50%; }
.banners-footer-progress { height:85px; margin:0 0 20px 0; position:relative; }
.banners-footer-progress .indicator { position:absolute; top:35px; left:50%; }


/**** dialog ****/
.page-dialog-preview { background-color:#555555; padding:40px; }
.page-dialog-preview > .dialog { margin:0 auto 0 auto; }
.dialog { position:fixed; background:#ffffff; border-radius:5px; box-shadow:0 0 2px 2px rgba(0,0,0,0.2); -moz-box-shadow:0 0 2px 2px rgba(0,0,0,0.2); -webkit-box-shadow:0 0 2px 2px rgba(0,0,0,0.2); }
.dialog > .close { position:absolute; top:-7px; right:-7px; z-index:10; width:18px; height:18px; border-radius:9px; background:#565656; box-shadow:0 0 0 2px rgba(255,255,255,1),0 0 2px 2px rgba(0,0,0,0.2); -moz-box-shadow:0 0 0 2px rgba(255,255,255,1),0 0 2px 2px rgba(0,0,0,0.2); -webkit-box-shadow:0 0 0 2px rgba(255,255,255,1),0 0 2px 2px rgba(0,0,0,0.2); }
.dialog > .close:before { content:"\e6fd"; font-family:"icon"; display:block; position:absolute; top:0; left:0; width:18px; height:18px; line-height:18px; font-size:10px; color:#ffffff; text-align:center; vertical-align:middle; }
.dialog > .close:hover { background:#777777; }
.dialog > .header { position:absolute; top:0; left:0; z-index:0; border-bottom:1px solid #e1e1e1; background:#ffffff; width:100%; height:55px;line-height:55px; color:#333333; text-align:center; vertical-align:middle; border-radius:5px 5px 0 0; }
.dialog > .header:after { content:""; display:block; position:absolute; bottom:1px; left:0; z-index:0; width:100%; height:27px;
    background:#ffffff;
    background:-moz-linear-gradient(top,#ffffff 2%,#f2f2f2 99%);
    background:-webkit-gradient(linear,left top,left bottom,color-stop(2%,#f2f2f2),color-stop(99%,#f2f2f2));
    background:-webkit-linear-gradient(top,#ffffff 2%,#f2f2f2 99%);
    background:-o-linear-gradient(top,#ffffff 2%,#f2f2f2 99%);
    background:-ms-linear-gradient(top,#ffffff 2%,#f2f2f2 99%);
    background:linear-gradient(to bottom,#ffffff 2%,#f2f2f2 99%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',endColorstr='#f2f2f2',GradientType=0);
}
.dialog > .header > strong { position:relative; z-index:1; font-weight:bold; font-size:16px; }
.dialog > .footer { position:absolute; bottom:0; left:0; z-index:0; border-top:1px solid #e1e1e1; background-color:#f9f9f9; width:100%; height:55px;line-height:55px; color:#333333; text-align:center; vertical-align:middle; border-radius:0 0 5px 5px; }
.dialog > .content { position:absolute; top:0; left:0; padding:55px 0 55px 0; width:100%; height:100%; overflow:hidden; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
.dialog > .content > .inner { padding:20px; width:100%; height:100%; overflow-x:hidden; overflow-y:auto; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
.dialog > .inbox-error { position:absolute; top:0; left:0; width:100%; height:100%; text-align:center; background:rgba(0,0,0,0.2); }
.dialog > .inbox-error > .inner { display:inline-block; width:320px; background:#ffffff; color:#d94d38; padding:20px 30px 20px 30px; border:1px solid #d94d38; border-radius:4px; position:absolute; top:50%; left:50%; }
.dialog > .inbox-error > .inner > strong { display:block; font-weight:bold; }
.dialog > .inbox-error > .inner > div { font-size:11px; margin-top:4px; }
.dialog > .inbox-error > .inner > .close { cursor:pointer; position:absolute; top:-7px; right:-7px; width:18px; height:18px; border-radius:9px; background:#d94d38; box-shadow:0 0 0 2px rgba(255,255,255,1),0 0 2px 2px rgba(0,0,0,0.2); -moz-box-shadow:0 0 0 2px rgba(255,255,255,1),0 0 2px 2px rgba(0,0,0,0.2); -webkit-box-shadow:0 0 0 2px rgba(255,255,255,1),0 0 2px 2px rgba(0,0,0,0.2); }
.dialog > .inbox-error > .inner > .close:before { content:"\e6fd"; font-family:"icon"; display:block; position:absolute; top:0; left:0; width:18px; height:18px; line-height:18px; font-size:10px; color:#ffffff; text-align:center; vertical-align:middle; }
/* black face */
.dialog.black { background-color:#f2f2f2; }
.dialog.black > .header { color:#ffffff; background:#6e6e6e; }
.dialog.black > .header:after {
    height:36px;
    background:#6e6e6e;
    background:-moz-linear-gradient(top,#6e6e6e 0%,#3d3d3d 100%);
    background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#6e6e6e),color-stop(100%,#3d3d3d));
    background:-webkit-linear-gradient(top,#6e6e6e 0%,#3d3d3d 100%);
    background:-o-linear-gradient(top,#6e6e6e 0%,#3d3d3d 100%);
    background:-ms-linear-gradient(top,#6e6e6e 0%,#3d3d3d 100%);
    background:linear-gradient(to bottom,#6e6e6e 0%,#3d3d3d 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#6e6e6e',endColorstr='#3d3d3d',GradientType=0 );
}
/* for confirm dialog */
.dialog.confirm > .header { height:30px; line-height:30px; }
.dialog.confirm > .header:after { height:15px; }
.dialog.confirm > .content { padding-top:40px; }
/* common parts */
.dialog ul.help {}
.dialog ul.help > li { margin:0 0 8px 0; font-size:11px; }

/**** parts > articlebox ****/
.articlebox > .title > h1 { font-size:17px; font-weight:bold; line-height: 30px;}
.articlebox  .content { font-size:14px; line-height:1.7; }
.articlebox  .content strong { font-weight: bold !important; }
.articlebox  .content em { font-style: italic !important; }
.articlebox  .content em strong span {
    font-style: italic !important;
}
.articlebox  .content em span strong {
    font-style: italic !important;
}
.articlebox  .content em strong  {
    font-style: italic !important;
}
.articlebox  .content em span  {
    font-style: italic !important;
}
.articlebox  .content em p,.articlebox > .content em div  {
    font-style: italic !important;
}
.articlebox  .content p { margin:14px 0; }
.articlebox  .content img { max-width:100%; height:auto; }

/**** parts > ranking ****/
.learnRanking{padding-bottom:10px;background-color:#fff;text-align:left;vertical-align:top;border:1px solid #c7cad3;background:#ffffff url("") top right no-repeat;box-shadow:rgba(255, 255, 255, 1) 0px 0px 0px 1px inset;-webkit-box-shadow:rgba(255, 255, 255, 1) 0px 0px 0px 1px inset;-moz-box-shadow:rgba(255, 255, 255, 1) 0px 0px 0px 1px inset;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
.learnRanking>h2.heading{color:#333;font-size:13px;font-weight:bold;line-height:16px; vertical-align:middle;border-bottom:1px solid #c7cad3;}
.learnRanking .point{text-align:left;line-height:18px;margin:0 0px 0 10px;padding-top:1px;padding-right:50px;font-size:12px;vertical-align:baseline;color:#333}
.learnRanking .point p{margin-top:8px;}
.learnRanking .point p:last-child{margin-top:5px;}
.learnRanking .point strong{font-size:25px;font-weight:bold;vertical-align:baseline;margin-right:2px;color:#000;line-height:28px;}
.learnRanking .more{position:absolute;right:0;width:60px;top:40%;}
.learnRanking .more img{width:40px;}

/**** parts > ranking box ****/
.rankBox{margin:30px auto;border-image: initial;overflow: hidden;}
.rankBox .hd{overflow:hidden;background: #ffffff;background: -moz-linear-gradient(top, #ffffff 0%, #f2f2f2 100%);background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #f2f2f2));background: -webkit-linear-gradient(top, #ffffff 0%, #f2f2f2 100%);background: -o-linear-gradient(top, #ffffff 0%, #f2f2f2 100%);background: -ms-linear-gradient(top, #ffffff 0%, #f2f2f2 100%);background: linear-gradient(to bottom, #ffffff 0%, #f2f2f2 100%);filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f2f2f2', GradientType=0);}
.rankBox .hd li{position:relative;margin-left:-1px;height:37px;cursor:pointer;line-height:37px;text-align:center;width:50%;float:left;border:1px solid #ddd;border-top:0;border-right:none;_font-weight:bold;color: rgb(164, 164, 164);}
.rankBox .hd li:first-child{width:50%;}
.rankBox .hd li.on{background:#fff;border-bottom:1px solid #fff;color: rgb(64, 64, 64);border-top: 2px solid rgb(64, 64, 64);}
.rankBox .bd{border-top:0;}
.rankBox .lh{overflow:hidden;}
.rankBox .lh li{padding:0 10px;}
.rankBox .lh li .p-img{width:130px;height:132px;padding:30px 13px 0 13px;margin:0 auto;text-align:center;}
.rankBox .lh li .p-name{height:36px;line-height:18px;word-break:break-all;word-wrap:break-word;overflow:hidden;}
.rankBox .lh li .p-price{color:#999;}
.rankBox .lh li .p-price strong{color:#c00;font-size:14px;}
.rankBox .point{text-align:left;line-height:18px;margin:0 0px 0 10px;padding-top:1px;font-size:12px;vertical-align:baseline;color:#333}
.tab-group .tab_content.active {
  height: auto;
  overflow: visible;
}
.tab-group .tab_content {
  height: 0;
  padding: 0 0;
  margin-top:10px;
  overflow: hidden;
  transition: opacity 0.4s ease, height 0.4s ease;
}
.rankBox .lh li .tab_list li {
  display: inline;
  padding:0;
}
.rankBox .lh li .tab_list {
   margin: 0 10px;
   display: flex;
   justify-content: space-between;
}

.tab_list li a {
  color: rgb(68, 68, 68);
  border-width: 1px;
  border-style: solid;
  border-color: rgb(174, 179, 191);
  border-image: initial;
  background: rgb(255, 255, 255);
  display: inline-block;
  font-size: 12px;
  line-height: 26px;
  font-weight: normal;
  cursor: pointer;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
  position: relative;
  -webkit-appearance: none;
  box-sizing: border-box;
  margin: 0px;
  padding: 0px 5px;
  outline: 0px;
  text-decoration: none;
  overflow: hidden;
  border-radius: 5px;
  width:90px;
}
.tab_list li.active a {
  color: rgb(255, 255, 255);
  box-shadow: rgba(255, 255, 255, 0.2) 0px 0px 1px 1px inset;
  border-width: 1px;
  border-style: solid;
  border-color: rgb(189, 43, 131);
  border-image: initial;
  background: linear-gradient(rgb(237, 92, 183) 0%, rgb(204, 45, 152) 100%);
}
.rankBox .moreData {
    text-align:center;
}
.rankContent .searchbox .tabs li {width:361px;}
.tab_wrapper .content_wrapper .accordian_header {
    display:none;
}
.border-Top {border-top:1px solid #c7cad3}

dl.change_prefecture {border:none;}
.change_prefecture dl.form-field  { border-top:1px solid #e1e1e1;}
.change_prefecture dl.search-field > dd { padding-left:15px; }

.tabStyle span{padding-right:5px;}
.tabStyle span img {border:1px solid #c7cad3;width:40px;}
.tabStyle strong{padding-left:2px;}
.learnRanking .tabStyle .point p:last-child{margin-top:8px;}

.tabStyle span {font-size:14px; padding-right:2px;}

.searchbox .tab_content .box {border:none;}

.tabStyle .moreData {text-align:right;}
.tabStyle .moreData a {font-size:12px;line-height:26px;}

.prefecture_now {}
.prefecture_now .box {border: 1px solid #c7cad3 !important;}
.prefecture_now .box.balloon:before {content:none;}
.prefecture_now  .box.balloon:after {content: none;}
.area_content_text .description span {display:inline-block;}

.tabStyle .country_content p span {display: inline-block;line-height: 38px;}
.tabStyle .country_content p span:first-child {width:105px;}
/**** parts > search box ****/
.searchbox {
    position: relative;
}

.searchbox > ul.tabs {
    height: 47px;
    position: relative;
}

.searchbox > ul.tabs > li {
    display: block;
    width: 50%;
    height: 44px;
}


.searchbox > ul.tabs > li.country {
    position: absolute;
    top: 3px;
    left: 0px;
    z-index: 2;
}
.searchbox > ul.tabs > li.prefecture {
    position: absolute;
    top: 3px;
    left: 50%;
    z-index: 2;
}


.searchbox > ul.tabs > li > a {
    display: block;
    height: 44px;
    border: 1px solid #c7cad3;
    white-space: nowrap;
    overflow: hidden;
    color: #a4a4a4;
    cursor:pointer;
    font-size: 16px;
    line-height: 44px;
    text-align: center;
    vertical-align: middle;
    background: #ffffff;
    background: -moz-linear-gradient(top, #ffffff 0%, #f2f2f2 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #f2f2f2));
    background: -webkit-linear-gradient(top, #ffffff 0%, #f2f2f2 100%);
    background: -o-linear-gradient(top, #ffffff 0%, #f2f2f2 100%);
    background: -ms-linear-gradient(top, #ffffff 0%, #f2f2f2 100%);
    background: linear-gradient(to bottom, #ffffff 0%, #f2f2f2 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f2f2f2', GradientType=0);
}

.searchbox > ul.tabs > li > a:hover {
    color: #404040;
}



.searchbox > ul.tabs > li.active {
    height: 47px;
    position: absolute;
    top: 0;
}

.searchbox > ul.tabs > li.active > a {
    border-top: 2px solid #404040;
    border-bottom: none;
    height: 47px;
    color: #404040;
    background: #ffffff;
}

.searchbox > .content {
    background: #ffffff;
    border: 1px solid #c7cad3;
    border-top: none;
    padding: 12px 0 0 0;
}



/**** mark & tag ****/
.mark, .tag{ display:inline-block; padding:2px 3px 0 3px; font-size:11px; font-weight:normal; line-height:15px; vertical-align:middle; color:#333333; background:transparent; border:1px solid #333333; border-radius:2px; }
.mark.no-border{ border:none; }
.mark.black { border-color:#000000; color:#000000; }
.mark.blue { border-color:#418abb; color:#418abb; }
.mark.red { border-color:#ee0000; color:#ee0000; }
.mark.gray { border-color:#999999; color:#999999; }
.mark.lightgray { border-color:#bbbbbb; color:#bbbbbb; }
.mark.bluegray { border-color:#858da3; color:#858da3; }
.mark.blackgray { border-color:#555555; color:#555555; }
.mark.orange { border-color:#d94d38; color:#d94d38; }
.mark.green { border-color:#11aa11; color:#11aa11; }

.tag.black { border-color:#000000; background-color:#000000; color:#fff; }
.tag.blue { border-color:#418abb; background-color:#418abb; color:#fff; }
.tag.red { border-color:#ee0000; background-color:#ee0000; color:#fff; }
.tag.gray { border-color:#999999; background-color:#999999; color:#fff; }
.tag.orange { border-color:#d94d38; background-color:#d94d38; color:#fff; }
.tag.green { border-color:#11aa11; background-color:#11aa11; color:#fff; }


h1.heading-addtime {
    display: table;

}
h1.heading-addtime > span.titleleft{
    display: table-cell;
    width: 62%;
}
h1.heading-addtime > span.creatTime{
    display: table-cell;
}

.direction-title {
    display: flex;
    justify-content: space-between;
}
/*mobile listening*/
.listeningPage .box.with-tabs.with-tabs-3 > ul.tabs > li.progressBarBox { width:720px; left:0; z-index:1; }
.listeningPage .box.with-tabs > ul.tabs > li > .progressBarContainer {
    display:block; height:44px; border:1px solid #c7cad3; white-space:nowrap; overflow:hidden;
    color:#a4a4a4; font-size:16px; line-height:44px; vertical-align:middle;
    background:#ffffff;
    background:-moz-linear-gradient(top,#ffffff 0%,#f2f2f2 100%);
    background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#ffffff),color-stop(100%,#f2f2f2));
    background:-webkit-linear-gradient(top,#ffffff 0%,#f2f2f2 100%);
    background:-o-linear-gradient(top,#ffffff 0%,#f2f2f2 100%);
    background:-ms-linear-gradient(top,#ffffff 0%,#f2f2f2 100%);
    background:linear-gradient(to bottom,#ffffff 0%,#f2f2f2 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff',endColorstr='#f2f2f2',GradientType=0 );
}
#progressBar {
    width: 60%;
    height: 34px;
    position: relative;
    margin: auto;
    margin-top: 15px;
}
#progressBar div {
    width: 100%;
    height: 10px;
    position: absolute;
    top: 74%;
    left: 0;
    margin-top: -20px;
    background: #ccc;
}
#progressBar div span {
    position: absolute;
    display: inline-block;
    background: #1f98c6;
    height: 10px;
    width: 0%;
    -webkit-animation: bgLoad 5.5s linear;
}
#progressBar > span {
    position: absolute;
    top: 0;
    margin-top: -3px;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background: #ccc;
    margin-left: -20px;
    color: #fff;
    text-align: center;
    line-height: 25px;
}

#progressBar span:nth-child(2) {
    left: 0%;
    background: #1f98c6;
    -webkit-animation: circleLoad_2 3s ease-in;
}
#progressBar span:nth-child(3) {
    left: 50%;
    -webkit-animation: circleLoad_2 3s ease-in;
}

#progressBar span:nth-child(4) {
    left: 100%;
    -webkit-animation: circleLoad_4 6s ease-in;
}
.readingPage #progressBar div span {
    position: absolute;
    display: inline-block;
    background: #1f98c6;
    height: 10px;
    width: 50%;
    -webkit-animation: bgLoad 5.5s linear;
}
.readingPage #progressBar > span {
    position: absolute;
    top: 0;
    margin-top: -3px;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background: #ccc;
    margin-left: -20px;
    color: #fff;
    text-align: center;
    line-height: 25px;
}

.readingPage #progressBar span:nth-child(2) {
    left: 0%;
    background: #1f98c6;
    -webkit-animation: circleLoad_2 3s ease-in;
}
.readingPage #progressBar span:nth-child(3) {
    left: 50%;
    background: #1f98c6;
    -webkit-animation: circleLoad_2 3s ease-in;
}

.readingPage #progressBar span:nth-child(4) {
    left: 100%;
    /*background: green;*/
    -webkit-animation: circleLoad_4 6s ease-in;
}
.writingPage #progressBar div span {
    position: absolute;
    display: inline-block;
    background: #1f98c6;
    height: 10px;
    width: 100%;
    -webkit-animation: bgLoad 5.5s linear;
}
.writingPage #progressBar > span {
    position: absolute;
    top: 0;
    margin-top: -3px;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background: #ccc;
    margin-left: -20px;
    color: #fff;
    text-align: center;
    line-height: 25px;
}

.writingPage #progressBar span:nth-child(2) {
    left: 0%;
    background: #1f98c6;
    -webkit-animation: circleLoad_2 3s ease-in;
}
.writingPage #progressBar span:nth-child(3) {
    left: 50%;
    background: #1f98c6;
    -webkit-animation: circleLoad_2 3s ease-in;
}

.writingPage #progressBar span:nth-child(4) {
    left: 100%;
    background: #1f98c6;
    -webkit-animation: circleLoad_4 6s ease-in;
}
.text-indent{
    text-indent: 20px;
    text-align: justify;
}
.listeningPage .pink {
    color: #ed5cb7;
}
.listeningPage .textindent {
    text-align: justify;
    text-indent: 20px;
    border-bottom: 1px solid #c7cad3;
}
.box dl.box-inner2.with-thumb { display:block; width:100%; }
.box dl.box-inner2.with-thumb > dt { display:block; width:100%; height: auto; text-align:left; vertical-align:top; }
.box dl.box-inner2.with-thumb > dt img.thumb { width:100%; }
.box dl.box-inner2.with-thumb > dd { display:block; text-align:left; vertical-align:top; }
.box dl.box-inner2.with-thumb > dd.min { width:1%; white-space:nowrap; }
.box dl.box-inner2.with-thumb.large > dt { width:152px; height:152px; }
.box dl.box-inner2.with-thumb.large > dt img.thumb { width:152px; height:152px; }
.box dl.box-inner2.with-thumb.half > dt { width:72px; height:72px; }
.box dl.box-inner2.with-thumb.half > dt img.thumb { width:72px; height:72px; }
.box dl.box-inner2.with-thumb.micro > dt { width:50px; height:50px; }
.box dl.box-inner2.with-thumb.micro > dt img.thumb { width:50px; height:50px; }
.box dl.box-inner2.with-thumb.xmicro > dt { width:30px; height:30px; }
.box dl.box-inner2.with-thumb.xmicro > dt img.thumb { width:30px; height:30px; }

.listeningPage .listingRadio {
    margin: 0rem 0.5rem;
    width: 45px;
    display: inline-block;
}
.listeningPage .listingRadio input[type="radio"] {
    position: absolute;
    opacity: 0;
    height: 18px;
    line-height: 18px;
}
.listeningPage .listingRadio input[type="radio"] + .radio-label:before {
    content: '';
    background: #f4f4f4;
    border-radius: 100%;
    border: 1px solid #b4b4b4;
    display: inline-block;
    width: 1.2em;
    height: 1.2em;
    position: relative;
    top: -0.2em;
    margin-right: 1em;
    vertical-align: middle;
    cursor: pointer;
    text-align: center;
    -webkit-transition: all 250ms ease;
    transition: all 250ms ease;
}
.listeningPage .listingRadio input[type="radio"]:checked + .radio-label:before {
    background-color: #3197EE;
    box-shadow: inset 0 0 0 4px #f4f4f4;
}
.listeningPage .listingRadio input[type="radio"]:focus + .radio-label:before {
    outline: none;
    border-color: #3197EE;
}
.listeningPage .listingRadio input[type="radio"]:disabled + .radio-label:before {
    box-shadow: inset 0 0 0 4px #f4f4f4;
    border-color: #b4b4b4;
    background: #b4b4b4;
}
.listeningPage .listingRadio input[type="radio"] + .radio-label:empty:before {
    margin-right: 0;
}
.listeningPage .radio-label {
    line-height: 13px;
    vertical-align: top;
}
.listeningPage .radio-label {
    line-height: 13px;
    vertical-align: top;
}
.listeningPage .listingStart {
    position: relative;
    margin:10px auto;
    margin-bottom: 20px;
}
.listeningPage .listingStart img {
    background-color: #f9f9f9;
    width: 100%;
    height: 200px;
    box-sizing: border-box;
}
.listeningPage .listingStart .answerChoose{
    border: 1px solid #c7cad3;
    height: 32px;
    border-top: none;
    text-align: center;
    box-sizing: border-box;
}
.listeningPage .listingStart .listingRadio{
    width: 40px;
}
.listeningPage .box dl.box-inner.with-thumb > dt.listingPart2 {
    width: 50%;
}
.listeningPage .listingStart .examlist{
    position: absolute;
    top: 0;
    right: 0;
    height: 28px;
    width: 28px;
    /*line-height: 28px;*/
    text-align: right;
    padding-right: 6px;
    padding-top: 4px;
    box-sizing: border-box;
    color: #fff;
    background: url(../images/common/toprightbg.png) no-repeat center;
    background-size: 100%;

}
.listeningPage .nextReading {
    text-align: center;
}
.flush-detail2 {
    border-bottom: 1px solid #c7cad3;
}
.flush-detail2:last-child {
    border-bottom: none;
}
/*tanchuang*/
.modal-open{
    overflow:hidden
}
.modal{
    position:fixed;
    top:0;
    right:0;
    bottom:0;
    left:0;
    z-index:1050;
    display:none;
    overflow:hidden;
    -webkit-overflow-scrolling:touch;outline:0
}
.modal.fade .modal-dialog{
    -webkit-transition:-webkit-transform .3s ease-out;
    -o-transition:-o-transform .3s ease-out;
    transition:transform .3s ease-out;
    -webkit-transform:translate(0,-25%);
    -ms-transform:translate(0,-25%);
    -o-transform:translate(0,-25%);
    transform:translate(0,-25%)
}
.modal.in .modal-dialog{
    -webkit-transform:translate(0,0);
    -ms-transform:translate(0,0);
    -o-transform:translate(0,0);
    transform:translate(0,0)
}
.modal-open .modal{
    overflow-x:hidden;
    overflow-y:auto
}
.modal-dialog{
    position:relative;
    width:auto;
    margin:10px
}
.modal-content{
    position:relative;
    background-color:#fff;
    -webkit-background-clip:padding-box;
    background-clip:padding-box;
    border:1px solid #999;
    border:1px solid rgba(0,0,0,.2);
    border-radius:6px;outline:0;
    -webkit-box-shadow:0 3px 9px rgba(0,0,0,.5);
    box-shadow:0 3px 9px rgba(0,0,0,.5)
}
.modal-backdrop{
    position:fixed;
    top:0;
    right:0;
    bottom:0;
    left:0;
    z-index:1040;
    background-color:#000
}
.modal-backdrop.fade{
    filter:alpha(opacity=0);
    opacity:0
}
.modal-backdrop.in{
    filter:alpha(opacity=50);
    opacity:.5
}
.modal-header{
    padding:15px;
    border-bottom:1px solid #e5e5e5
}
.modal-title{
    margin:0;
    line-height:1.42857143
}
.modal-body{
    position:relative;
    padding:15px;
    text-align: center;
}
.modal-footer{
    padding:15px;
    text-align:right;
    border-top:1px solid #e5e5e5;
    text-align: center;
}
.modal-footer .btn+.btn{
    margin-bottom:0;
    margin-left:5px
}
.modal-footer .btn-group .btn+.btn{
    margin-left:-1px
}
.modal-footer .btn-block+.btn-block{
    margin-left:0
}
.modal-scrollbar-measure{
    position:absolute;
    top:-9999px;
    width:50px;
    height:50px;
    overflow:scroll
}
.modal-header .close-suit-modal {
    margin-top: -2px;
}

#notice_center_model .notice_icon {
    font-size:18px;
    color:#3cb6e3;
}
#notice_center_model .notice_title {
    font-size:18px;
}
.modal-footer .btn-block + .btn-block {
    margin-left: 0
}

.modal-scrollbar-measure {
    position: absolute;
    top: -9999px;
    width: 50px;
    height: 50px;
    overflow: scroll
}

.modal-header .close-suit-modal {
    margin-top: -2px;
}

@-webkit-keyframes zoom {
    from {
        -webkit-transform: scale(0)
    }

    to {
        -webkit-transform: scale(1)
    }
}

@keyframes zoom {
    from {
        transform: scale(0)
    }

    to {
        transform: scale(1)
    }
}
/*loading page*/
#loading{
    background: linear-gradient(45deg,#222428,#444856);
    color: #fff;
    height: 100%;
    width: 100%;
    position: fixed;
    z-index: 99999999;
    margin-top: 0px;
    top: 0px;
    overflow: hidden;
}
#loading-center{
    width: 100%;
    height: 100%;
    position: relative;
}
#loading-center-absolute {
    position: absolute;
    left: 54%;
    top: 45%;
    height: 150px;
    width: 150px;
    margin-top: -75px;
    margin-left: -75px;
}
#loading .object{
    width: 20px;
    height: 20px;
    background-color: #FFF;
    float: left;
    margin-right: 20px;
    margin-top: 65px;
    -moz-border-radius: 50% 50% 50% 50%;
    -webkit-border-radius: 50% 50% 50% 50%;
    border-radius: 50% 50% 50% 50%;
}

#loading #object_one {
    -webkit-animation: object_one 1.5s infinite;
    animation: object_one 1.5s infinite;
}
#loading #object_two {
    -webkit-animation: object_two 1.5s infinite;
    animation: object_two 1.5s infinite;
    -webkit-animation-delay: 0.25s;
    animation-delay: 0.25s;
}
#loading #object_three {
    -webkit-animation: object_three 1.5s infinite;
    animation: object_three 1.5s infinite;
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
}
@-webkit-keyframes object_one {
    75% {
        -webkit-transform: scale(0);
    }
}
@keyframes object_one {

    75% {
        transform: scale(0);
        -webkit-transform: scale(0);
    }
}
@-webkit-keyframes object_two {
    75% {
        -webkit-transform: scale(0);
    }
}
@keyframes object_two {
    75% {
        transform: scale(0);
        -webkit-transform:  scale(0);
    }
}
@-webkit-keyframes object_three {

    75% {
        -webkit-transform: scale(0);
    }
}
@keyframes object_three {

    75% {
        transform: scale(0);
        -webkit-transform: scale(0);
    }
}
#loading .text-shadowl {
    text-shadow: 0 0.5rem 1rem rgba(0,0,0,0.15);
}
#loading .font-weight-boldl {
    font-weight: 700;
    font-size: 2.5rem;
}
#loading .loadingtext {
    position: absolute;
    text-align: center;
    width: 100%;
    top: 50%;
}
/*时钟倒计时*/
figure, figcaption {
    display: block;
}

.transition {
    -webkit-transition: top 400ms linear;
    -moz-transition: top 400ms linear;
    -ms-transition: top 400ms linear;
    -o-transition: top 400ms linear;
    transition: top 400ms linear;
}

.timeTo {
    font-family: Tahoma, Verdana, Aial, sans-serif;
    font-size: 28px;
    line-height: 108%;
    font-weight: bold;
    height: 32px;
    position: fixed;
    top: 45px;
    left: 50%;
    z-index: 888;
    margin-left: -60px;
}

.timeTo span {
    vertical-align: top;
}

.timeTo.timeTo-white div {
    color: black;
    background: #ffffff; /* Old browsers */
    background: -moz-linear-gradient(top, #ffffff 38%, #cccccc 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(38%,#ffffff), color-stop(100%,#cccccc)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #ffffff 38%,#cccccc 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #ffffff 38%,#cccccc 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #ffffff 38%,#cccccc 100%); /* IE10+ */
    background: linear-gradient(to bottom, #ffffff 38%,#cccccc 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#cccccc',GradientType=0 ); /* IE6-9 */
}
.timeTo.timeTo-black div {
    color: white;
    background: #45484d; /* Old browsers */
    background: -moz-linear-gradient(top, #45484d 0%, #000000 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#45484d), color-stop(100%,#000000)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #45484d 0%,#000000 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #45484d 0%,#000000 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #45484d 0%,#000000 100%); /* IE10+ */
    background: linear-gradient(to bottom, #45484d 0%,#000000 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45484d', endColorstr='#000000',GradientType=0 ); /* IE6-9 */
}

.timeTo.timeTo-black .timeTo-alert {
    background: #a74444; /* Old browsers */
    background: -moz-linear-gradient(top, #a74444 0%, #3f0000 67%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a74444), color-stop(67%,#3f0000)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #a74444 0%,#3f0000 67%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #a74444 0%,#3f0000 67%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #a74444 0%,#3f0000 67%); /* IE10+ */
    background: linear-gradient(to bottom, #a74444 0%,#3f0000 67%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a74444', endColorstr='#3f0000',GradientType=0 ); /* IE6-9 */
}

.timeTo.timeTo-white .timeTo-alert {
    background: #ffffff; /* Old browsers */
    background: -moz-linear-gradient(top, #ffffff 35%, #e17373 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(35%,#ffffff), color-stop(100%,#e17373)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #ffffff 35%,#e17373 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #ffffff 35%,#e17373 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #ffffff 35%,#e17373 100%); /* IE10+ */
    background: linear-gradient(to bottom, #ffffff 35%,#e17373 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e17373',GradientType=0 ); /* IE6-9 */
}

.timeTo figure {
    display: inline-block;
    margin: 0;
    padding: 0;
}
.timeTo figcaption {
    text-align: center;
    /*font-size: 12px;*/
    line-height: 80%;
    font-weight: normal;
    color: #888;
}

.timeTo div {
    position: relative;
    display: inline-block;
    width: 25px;
    height: 30px;
    border-top: 1px solid silver;
    border-right: 1px solid silver;
    border-bottom: 1px solid silver;
    overflow: hidden;
}
.timeTo div.first {
    border-left: 1px solid silver;
}

.timeTo ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    position: absolute;
    left: 3px;
}

.timeTo ul li {
    margin: 0;
    padding: 0;
    list-style: none;
}
.modelContenbox{
    display: none;
}
/*reading page*/
.readingPage .readingRadio {
    margin: 0.5rem 0.5rem;
    width: 100%;
    display: block;
}
.exampleTitle {
    text-align: center;
}
.textareaContent {
    min-height: 200px;
    width: 100%;
    padding: 10px;
    resize: none;
    overflow: hidden;
}
.imgWidth100p img {
    max-width: 100%;
    height: auto;
}
.box dl.box-inner.with-thumb #AddDt {
     display: block;
     width: 100%;
     height: auto;
}
.box dl.box-inner.with-thumb #AddDt2 {
    display: block;
    width: 100%;
    height: auto;
}
.box.balloon2:after { content:none; position:absolute; bottom:-12px; left:49%; border-top:14px solid #ffffff; border-right:7px solid transparent; border-left:7px solid transparent; }
.box.balloon2:before { content:none; position:absolute; bottom:-14px; left:49%; border-top:14px solid #c7cad3; border-right:7px solid transparent; border-left:7px solid transparent; }
.noBorder input {
    border-top: none;
    border-left: none;
    border-right: none;
    width:50%;
}
.listeningPage .listingStart .listeningRadio2 {
    margin: 0.2rem 0rem 0.2rem 1rem;
     width: 100%;
     display: block;
    text-align: left;
}
/*Placement Result*/
.resultTable {
    width: 100%;
    border-right:1px solid #ccc;
    border-bottom:1px solid #ccc;
}
.resultTable th{
    font-weight: bold;
}
.resultTable th,.resultTable td {
    text-align: center;
    padding: 5px;
    border-left:1px solid #ccc;
    border-top:1px solid #ccc;
}
.partOneDirection .pink {
    color:#ed5cb7;
}
.contentText p {
    padding-left: 15px;
    text-align: justify;
}
.partOneDirection2 .contentText p {
    text-indent: 20px;
    padding-left: 0;
    text-align: justify;
}
.examTitleAfter2 {
    line-height: 50px;
}
.partOneDirection2 {
    word-wrap: break-word;
}
.iconStyle .addIcon {
    position:absolute;
    top:2px;
    right:2px;
    width:24px;
    height:auto;
    cursor:pointer;
    display:inline-block;
}
.iconStyle .addIcon img {
    width:100%;
}


.resultset .social_effects_table {
    width: 100%; min-height: 25px; line-height: 25px; text-align: center; border-collapse: collapse; padding:2px;
}
.resultset .social_effects_table,.resultset .social_effects_table tr th, .resultset .social_effects_table tr td {border:1px solid #c7cad3;padding:3px;text-align:center;}

.table_list_lesson {border:none !important;border-bottom:1px solid #e1e1e1  !important;}
.table_list_lesson thead tr th:before{content: none !important;}
.table_list_lesson tr th {background:none !important;border:none !important;}
.table_list_lesson_content {display: flex;justify-content: space-between;padding:0 10px;}
.table_list_lesson tbody tr td {border:none !important;}
.table_list_lesson > tbody > tr:hover > td {background:none!important;}
.arrow_target { line-height:30px;position:relative;text-align:center}
.arrow_up_down {position:absolute;right:0px;top:0px;}
.arrow_content dl.border-bottom {border-bottom:none;}
.arrow_content_border {border-left:1px solid #c7cad3;border-right:1px solid #c7cad3;border-bottom:1px solid #c7cad3;;}
.arrow_content_box {word-break: break-all;}

.notices_center {
    position: relative;
}
.notices_center .div_right {
    position: absolute;
    color: white;
    font-size: 12px;
    background-color: red;
    width: 21px;
    height: 21px;
    line-height: 21px;
    left: 80%;
    top: 10px;
    text-align: center;
    -webkit-border-radius: 24px;
    border-radius: 24px;
}
.notices_top {
    position: relative;
}
.notices_top .div_right {
    position: absolute;
    color: white;
    font-size: 12px;
    background-color: red;
    width: 21px;
    height: 21px;
    line-height: 21px;
    left: 80%;
    top: 10px;
    text-align: center;
    -webkit-border-radius: 24px;
    border-radius: 24px;
}
.notice_content {word-break: break-word;}

.dialog-gift-card {
    background: url(../images/register/gift_card/dialog_background.png)no-repeat;
    background-size: 100%;
    height: 484px;
}
.dialog-gift-card .message{
    margin: 0 auto;
    margin-top: 15px;
    padding:10px 20px 0 20px;
    background: url(../images/register/gift_card/dialog_message_background.png)no-repeat;
    background-size:100%;
    width: 305px;
    height:165px;
    color:white;
    box-sizing:border-box;
}
.dialog-gift-card .button{
    display:block;
    text-align:center;
    line-height: 68px;
    margin: 0 auto;
    background: url(../images/register/gift_card/dialog_button.png)no-repeat;
    background-size:100%;
    width: 304px;
    color:rgb(185,96,24);
    font-weight: 200;
    font-size: 26px;
}
.dialog-gift-card .button:hover {
    text-decoration:none;
}
.dialog-gift-card .gift_close{
    text-align:center;
    background: url(../images/register/gift_card/close.png)no-repeat;
    background-size:cover;
    width: 35px;
    height: 35px;
    margin-top: 18px;
    right: 5px;
    position: absolute;
}
.fs25{ font-size:25px;}
.fs20 {font-size: 20px;}
.fs14 {font-size: 14px;}
.fs18 {font-size: 18px;}
.fbs20 {font-size: 20px;}
.fbs14 {font-size: 14px;}
.fbs18 {font-size: 18px;}
.fbs28 {font-size:28px !important;}

.position_right {
    position:absolute;
    right:0;
    top:0;
}
.agreement {
    font-size:12px;
}
.agreement .cleckout {
    width: 17px;
    height: 17px;
    display: inline-block;
    vertical-align:bottom;
    background: url("../images/common/r_icons.png") -250px 0 no-repeat;
}
.agreement .checked {
    background-position: -300px 0;
}
.agreement_null {
    font-size: 12px;
    display: none;

}
/*progress_bg*/
.progress_bg {
    background: #fff;
}
.progress_container {
    padding: 30px 0;
    margin: 0 auto;
    text-align: center;
}
.progress_container li {
    display: inline-block;
    padding-left: 20px;
}
.progress_container li span {
    vertical-align: middle;
    padding: 0 10px;
}
.progress_container li span.num {
    border-radius: 50%;
    border: 1px solid #333;
    font-size: 12px;
    vertical-align: middle;
    line-height: 60px;
    display: inline-block;
    width:60px;
    box-sizing: border-box;
    height: 60px;
}
.num1 {
    background: #f3f3f3;
}
.progress_bg_mb .progress_container li {
    padding-left: 0px;
}
.progress_bg_mb .progress_container li span.num {
    width:40px;
    height: 40px;
    line-height: 40px;
}
.gold_box .clipped-box {
    display: none;
    position: absolute;
    bottom: 40px;
    left: 50%;
    height: 540px;
    width: 980px;
}
.gold_box .clipped-box img {
    position: absolute;
    top: auto;
    left: 0;
    bottom: 0;
    z-index: 999;
    -webkit-transition: -webkit-transform 1.4s ease-in, background 0.3s ease-in;
    transition: transform 1.4s ease-in;
}
.gold_box .gold_text {
    position: absolute;
    top: -65%;
    left: 0;
    width:100%;
    text-align: center;
}
.gold_num_content {
    display: none;
    position: absolute;
    top:-450%;
    left:0;
    text-align: center;
    width:100%;

}
.gold_num_content span.num_text {
    font-size: 54px;
    color: #ffcf19;
}
.gold_num_content span img {
    border: none;
}
#swiper-pagination-top {
    width: auto;
    left: 50%;
    bottom:20px;
    background: rgba(255,255,255,.6);
    border-radius: 25px;
    padding: 0 5px;
}
#swiper-button-prev-top {
    background: rgba(0,0,0,.3);
    -webkit-border-top-right-radius: 15px;
    -moz-border-radius-topright: 15px;
    border-top-right-radius: 15px;
    -webkit-border-bottom-right-radius: 15px;
    -webkit-background-clip: padding-box;
    -moz-border-radius-bottomright: 15px;
    -moz-background-clip: padding;
    border-bottom-right-radius: 15px;
    background-clip: padding-box;
    display: block;
    height: 30px;
    width: 20px;
    line-height: 30px;
    color: #fff;
    margin-top: -20px;
    left: 0;
    text-align: left;
}
#swiper-button-next-top {
    background: rgba(0,0,0,.3);
    -webkit-border-top-left-radius: 15px;
    -moz-border-radius-topleft: 15px;
    border-top-left-radius: 15px;
    -webkit-border-bottom-left-radius: 15px;
    -webkit-background-clip: padding-box;
    -moz-border-radius-bottomleft: 15px;
    -moz-background-clip: padding;
    border-bottom-left-radius: 15px;
    background-clip: padding-box;
    display: block;
    height: 30px;
    width: 20px;
    line-height: 30px;
    color: #fff;
    margin-top: -20px;
    right: 0;
    text-align: right;
}
.rankBox .hd li.comparison_title_li_style {
    width: 100%;
    border-bottom: 1px solid #ddd;
    border-top: none;
}
.cancellation {
    text-align: right;
    margin-top: 30px;
    width: 100%;
    box-sizing: border-box;
}
.account_inactive {
    cursor: pointer;
    padding-right: 20px;
}
.line_content {
    position: fixed;
    right: 3%;
    bottom:12%;
}
.puzzle_game_m_content {
    position: relative;
}
.puzzle_game_flag {
    position: absolute;
    top: 30%;
    left: 68%;
    color: red;
    font-weight: bold;
}
.ai_icon_flag {
    position: absolute;
    top: 30%;
    left: 87%;
    color: red;
    font-weight: bold;
}
.btn.white_btn, .btn.white_btn.disabled, .btn.white_btn.disabled:hover {
    color: #d8dce6;
    border: 1px solid #d8dce6;
    background: #ffffff;
    box-shadow: rgb(255 255 255 / 50%) 0px 0px 1px 1px inset;
    -webkit-box-shadow: rgb(255 255 255 / 50%) 0px 0px 1px 1px inset;
    -moz-box-shadow: rgba(255, 255, 255, 0.5) 0px 0px 1px 1px inset;
}
.btn.white_btn > [class^="icon-"]:before {
    color: #d8dce6;
}

.lesson_leave_style{
    float: right;
    line-height: 16px;
    text-align: right;
    cursor: pointer;
    font-size: 12px;
}
.lesson_leave_style span,.lesson_leave_reserved_m span{
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 4px;
    display: inline-block;
}
.lesson_leave_style span i.icon-arrow-left8:last-child,.lesson_leave_reserved_m span i.icon-arrow-left8:last-child {
    position: relative;
    left: -15px;
}
.lesson_leave_style span i.icon-arrow-right8:first-child,.lesson_leave_reserved_m span i.icon-arrow-right8:first-child {
    position: relative;
    right: -15px;
}
.lesson_leave_style span i.icon-arrow-down8:last-child,.lesson_leave_reserved_m span i.icon-arrow-down8:last-child  {
    position: relative;
    left: -21px;
    top: 5px;
}
.calendarbox > ul.lessons > li > dl.box > dd ul.btns {
    position: inherit;
}
.lesson_leave_reserved_m{
    line-height: 16px;
    text-align: right;
    cursor: pointer;
    font-size: 12px;
}
.lesson_leave_style_m {
    float: none;
    line-height: 16px;
    text-align: right;
    cursor: pointer;
    font-size: 12px;
}
.teacher_content .about_me_text {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3; /* 这里的数字3表示最多显示3行 */
    overflow: hidden;
    text-overflow: ellipsis;
}
.start_content .label_btn {
    display: inline-block;
    background: #E4E7EC;
    color: #667085;
    padding: 2px 10px;
    margin-right: 5px;
    margin-bottom: 4px;
    margin-top: 4px;
    border-radius: 25px;
    cursor: pointer;
    font-size: 12px;
}
.font-weight {
    font-weight: bold;
}
.ml100 {
    margin-left: 100px;
}
.start_content .label_btn.tag_active {
    background: rgba(255,193,7,.2);
    color: #FFA807;
}
.start_content .dialog_label_btn {
    font-size: 12px;
}
.upload_picture_support .image-preview {
    display: flex;
    flex-wrap: wrap;
}

.upload_picture_support .image-box {
    position: relative;
    width: 15%;
    height: 35px;
    margin-right: 13px;
    border: 1px solid #ccc;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.upload_picture_support .image-box img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    object-position: center;
}

.upload_picture_support .delete-icon {
    position: absolute;
    top: -15px;
    right: -15px;
    cursor: pointer;
    color: red;
    font-weight: bold;
    font-size: 16px;
    border-radius: 3px;
    padding: 2px 5px;
}
.upload_picture_support_modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.8);
    display: flex;
    justify-content: center;
    align-items: center;
}

.upload_picture_support_modal .modal-content-container {
    position: relative;
}

.upload_picture_support_modal .modal-content {
    max-width: 320px;
    min-width: 100px;
    max-height: 90vh;
    width: 100%;
    margin: auto;
    display: block;
}
.upload_picture_support_modal .delete-icon-modal {
    position: absolute;
    top: -25px;
    right: -25px;
    cursor: pointer;
    color: white;
    font-weight: bold;
    font-size: 22px;
    border-radius: 3px;
    padding: 2px 5px;
}

.cursor {
    cursor: pointer;
}

.underline-blue {
    text-decoration: underline;
    color: #1da0d0;
}