@charset "utf-8";
/* CSS Document */
.banner{ background:#eee; margin-top:150px; }
.banner .imgbox{ max-width:1400px; padding:0 15px; margin:auto; font-size:0; }
.banner .imgbox img{ width:100%; }
.banner .imgbox .mob_img{ display:none; }

.nav{ padding:25px 15px; max-width:1400px; margin:auto; }
.nav .onediv{ display:inline-block; padding-left:25px; text-decoration:none; font-size:0.875rem; background-image:url(../images/layout/home.png); background-repeat:no-repeat; background-position:left center; margin-right:25px; position:relative; }
.nav .onediv:after{ content:""; position:absolute; bottom:0; top:0; margin:auto; right:-14px; width:8px; height:8px; border-top:1px solid #a29b85; border-right:1px solid #a29b85; transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); }
.nav .twodiv{ display:inline-block; text-decoration:none; font-size:0.875rem; margin-right:25px; position:relative;  }
.nav .twodiv:after{ content:""; position:absolute; bottom:0; top:0; margin:auto; right:-14px; width:8px; height:8px; border-top:1px solid #a29b85; border-right:1px solid #a29b85; transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); }
.nav .twodiv:last-child:after{ display:none; }
.nav .twodiv:last-child{ margin:0; }


/* Overlay helper */
.fancybox-lock { overflow:hidden !important; width:auto; }
.fancybox-lock body { overflow:hidden !important; position:relative; height:100%; }

/*首頁*/
.blockbox{ display:flex; max-width:1400px; margin:auto; padding:0 15px; }
.blockbox .leftbox{ width:240px; }
.blockbox .rightbox{ flex:1; padding:0 0 0 90px; max-width: calc(100% - 240px); }

.blockbox .categories{ display:none; }

.blockbox .leftbox .searchbox{ width:100%; border:1px solid #ccc; padding:3px; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; display:flex; margin-bottom:20px; }
.blockbox .leftbox .searchbox .btn{ background-color:#1c8ccc; background-image:url(../images/page/icon_search.svg); background-position:center; background-repeat:no-repeat; background-size:17px; border:none; cursor:pointer; width:28px; height:28px; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; }
.blockbox .leftbox .searchbox .inputs{ flex:1; }
.blockbox .leftbox .searchbox .inputs input{ width:100%; height:28px; line-height:28px; background:#fff; font-size:0.875rem; color:#333; border:none; text-indent:10px; }

.blockbox .leftbox .closebtn{ display:none; }

.blockbox .leftbox .menulist{ margin-bottom:20px; }
.blockbox .leftbox .menulist .mtitle{ padding:20px 20px; background:#eee; position:relative; font-size:1.125rem; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; }
.blockbox .leftbox .menulist .mtitle .mtxt{ display:inline; color:#1c8ccc; font-size:0.875rem; }
.blockbox .leftbox .menulist .mtitle span{ display:block; width:17px; height:17px; position:absolute; top:0; bottom:0; margin:auto; right:15px; transform:rotate(-90deg); -webkit-transform:rotate(-90deg); -moz-transform:rotate(-90deg); transition: .5s all; -webkit-transition: .5s all; -moz-transition: .5s all; }
.blockbox .leftbox .menulist .mtitle span:before{ content:""; display:block; width:17px; height:3px; background:#333; position:absolute; top:0; left:0; bottom:0; right:0; margin:auto; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; }
.blockbox .leftbox .menulist .mtitle span:after{ content:""; display:block; width:3px; height:17px; background:#333; position:absolute; top:0; left:0; bottom:0; right:0; margin:auto; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; }
.blockbox .leftbox .menulist .m_box{ border-left:1px solid #ddd; border-right:1px solid #ddd; }
.blockbox .leftbox .menulist .m_box.topborder{ border-top:1px solid #ddd; }
.blockbox .leftbox .menulist .m_box .m_list{ display:block; position:relative; font-size:1rem; color:#333; border-bottom:1px solid #ddd; padding:15px 20px; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }
.blockbox .leftbox .menulist .m_box .m_list .spans{ background:#eee; font-size:0.813rem; padding:2px; }
.blockbox .leftbox .menulist .m_box .m_list.hold{ color:#1c8ccc; }
.blockbox .leftbox .menulist .m_box .m_list.hold:before{ content:""; position:absolute; top:0; bottom:0; margin:auto; right:20px; display:block; width:0; height:0; border-style: solid; border-width: 5px 0 5px 8px; border-color: transparent transparent transparent #007bff; }
.blockbox .leftbox .menulist .m_box .m_list.hold .spans{ background:#e8f7ff; }

.blockbox .leftbox .menulist.open .mtitle span{ transform:rotate(90deg); -webkit-transform:rotate(90deg); -moz-transform:rotate(90deg); }
.blockbox .leftbox .menulist.open .mtitle span:before{ display:none; }
.blockbox .leftbox .menulist.open .mtitle{ border-radius:10px 10px 0 0; -webkit-border-radius:10px 10px 0 0; -moz-border-radius:10px 10px 0 0; }
/*.blockbox .leftbox .menulist.open .m_box{ display:block; }*/

.blockbox .sorbox{ display:flex; justify-content:space-between; align-items:center; background:#eee; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; overflow:hidden; margin-bottom:40px; }
.blockbox .sorbox .sortleft{ display:flex; }
.blockbox .sorbox .sortleft .grids{ padding:15px 25px; display:flex; align-items:center; cursor:pointer; }
.blockbox .sorbox .sortleft .grids .txt{ color:#333; font-size:1rem; }
.blockbox .sorbox .sortleft .grids .icon{ width:8px; height:14px; margin:0 0 0 10px; background-image:url(../images/page/sort_arrow.svg); background-repeat:no-repeat; background-position:center; background-size:8px; }
.blockbox .sorbox .sortleft .grids.increase .icon{ background-image:url(../images/page/sort_arrow_top.svg); }
.blockbox .sorbox .sortleft .grids.decrease .icon{ background-image:url(../images/page/sort_arrow_bottom.svg); }
.blockbox .sorbox .sortleft .grids.increase,.blockbox .sorbox .sortleft .grids.decrease{ background-color:#1c8ccc; }
.blockbox .sorbox .sortleft .grids.increase .txt,.blockbox .sorbox .sortleft .grids.decrease .txt{ color:#fff; }
.blockbox .sorbox .sortright{ font-size:0.875rem; padding-right:25px; }

.prolistbox{ margin-left:-20px; display:flex; flex-wrap:wrap; }
.prolistbox .progrids{ width:25%; padding:0 0 50px 20px; display:flex; }
.prolistbox .progrids .sbg{ width:100%; background:#f5f5f5; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; overflow:hidden; padding-bottom:50px; position:relative; transition: .5s all; -webkit-transition: .5s all; -moz-transition: .5s all; }
.prolistbox .progrids .imgs{ width:100%; padding-bottom:100%; height:0; background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; display:block; }
.prolistbox .progrids .textbox{ padding:20px 15px 15px 15px; }
.prolistbox .progrids .textbox .h1{ font-size:0.938rem; font-weight:700; margin-bottom:10px; display: block; text-decoration:underline; color:#333; text-decoration:none; }
.prolistbox .progrids .textbox .s_ort{ display:flex; justify-content:space-between; margin-bottom:10px; }
.prolistbox .progrids .textbox .s_ort .b1{ font-size:0.75rem; }
.prolistbox .progrids .textbox .s_ort .b2{ font-size:0.75rem; display:flex; align-items:center; }
.prolistbox .progrids .textbox .s_ort .b2 .icon{ width:12px; font-size:0; margin-right:5px; }
.prolistbox .progrids .textbox .s_ort .b2 .icon img{ width:100%; }
.prolistbox .progrids .textbox .price{ font-size:0.75rem; }
.prolistbox .progrids .textbox .price span{ font-size:1.125rem; color:#1c8ccc; font-weight:700; }
.prolistbox .progrids .btn01{ display:block; position:absolute; right:15px; bottom:15px; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; background-color:#a112d9; width:34px; height:34px; background-image:url(../images/layout/icon_shopping.svg); background-size:18px; background-position:center; background-repeat:no-repeat; }
.prolistbox .progrids .btn02{ display:block; line-height:34px; height:34px; padding:0 10px; color:#fff; background-color:#d66dff; font-size:0.813rem; position:absolute; right:59px; bottom:15px; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; text-decoration:none; }

.isnodata{ text-align:center; background:#f5f5f5; padding:40px 20px; }


/*內頁*/
.page_title{ max-width:1370px; margin:auto; margin-top:150px; padding:60px 15px 30px 15px; border-bottom:1px solid #ccc; text-align:center; font-size:2.25rem; font-weight:900; color:#333; }

.searchblock{ display:flex; flex-wrap:wrap; margin-left:-15px; margin-bottom:20px; }
.searchblock.padtop{ padding:60px 0 0 0; }
.searchblock .outside_s{ display:flex; }
.searchblock .grids{ padding:0 0 10px 15px; }
.searchblock .grids.wt01{ width:140px; }
.searchblock .grids.wt02{ width:200px; }
.searchblock .grids.wt03{ width:140px; }
.searchblock .grids.wt04{ width:100%; }
.searchblock .grids .h2{ line-height:30px; font-size:0.938rem; font-weight:bold; white-space:nowrap; }
.searchblock .grids .ptxt{ line-height:30px; font-size:0.938rem; }
.searchblock .grids .input{ width:100%; line-height: 30px; height:30px; border: 1px solid #ccc; background: #fff; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; text-indent: 10px; font-size:0.875rem; }
.searchblock .grids .date{ position:relative; width:100%; }
.searchblock .grids .date .icon{ width:20px; height:20px; line-height:20px; font-size:1.125rem; position:absolute; top:0; right:5px; bottom:0; margin:auto; }
.searchblock .grids .btn{ line-height:30px; background:#a112d9; color:#fff; padding:0 15px; font-size: 0.813rem; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; cursor:pointer; border:none; width:100%; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }
.searchblock .grids .searTxt{ font-size:0.875rem; }
.searchblock .grids .searTxt .blue{ color: #1c8ccc; font-size:0.875rem; }

.addbtnblock{ display:flex; margin-bottom:20px; justify-content: flex-end; }
.addbtnblock .btns{ display:block; line-height:36px; padding:0 20px; font-size:0.875rem; border:1px solid #1c8ccc; color:#1c8ccc; }
.addbtnblock .btns .fa{ color:#1c8ccc; }

.sort_block{ display:flex; justify-content:space-between; margin-bottom:25px; }
.sort_block .s_left{ display:flex; }
.sort_block .s_left .s_grids{ margin:0 15px 0 0; }
.sort_block .s_left .s_btn{ display:block; line-height:48px; background:#fff; border:1px solid #ccc; padding:0 30px; font-size:1rem; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }
.sort_block .s_left .s_btn.hold{ background:#1c8ccc; color:#fff; border-color:#1c8ccc; } 

.sort_block .s_right .btns{ display: block; line-height: 36px; padding: 0 20px; font-size: 0.875rem; border: 1px solid #1c8ccc; color: #1c8ccc; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }
.sort_block .s_right .btns .fa{ color: #1c8ccc; }

.sort_Text{ font-size:0.875rem; margin-bottom:25px; color:#1c8ccc; }

.sort_txt{ margin:0 0 15px 0; font-size:0.875rem; color: #dc4747; }

/*老師文章*/
.teacherbox{ margin-left:-20px; display:flex; flex-wrap:wrap; }
.teacherbox .grids{ width:20%; padding:0 0 40px 20px; display:flex; }
.teacherbox .grids .gs{ display:block; width:100%; border:2px solid #ccc; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; overflow:hidden; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }
.teacherbox .grids .gs .imgs{ width:100%; padding-bottom:100%; background-repeat:no-repeat; background-position:center; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; }
.teacherbox .grids .gs .name_s{ background:#1c8ccc; padding:10px 15px; color:#fff; font-size:1.125rem; text-align:center; }
.teacherbox .grids .gs .name_s .fa{ color:#fff; }
.teacherbox .grids .gs .textbox{ padding:15px; }
.teacherbox .grids .gs .textbox .list{ display:flex; margin:0 0 5px 0; padding:0 0 5px 0; border-bottom:1px dashed #ccc; }
.teacherbox .grids .gs .textbox .list:last-child{ margin:0; padding:0; border:none; }
.teacherbox .grids .gs .textbox .list .h2{ color:#1c8ccc; font-size:0.938rem; font-weight:bold; white-space:nowrap; }
.teacherbox .grids .gs .textbox .list .h3{ font-size:0.938rem; padding:0 0 0 10px; }

/*註冊*/
.registerbox{ max-width:1000px; width:100%; margin:auto; border:1px solid #ccc; margin-bottom:60px; }
.registerbox .notices{ padding:20px; margin-bottom:25px;
background: #43cdee; 
background: -moz-linear-gradient(left,  #43cdee 0%, #a803d7 100%); 
background: -webkit-linear-gradient(left,  #43cdee 0%,#a803d7 100%); 
background: linear-gradient(to right,  #43cdee 0%,#a803d7 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#43cdee', endColorstr='#a803d7',GradientType=1 );
}
.registerbox .notices .h1{ font-size:1.25rem; font-weight:bold; margin-bottom:20px; color:#fff; }
.registerbox .notices .ptxt{ font-size:1rem; line-height:1.6; }
.registerbox .notices .ptxt ul{ margin:0 0 0 25px; }
.registerbox .notices .ptxt ul li{ list-style:disc; margin: 0 0 5px 0; color:#fff; }

.formH1_block{ display:flex; justify-content:space-between; }
.formH1_block .f_left{ flex:1; }
.formH1_block .f_right{ padding:0 0 0 10px; }
.formH1_block .f_right .btns{ display: block; line-height: 36px; padding: 0 20px; font-size: 0.875rem; border: 1px solid #1c8ccc; color: #1c8ccc; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }
.formH1_block .f_right .btns .fa{ color: #1c8ccc; }
.fromH1{ padding:0 20px; font-size:1.125rem; font-weight:bold; color:#1c8ccc; margin-bottom:5px; }
.fromH1 .red{ color:#dc4747; font-size:0.875rem; }
.fromH1 .num{ display:inline-block; vertical-align:middle; background: #e8f7ff; font-size: 0.875rem; font-weight: 300; color: #1c8ccc; padding: 0 3px; }
.fromH1.title{ padding:0 0 15px 0 !important; margin:0 0 10px 0; border-bottom:1px solid #ccc; }
.fromH1.title.marbotm{ margin-bottom:25px; }

.form_Text{ display:block; width:100%; }
.form_Text .f_txt{ font-size:0.875rem; color: #333; line-height:1.6; padding-right:15px; } 
.form_Text .f_txt ul{ margin:0 0 0 25px; }
.form_Text .f_txt ul li{ font-size:0.875rem; color: #999; }
.form_Text .f_txt .red{ color: #dc4747; font-size:0.875rem; }
.form_Text .f_btn{ display:block; text-align:right; }
.form_Text .f_btn .btns{ display: inline-block; line-height: 36px; padding: 0 20px; font-size: 0.875rem; border: 1px solid #a112d9; color: #a112d9; white-space:nowrap; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }
.form_Text .f_btn .btns .fa{ color: #a112d9; }

.formbox{ margin:0 0 0 -20px; display:flex; flex-wrap:wrap; padding:20px; }
.formbox .f_grids{ width:50%; padding:0 0 25px 20px; }
.formbox .f_grids.long{ width:100%; }
.formbox .f_grids .f_title{ font-size:1rem; color:#333; margin:0 0 5px 0; font-weight: bold; }
.formbox .f_grids .f_title span{ color:#F00; }
.formbox .f_grids .f_title .res{ color:#1c8ccc; font-size:0.75rem; }
.formbox .f_grids .inputbox{ display: flex; flex-wrap:wrap; align-items: center; margin-left: -10px; }
.formbox .f_grids .inputbox.itemstop{ align-items: flex-start; }
.formbox .f_grids .inputbox .wh00{ font-size:1rem; padding-left:10px; }
.formbox .f_grids .inputbox .wh01{ flex:1; font-size:0; padding-left:10px; }
.formbox .f_grids .inputbox .wh02{ width:110px; font-size:0; padding-left:10px; }
.formbox .f_grids .inputbox .wh03{ width:48px; font-size:0; padding-left:10px; }
.formbox .f_grids .inputbox .wh04{ width:160px; font-size:0; padding-left:10px; }
.formbox .f_grids .inputbox .wh05{ width:100%; font-size:0; padding-left:10px; padding-top:10px; }
.formbox .f_grids .inputbox .wh06{ width:33.333334%; font-size:0; padding-left:10px; }
.formbox .f_grids .inputbox .wh07{ width:90px; font-size:0; padding-left:10px; }
.formbox .f_grids .inputbox img{ width:100%; }
.formbox .f_grids .inputbox .input{ width:100%; line-height:36px; height:36px; border:1px solid #ccc; background:#fff; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; text-indent: 15px; }
.formbox .f_grids .inputbox .input.w_120{ width:120px; }
.formbox .f_grids .inputbox .input.martop{ margin-top:5px; }
.formbox .f_grids .inputbox .textareas{ width:100%; height:100px; resize:none; padding:10px; border:1px solid #ccc; background:#fff; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; }
.formbox .f_grids .inputbox label{ display:inline-block; vertical-align:middle; margin: 0 20px 0 0; }
.formbox .f_grids .inputbox .rebtn{ display:block; width:38px; height:28px; text-align: center; line-height:28px; }
.formbox .f_grids .inputbox .rebtn .fa{ color: #1c8ccc; font-size:1.75rem; }
.formbox .f_grids .inputbox .i_txt{ line-height:1.6; font-size:1rem; color:#333; background:#eee; padding:6px 10px; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; max-height:135px; overflow:auto; margin-bottom:5px; min-height:37px; }
.formbox .f_grids .inputbox .i_txt:last-child{ margin:0; }
.formbox .f_grids .inputbox .date{ position: relative; width: 100%; }
.formbox .f_grids .inputbox .date .icon{ width: 20px; height: 20px; line-height: 20px; font-size: 1.125rem; position: absolute; top: 0; right: 5px; bottom: 0; margin: auto; }
.formbox .f_grids .inputbox .flexs{ display:flex; align-items: center; width:100%; padding-left:10px; padding-top:10px; }
.formbox .f_grids .inputbox .flexs .ftxt{ font-size:0.875rem; color:#999; }
.formbox .f_grids .inputbox .flexs .ftxt_1{ flex:1; }
.formbox .f_grids .inputbox .flexs .ftxt_2{ padding:0 5px 0 0; }
.formbox .f_grids .inputbox .btn_del{ display:block; line-height: 34px; padding: 0 15px; font-size: 0.813rem; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; color: #dc4747; border: 1px solid #dc4747; text-align:center; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }
.formbox .f_grids .inputbox .btn_del .fa{ font-size: 0.813rem; color: #dc4747; }
.formbox .f_grids .inputbox .chexs{ display:flex; align-items: baseline; width:100%; padding-left: 10px; padding-bottom: 10px; }
.formbox .f_grids .inputbox .chexs:last-child{ padding-bottom:0; }
.formbox .f_grids .inputbox .chexs .c_1{ padding:0 10px 0 0; }
.formbox .f_grids .inputbox .chexs .c_1 label{ margin:0; }
.formbox .f_grids .inputbox .chexs .c_2{ flex:1; display:flex; flex-wrap:wrap; }
.formbox .f_grids .inputbox .chexs .c_2 .flexs.pads{ padding-top:0; }

.formbox .fbbtns{ display:inline-flex; align-items: center; justify-content:center; background:#1c8ccc; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; padding: 8px 12px; }
.formbox .fbbtns .txt{ color:#fff; font-weight:bold; font-size:1rem; padding-left:10px; }
.formbox .fbbtns .icon{ width:20px; height:20px; background-image:url(../images/layout/icon_fb_s.svg); background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; background-repeat:no-repeat; background-position:center; }

.agreebox{ width:100%; border:1px solid #ccc; padding:15px; line-height: 1.6; font-size:0.875rem; height:150px; overflow:auto; }
.formbox .f_grids .inputbox .agree_txt{ font-size:0.875rem; margin-top:10px; }

.formbtn{ text-align:center; padding:20px 0 60px 0; }
.formbtn .btns{ display:inline-block; vertical-align:middle; line-height:44px; height:44px; border:none; padding:0 20px; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; background: #a112d9; color:#fff; font-size:1rem; margin:0 15px; cursor:pointer; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }
.formbtn .btns.bg01{ background:#ccc; color:#333; }
.formbtn .f_txt{ padding:10px 0 0 0; text-align:center; font-size:0.875rem; color:#1c8ccc; }


.form_list.pads .fromH1{ padding:0; }
.form_list.pads .formbox{ padding:20px 0; }

.form_list.reply{ padding: 0 20px; border: 2px #ccc dashed; margin: 0 0 20px 0; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; }


/*忘記密碼*/
.m_formbox{ max-width:600px; margin:auto; border:1px solid #ccc; padding:20px; width:100%; margin-bottom:100px; }
.m_formbox .m_txt{ font-size:0.938rem; margin-bottom:20px; }
.m_formbox .m_list{ margin:0 0 20px 0; }
.m_formbox .m_list .h2{ font-size:1rem; font-weight:bold; margin-bottom:5px; }
.m_formbox .m_list .m_flex{ display:flex; margin-left:-10px; align-items: center; }
.m_formbox .m_list .m_flex .f1{ flex:1; padding:0 0 0 10px; }
.m_formbox .m_list .m_flex .f2{ width:110px; padding:0 0 0 10px; }
.m_formbox .m_list .m_flex .f3{ width:48px; padding:0 0 0 10px; }
.m_formbox .m_list .m_flex img{ vertical-align:middle; width:100%; }
.m_formbox .m_list .m_flex .rebtn { display: block; width: 38px; height: 28px; text-align: center; line-height: 28px; }
.m_formbox .m_list .m_flex .rebtn .fa{ color: #1c8ccc; font-size: 1.75rem; }
.m_formbox .m_list .m_flex .input{ width: 100%; line-height: 36px; height: 36px; border: 1px solid #ccc; background: #fff; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; text-indent: 15px; }
.m_formbox .m_list .retxt{ color: #1c8ccc; font-size: 0.875rem; }
.m_formbox .m_list .retxt.red{ font-size:1rem; color: #dc4747; }

/*購物車*/
.stepblock{ width:100%; margin-bottom:60px; }
.stepbox{ display:flex; justify-content:center; align-content: flex-start; margin-bottom:40px; }
.stepbox .grids{ padding:15px; display:flex; flex-wrap:wrap; align-content: flex-start; width:160px; margin: 0 5px; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; background: #43cdee; 
background: -moz-linear-gradient(left,  #43cdee 0%, #a803d7 100%); 
background: -webkit-linear-gradient(left,  #43cdee 0%,#a803d7 100%); 
background: linear-gradient(to right,  #43cdee 0%,#dd67ff 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#43cdee', endColorstr='#a803d7',GradientType=1 ); }
.stepbox .grids .k1{ font-size:0.813rem; font-weight:bold; width:100%; text-align:center; margin-bottom:10px; color:#fff; }
.stepbox .grids .k2{ font-size:0.938rem; width:100%; text-align:center; color:#fff; }
.stepbox .grids.hold .k1{ color: #fcee21; }
.stepbox .grids.hold .k2{ color: #fcee21; }
.stepbox .arrow{ font-size:1rem; display:flex; align-items: center; }

.buys_text{ margin-bottom:15px; font-size:0.875rem; }
.buys_text ul.dec{ margin:0 0 0 25px; list-style:decimal; }
.buys_text ul li{ font-size:0.938rem; margin-bottom:5px; }

.buy_box{ border:3px solid #ccc; margin-bottom:30px; }
.buy_box:last-child{ margin:0; }
.buy_box .h_title{ padding:15px 20px; font-size:1.25rem; font-weight:bold; border-bottom:1px solid #ccc; }
.buy_box .h_title label{ font-size:0.938rem; font-weight:normal; margin-left:5px; }
.buy_box .pins{ padding:20px; }
.buy_box .table{ display:table; width:100%; border-collapse:collapse; }
.buy_box .table .tr{ display:table-row; }
.buy_box .table .th{ display:table-cell; vertical-align:middle; padding:15px 15px; background:#1c8ccc; color:#fff; }
.buy_box .table .th.img{ width:150px; }
.buy_box .table .th.del{ width:60px; }
.buy_box .table .td{ display:table-cell; vertical-align:middle; padding:25px 15px; border-bottom:1px solid #ccc; }
.buy_box .table .td.price{ color:#1c8ccc; font-weight:bold; }
.buy_box .table .td.title{ text-align:left; }
.buy_box .table .tr:last-child .td{ border:none; }
.buy_box .imgbox{ width:100%; }
.buy_box .imgbox .imgs{ width:100%; padding-bottom:100%; background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; }
.buy_box .delbtn{ display:block; width:30px; height:30px; line-height:30px; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; background:#dc4747; color:#fff; text-align:center; }
.buy_box .delbtn .fa{ color:#fff; }
.buy_box .point_box{ background:#eee; padding:20px; }
.buy_box .point_box .lists{ margin-bottom:10px; line-height:1.8; }
.buy_box .point_box .lists:last-child{ margin-bottom:0; }
.buy_box .point_box .lists .reds{ color:#dc4747; font-weight:bold; }
.buy_box .point_box .lists .blues{ color:#1c8ccc; font-size:0.813rem; }
.buy_box .point_box .lists .input{ width:120px; line-height: 36px; height: 36px; border: 1px solid #ccc; background: #fff; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; text-indent: 15px; }
.buy_box .total_box{ padding:20px 0 0 0; display:flex; justify-content:flex-end; } 
.buy_box .total_box .picbox{ display:flex; align-items: flex-end; padding:0 20px 0 0; border-right:1px solid #ccc; } 
.buy_box .total_box .picbox .y1{ font-size:0.75rem; padding:0 10px 0 0; }
.buy_box .total_box .picbox .y2{ text-align:right; min-width:180px; font-size:1.5rem; color:#1c8ccc; font-weight:bold; line-height: 100%; }
.buy_box .total_box .picbox .y2 span{ font-size:0.75rem; color:#999; font-weight:normal; }
.buy_box .total_box .btnbox{ display:block; line-height: 44px; height: 44px; border: none; padding: 0 20px; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; background: #a112d9; color: #fff; font-size: 1rem; margin:0 0 0 20px; cursor: pointer; }

.buy_box .total_box_two{ border: 1px solid #ccc; padding:20px; }
.buy_box .total_box_two .total_list{ display:flex; justify-content:flex-end; align-items: center; margin:0 0 10px 0; }
.buy_box .total_box_two .total_list:last-child{ margin:0; }
.buy_box .total_box_two .total_list .h1{ font-size:0.875rem; }
.buy_box .total_box_two .total_list .h2{ font-size:1rem; width:200px; text-align:right; }
.buy_box .total_box_two .total_list .h2 .blues{ font-size: 1.5rem; color: #1c8ccc; font-weight: bold; }

.buy_box .labbox{ display:flex; flex-wrap:wrap; margin-left:-20px; }
.buy_box .labbox .grids{ flex:1; padding:10px 0 10px 20px; } 
.buy_box .labbox .grids .reds{ color:#dc4747; font-weight:bold; }
.buy_box .labbox .grids .blues{ color:#1c8ccc; font-size:0.813rem; }
.buy_box .labbox .grids .input{ width:120px; line-height: 36px; height: 36px; border: 1px solid #ccc; background: #fff; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; text-indent: 15px; }

.buy_box .b_retxt{ color: #1c8ccc; font-size: 0.875rem; padding:0 20px 20px 20px; margin: -20px 0 0 0; }
.buy_box .b_retxt span{ color: #dc4747; font-size: 0.875rem; }

.buyTextbox{ padding:20px; }
.buyTextbox .iconbox{ width:160px; margin:auto; }
.buyTextbox .iconbox .icons{ width:100%; padding-bottom:100%; background-size:50%; background-color:#eee; background-repeat:no-repeat; background-position:center; background-image:url(../images/page/icon_check.svg); border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; }
.buyTextbox .iconbox .icons.note{ background-image:url(../images/page/icon_warning.svg); }
.buyTextbox .h1{ text-align:center; padding:40px 0 0 0; font-size:1.25rem; font-weight:bold; }
.buyTextbox .p{ line-height:1.8; font-size:0.875rem; text-align: center; padding: 15px 0; }
.buyTextbox .p a{ color: #1c8ccc; text-decoration:underline; }
.buyTextbox .p .focus{ background: #f6daff; padding: 0px 3px; display: inline-block; font-size:0.875rem; line-height: normal; }
.buyTextbox .p .blue{  color: #1c8ccc; line-height:1.8; font-size:0.875rem; }
.buyTextbox .table{ max-width:500px; margin:auto; text-align:left; }
.buyTextbox .table .rs{ padding:10px 20px; border:1px solid #ccc; font-size:0.875rem; line-height:1.8; }
.buyTextbox .table .rs h3{ font-size:0.913rem; font-weight:bold; }
.buyTextbox .table .rs span{ color: #1c8ccc; font-size:0.75rem; }
.buyTextbox .linkbox{ display: inline-block; vertical-align:middle; line-height:30px; padding:0 15px; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; font-size:0.938rem; color:#1c8ccc; border:1px solid #1c8ccc; text-decoration:none !important; margin:5px; }

.stepblock .textblock{ width: 100%; line-height: 1.8; }

.stepblock .textblock *{ font-weight:revert; font-size:inherit; color: revert; }
.stepblock .textblock a{ color: #1c8ccc; text-decoration: underline; }
.stepblock .textblock ul,.stepblock .textblock ol{ margin:0 0 0 25px; }
.stepblock .textblock li{ margin:0 0 10px 0; }
.stepblock .textblock img{ max-width:100%; }
.stepblock .textblock .blue{ color:#1c8ccc; font-weight:500; }
.stepblock .textblock .linebox{ border:1px solid #ccc; padding:20px 25px; }
.stepblock .textblock .focus{ background: #f6daff; padding: 0px 3px; display: inline-block; font-size:0.875rem; line-height: normal; }

.stepblock .textblock .fimgs{ display:flex; margin-top:40px; padding:40px 20px; flex-direction: column; align-items: center; /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#43cdee+0,a705d8+100 */
background: rgb(67,205,238); /* Old browsers */
background: -moz-linear-gradient(-45deg,  rgba(67,205,238,1) 0%, rgba(167,5,216,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  rgba(67,205,238,1) 0%,rgba(167,5,216,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  rgba(67,205,238,1) 0%,rgba(167,5,216,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#43cdee', endColorstr='#a705d8',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ }
.stepblock .textblock .fimgs .fgrids{ width:100%; margin-bottom:40px; }
.stepblock .textblock .fimgs .fgrids:last-child{ margin:0; }
.stepblock .textblock .fimgs .fgrids .fs{ width: 60%; margin: auto; font-size:0; }
.stepblock .textblock .fimgs .fgrids .fs img{ box-shadow: 10px 10px 5px rgba(0,0,0,0.2); }

/*隱私權政策*/
.stepblock .textblock .tb_title,
.stepblock .textblock .tb_sub{ display:block; font-weight:bold; }
.stepblock .textblock .tb_title{ font-size:20px; margin-bottom:10px; }
.stepblock .textblock .tb_sub{ font-size:16px; }

/*會員*/
.member_data_box{ margin:0 0 30px 0; }
.member_data_box .member_imgs{ width:100%; padding-bottom:100%; background-position:center; background-repeat:no-repeat; background-color: #eee; overflow:hidden; position:relative; }
.member_data_box .member_imgs img{ position:absolute; top:0; left:0; bottom:0; right:0; margin:auto; max-width:100%; max-height:100%; }
.member_data_box .member_text{ padding:15px 0 0 0; }
.member_data_box .member_text .list{ display:flex; align-items: baseline; margin:0 0 10px 0; }
.member_data_box .member_text .list .icon{ width:18px; height:18px; background-position:center; background-repeat:no-repeat; background-size:18px; }
.member_data_box .member_text .list .p_box{ display:flex; flex-wrap:wrap; flex:1; }
.member_data_box .member_text .list .p1{ margin: 2px 0 2px 10px; font-size:1.25rem; font-weight:bold; color:#333; line-height: 100%; }
.member_data_box .member_text .list .p2{ margin: 2px 0 2px 10px; font-size:1rem; color:#555; }
.member_data_box .member_text .list .p3{ margin: 2px 0 2px 10px; font-size:1.5rem; font-weight:bold; color:#1c8ccc; }
.member_data_box .member_text .list .p3 span{ font-size:1rem; color:#333; }
.member_data_box .member_text .btnbox{ margin-left:-10px; display:flex; justify-content:center; padding: 10px 0 0 0; }
.member_data_box .member_text .btnbox .btns{ padding-left:10px; width:50%; }
.member_data_box .member_text .btnbox .btns .btn{ display:block; width:100%; line-height:36px; height:36px; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; background:#a112d9; color:#fff; font-size:1rem; text-align:center; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }

/*社群留言板*/
.release{ padding-bottom:40px; border-bottom:1px solid #ccc; margin-bottom:60px; }
.release .h1{ font-size:1.25rem; margin-bottom:20px; }
.release .h1 .sm{ font-size:0.875rem; }
.release .rebox{ display:flex; }
.release .rebox .re_Text{ flex:1; padding:0 30px 0 0; }
.release .rebox .re_Text.pads{ padding:0; }
.release .rebox .re_down{ width:320px; }
.release .rebox .re_Text .areaText{ width:100%; height:220px; border:1px solid #ccc; resize:none; padding:15px; font-size:1rem; }
.release .rebox .re_down .downbtn{ margin:0 0 10px 0; display:flex; align-items: center; }
.release .rebox .re_down .downbtn .btns{ width:90px; }
.release .rebox .re_down .downbtn .btns input{ display:none; }
.release .rebox .re_down .downbtn .btns label{ width:100%; display:block; line-height:36px; height:36px; text-align:center; color:#1c8ccc; font-size:0.875rem; border:1px solid #1c8ccc; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; }
.release .rebox .re_down .downbtn .text{ flex:1; font-size:0.875rem; color:#555; padding:0 0 0 10px; }
.release .rebox .re_down .phimg{ background:#eee; width:100%; height:175px; overflow:hidden; position:relative; }
.release .rebox .re_down .phimg .nopic{ position:absolute; z-index:1; top:0; left:0; right:0; bottom:0; margin:auto; display:flex; justify-content:center; align-items:center; font-size:1.25rem; color:#bbb; }
.release .rebox .re_down .phimg .imgs{ position:absolute; z-index:2; top:0; left:0; right:0; bottom:0; margin:auto; display:flex; align-items:center;  justify-content:center; }
.release .rebox .re_down .phimg .imgs img{ max-width:100%; max-height:100%; }

.release .rebtns{ padding:40px 0 0 0; text-align:center; }
.release .rebtns .sendbtn{ display:inline-block; line-height:50px; height:50px; padding:0 40px; background:#a112d9; color:#fff; font-size:1.125rem; cursor:pointer; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; border:none; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }

.messagebox .h1{ font-size:1.25rem; margin-bottom:30px; }
.messagebox .t_flex{ display:flex; justify-content:space-between; }
.messagebox .t_flex .opbox{ display:flex; }
.messagebox .t_flex .opbox .ops{ margin:0 0 0 10px; width:100px; }
.messagebox .t_flex .opbox .ops .input{ width: 100%; height:30px; line-height: 30px; border: 1px solid #ccc; background: #fff; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; text-indent: 10px; font-size: 0.875rem; }
.messagebox .meslist{ margin-bottom:60px; }
.messagebox .meslist:last-child{ margin-bottom:0; }
.messagebox .meslist .infos{ display:flex; }
.messagebox .meslist .infos .imgbox{ width:120px; }
.messagebox .meslist .infos .imgbox .imgs{ width:100%; padding-bottom:100%; background-color:#eee; background-position:center; background-repeat:no-repeat; position:relative; }
.messagebox .meslist .infos .imgbox .imgs img{ position:absolute; top:0; left:0; bottom:0; right:0; margin:auto; max-width:100%; max-height:100%; }
.messagebox .meslist .infos .textbox{ padding:0 0 0 20px; flex:1; }
.messagebox .meslist .infos .textbox .one_list{ display:flex; justify-content:space-between; width:100%; }
.messagebox .meslist .infos .textbox .one_list .personal{ display:flex; align-items: center; }
.messagebox .meslist .infos .textbox .one_list .personal .icon{ width:16px; height:16px; background-image:url(../images/page/icon_member.svg); background-position:center; background-repeat:no-repeat; background-size:12px; }
.messagebox .meslist .infos .textbox .one_list .personal .name_s{ font-size:1rem; line-height: 100%; font-weight:bold; color:#333; padding:0 0 0 5px; }
.messagebox .meslist .infos .textbox .one_list .personal .lv_s{ font-size:0.75rem; color:#aaa; padding:0 0 0 5px; }
.messagebox .meslist .infos .textbox .one_list .dates{ font-size:0.75rem; }
.messagebox .meslist .infos .textbox .two_list{ font-size:1rem; line-height:1.6; margin-top:15px; }
.messagebox .meslist .infos .textbox .three_list{ display:flex; flex-wrap:wrap;  margin-top:15px; }
.messagebox .meslist .infos .textbox .three_list .imgs{ width:174px; height:174px; border:1px solid #ccc; margin:0 5px 5px 0; display: flex; align-items: center; justify-content: center; background: #fff; }
.messagebox .meslist .infos .textbox .three_list .imgs img{ max-width:100%; max-height:100%; }

.messagebox .meslist .replybox{ background:#f5f5f5; padding:25px; margin:20px 0 0 0; }
.messagebox .meslist .replybox .re_flex{ display:flex; justify-content:space-between; margin-bottom:20px; }
.messagebox .meslist .replybox .re_flex .v_1{ flex:1; display:flex; }
.messagebox .meslist .replybox .re_flex .v_1 .v_txt{ font-size:1rem; }
.messagebox .meslist .replybox .re_flex .v_1 .v_txt span{ font-weight:bold; color:#1c8ccc; }
.messagebox .meslist .replybox .re_flex .v_1 .v_btn{ margin-left:20px; color:#1c8ccc; font-weight:bold; text-decoration:underline; cursor:pointer; }
.messagebox .meslist .replybox .re_flex .v_2{ width:78px; }
.messagebox .meslist .replybox .re_flex .btns{ cursor:pointer; width:100%; background:#a112d9; color:#fff; font-size:1rem; line-height:40px; height:40px; text-align:center; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; border:none; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }
.messagebox .meslist .replybox .re_flex .btns2{ display:block; cursor:pointer; width:100%; background:#a112d9; color:#fff; font-size:1rem; line-height:40px; height:40px; text-align:center; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; border:none; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }

.messagebox .meslist .replybox .m_res .infos{ padding:0 0 20px 0; margin:0 0 20px 0; border-bottom:1px solid #ccc;}
.messagebox .meslist .replybox .m_res .infos:last-child{ padding:0; margin:0; border:none; }
.messagebox .meslist .replybox .m_res .infos .imgbox{ width:82px; }
.messagebox .meslist .replybox .m_res .infos .textbox .three_list .imgs{ width:100px; height:100px; }

.messagebox .meslist .replybox .noreText{ padding:30px 0; text-align:center; color:#bbb; font-size:1.25rem; }

.messagebox .morebtn{ text-align:center; padding:40px 0 0 0; }
.messagebox .morebtn .btns{ display:inline-block; line-height:44px; height:44px; font-size:1rem; color:#dc4747; border:1px solid #dc4747; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px; padding:0 30px; }

/*我已購買*/
.totalbox{ border:1px solid #ccc; padding:20px; display:flex; flex-wrap:wrap; }
.totalbox .grids{ width:50%; padding:5px; display:flex; }
.totalbox .grids .title{ padding:0 20px 0 20px; position:relative; line-height:24px; font-size:1rem; font-weight:bold; }
.totalbox .grids .title:before{ content:""; display:block; width:0; height:0; position: absolute; left:0; top:8px; border-style:solid; border-color:transparent transparent transparent #1c8ccc; border-width:4px 0 4px 7px; }
.totalbox .grids .title:after{ content:""; display:block; width:1px; height:16px; background:#ccc; position:absolute; top:4px; right:0; margin:auto; }
.totalbox .grids .tsbox{ flex:1; padding:0 0 0 20px; font-size:1rem; line-height:24px; }
.totalbox .grids .tsbox span{ font-size:0.875rem; }
.totalbox .grids .tsbox .rt{ background:#f6daff; padding:0px 3px; display: inline-block; }
.totalbox .grids .tsbox .link{ display:inline-block; background:#1c8ccc; padding:0 5px; color:#fff; font-size:0.875rem; margin: 0 0 0 5px; }

.totalbox.marbotm{ margin-bottom:20px; }

.receipts{ padding:10px 0 0 0; text-align:right; }
.receipts .btn{ display:inline-block; color:#fff; font-size:0.813rem; background:#9725db; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px; padding: 5px 20px; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }

.total_block{ display:flex; padding:15px 0 0 0; }
.total_block .t_grids{ flex:1; background:#5d9be9; text-align:center; font-size:0.875rem; color:#fff; padding:20px 0; }
.total_block .t_grids:last-child{ background:#9725db; }
.total_block .t_grids .pads{ padding-right:20px; font-size:0.875rem; color:#fff; }
.total_block .t_grids .sm{ font-size:1.25rem; color:#fff; font-weight:bold; padding:0 5px; }

.oldbuy{ padding:0 0 40px 0; }
.oldbuy .oldbuy_list{ position:relative; margin:0 0 20px 0; padding:20px; background:#eee; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; border-top: 3px solid #5d9be9; }
.oldbuy .oldbuy_list:last-child{ margin:0; }
.oldbuy .oldbuy_list .nus{ position:absolute; right:0; top:0; min-width:30px; height:26px; background: #5d9be9; line-height:26px; color:#fff; font-weight:bold; font-size:0.875rem; text-align:center; padding:0 3px; }
.oldbuy .oldbuy_list .otitle{ transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; display:block; font-size:1.125rem; font-weight:bold; margin:0 0 15px 0; padding:0 0 15px 0; border-bottom:1px solid #ccc; color: #1c8ccc; }
.oldbuy .oldbuy_list .otitle .fa{ font-size:1rem; color: #1c8ccc; }
.oldbuy .oldbuy_list .obox{ display:flex; flex-wrap:wrap; margin-left:-15px; }
.oldbuy .oldbuy_list .obox .ogrid{ width:50%; padding-left:15px; padding-top:5px; padding-bottom:5px; display:flex; }
.oldbuy .oldbuy_list .obox .ogrid.longs{ width:100%; }
.oldbuy .oldbuy_list .obox .ogrid .g1{ font-size:1rem; font-weight:bold; color:#333; width:64px; }
.oldbuy .oldbuy_list .obox .ogrid .g2{ font-size:1rem; padding:0 0 0 15px; width:calc(100% - 64px); }
.oldbuy .oldbuy_list .obox .ogrid .g2 span{ font-size:0.875rem; }
.oldbuy .oldbuy_list .obox .ogrid .g2 .nametitle{ overflow : hidden; text-overflow : ellipsis; white-space : nowrap; width:100%; }

.tobuybox{ padding:40px 0 0 0; }
.tobuybox .tobuylist{ display:flex; background: #f5f5f5; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; margin-bottom: 15px; padding: 20px; }
.tobuybox .tobuylist .imgs{ width:160px; }
.tobuybox .tobuylist .imgs .img{ width: 100%; padding-bottom: 100%; background-position: center; background-repeat: no-repeat; background-color: #fff; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; }
.tobuybox .tobuylist .flex_s{ flex:1; padding: 20px; margin: 0 0 0 20px; border-left: 1px #ddd solid; }
.tobuybox .tobuylist .flex_s .flexlist{ display:flex; width:100%; margin:0 0 10px 0; }
.tobuybox .tobuylist .flex_s .flexlist .h2{ font-size:0.938rem; padding:0 10px 0 0; line-height:22px; color: #1c8ccc; font-weight: bold; white-space:nowrap; }
.tobuybox .tobuylist .flex_s .flexlist .ptxt{ font-size:0.938rem; line-height:22px; }
.tobuybox .tobuylist .flex_s .flexlist .ptxt .sm{ font-size:0.813rem; }
.tobuybox .tobuylist .flex_s .flexlist .ptxt a.link{ font-size:0.938rem; color: #1c8ccc; text-decoration:underline; }
.tobuybox .tobuylist .flex_s .flexlist .ptxt a.btns{ background: #9725db; color:#fff; font-size:0.75rem; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; line-height:22px; padding:0 8px; display: inline-block; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }

/*機碼開通*/
.keycode{ margin-left:-20px; display:flex; flex-wrap:wrap; margin-bottom:40px; } 
.keycode .grids{ width:50%; padding:0 0 20px 20px; display:flex; }
.keycode .grids .gs{ width:100%; background:#eee; padding:15px; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; position:relative; overflow:hidden; }
.keycode .grids .nus{ position:absolute; right:0; top:0; min-width:30px; height:26px; background: #5d9be9; line-height:26px; color:#fff; font-weight:bold; font-size:0.875rem; text-align:center; padding:0 3px; border-radius: 0 0 0 10px; -webkit-border-radius: 0 0 0 10px; -moz-border-radius: 0 0 0 10px; }
.keycode .grids .topbox{ display:flex; align-items:center; width:100%; margin-bottom:20px; }
.keycode .grids .topbox .imgbox{ width:178px; }
.keycode .grids .topbox .imgbox .imgs{ width:100%; padding-bottom:100%; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; background-position:center; background-repeat:no-repeat; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; overflow: hidden; }
.keycode .grids .topbox .textbox{ padding:0 0 0 30px; }
.keycode .grids .topbox .textbox .h1{ font-size:0.938rem; font-weight:bold; margin: 0 0 10px 0; }
.keycode .grids .topbox .textbox .sort{ font-size:0.813rem; }
.keycode .grids .g_btn{ margin-bottom:10px; display:block; text-align:center; line-height:40px; color:#fff; font-weight:bold; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px; background:#9725db; font-size:0.813rem; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }
.keycode .grids .g_list{ min-height: 40px; margin-bottom:10px; display:flex; align-items:center; justify-content:space-between; border:1px solid #ccc; padding:5px; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px; background:#fff; }
.keycode .grids .g_list .txt{ font-size:0.813rem; padding:0 0 0 15px; }
.keycode .grids .g_list .downbtn{ background:#9725db; height:30px; line-height:30px; padding:0 15px; color:#fff; font-size:0.75rem; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px; display:block; white-space:nowrap; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }

.keyText{ display:block; border:1px solid #ccc; margin-bottom:30px; padding:20px; }
.keyText .h1{ font-size:1rem; font-weight:bold; margin-bottom:10px; }
.keyText .txts{ line-height:1.6; }
.keyText .txts .blue{ color:#1c8ccc; font-size:1rem; }
.keyText .txts .red{ color:#dc4747; font-size:1rem; }
.keyText ul{ margin:0 0 0 25px; }
.keyText ul li{ list-style: disc; margin: 0 0 5px 0; }

/*我的好友*/
.quantity{ background:#eee; padding:5px 10px; text-align:right; font-size:0.813rem; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; margin-bottom:30px; }

.myRemark{ margin:0 0 20px 0; font-size:0.875rem; }

.myfriend{ display:flex; flex-wrap:wrap; margin-left:-30px; }
.myfriend .grids{ width:25%; padding:0 0 0 30px; position:relative; margin-bottom:50px; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }
.myfriend .grids .imgs{ display:block; width:100%; padding-bottom:100%; background-position: center; background-repeat: no-repeat; background-image: url(../images/page/icon_member.svg); background-size:60px; background-color: #eee; overflow: hidden; position: relative; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all;  }
.myfriend .grids .imgs img{ position: absolute; top: 0; left: 0; bottom: 0; right: 0; margin: auto; max-width: 100%; max-height: 100%; }
.myfriend .grids .title{ display:block; color:#333; padding:10px 0 0 0; text-align:center; font-size:0.938rem; }
.myfriend .grids .grade{ padding:5px 0 0 0; text-align:center; font-size:0.75rem; }
.myfriend .grids .btns{ padding:15px 0 0 0; text-align:center; }
.myfriend .grids .btns .btn{ display:inline-block; line-height: 30px; padding: 0 15px; font-size: 0.813rem; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; color: #dc4747; border:1px solid #dc4747; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }
.myfriend .grids .btns .btn .fa{ color:#dc4747; font-size: 0.875rem; }
.myfriend .grids .btns .btn.send{ background:#a112d9; color:#fff; border:1px solid #a112d9; }
.myfriend .grids .btns .btn.send .fa{ color:#fff; }

/*相簿*/
.a_title{ margin-bottom:20px; font-size:1.25rem; }
.albumblock{ margin-left:-20px; display: flex; flex-wrap: wrap; }
.albumblock .agrids{ width:25%; padding:0 0 50px 20px; display:flex; }
.albumblock .agrids .gs{ width:100%; display:block; background:#eee; padding:15px; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; overflow:hidden; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }
.albumblock .agrids .imgbox{ display:block; width:100%; padding-bottom:100%; background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; }
.albumblock .agrids .titles{ display:block; padding:15px 0 0 0; font-size:0.938rem; font-weight:bold; }
.albumblock .agrids .titles .fa{ color:#1c8ccc; }
.albumblock .agrids .datebox{ display:flex; margin-top: 5px; }
.albumblock .agrids .datebox .date{ padding-right:5px; font-size:0.813rem; }
.albumblock .agrids .datebox .phos{ flex:1; padding:0 0 0 5px; text-align:right; font-size:0.813rem; }
.albumblock .agrids .btnbox{ display:flex; margin-left:-10px; margin-top: 10px; }
.albumblock .agrids .btnbox .btns{ width:50%; padding-left:10px; }
.albumblock .agrids .btnbox .btns .btn{ width:100%; display:block; text-align:center; line-height:26px; border:1px solid #a112d9; color:#fff; font-size:0.75rem; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; background:#a112d9; }
.albumblock .agrids .btnbox .btns .btn .fa{ color:#fff; }
.albumblock .agrids .btnbox .btns .btn.del{ color:#dc4747; border-color:#dc4747; background:none; }
.albumblock .agrids .btnbox .btns .btn.del .fa{ color:#dc4747; }

.album_de_block{ margin-left:-20px; display: flex; flex-wrap: wrap;  }
.album_de_block .agrids{ width:25%; padding:0 0 50px 20px; }
.album_de_block .agrids .imgbox{ display:block; width:100%; padding-bottom:100%; background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }
.album_de_block .agrids .btnbox{ display:flex; justify-content: center; margin-left:-10px; margin-top: 20px; }
.album_de_block .agrids .btnbox .btns{ width:50%; padding-left:10px; }
.album_de_block .agrids .btnbox .btns .btn{ width:100%; display:block; text-align:center; line-height:26px; border:1px solid #dc4747; color:#dc4747; font-size:0.75rem; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }
.album_de_block .agrids .btnbox .btns .fa{ color:#dc4747; }

/*產品詳細*/
.de_pro_block{ display:flex; margin-bottom:60px; }
.de_pro_block .imgbox{ max-width:552px; width:52%; }
.de_pro_block .imgbox .imgs{ width:100%; padding-bottom:100%; background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; }
.de_pro_block .textbox{ padding-left:40px; flex:1; }
.de_pro_block .textbox .h1{ font-size:1.5rem; font-weight:bold; margin-bottom:30px; }
.de_pro_block .textbox .top_box{ margin-bottom:25px; padding-bottom:25px; border-bottom:1px solid #ccc; }
.de_pro_block .textbox .bottom_box{ border-bottom:1px solid #ccc; padding-bottom:5px; margin-bottom:5px; }
.de_pro_block .textbox .list_s{ display:flex; margin-bottom:10px; }
.de_pro_block .textbox .list_s:last-child{ margin-bottom:0; }
.de_pro_block .textbox .list_s .title{ width:70px; color:#1c8ccc; line-height:21px; }
.de_pro_block .textbox .list_s .contTxt{ flex:1; padding:0 0 0 15px; line-height:21px; }
.de_pro_block .textbox .list_s .contTxt span{ color:#a112d9; font-weight:bold; }
.de_pro_block .textbox .pricing_s{ display:flex; justify-content:space-between; padding-top:10px; }
.de_pro_block .textbox .pricing_s .title{ color:#1c8ccc; line-height:21px; }
.de_pro_block .textbox .pricing_s .contTxt span{ color:#1c8ccc; font-weight:bold; font-size:1.5rem; }
.de_pro_block .textbox .hint{ color:#1c8ccc; }
.de_pro_block .textbox .buybtns{ padding:40px 0 0 0; display:flex; flex-wrap:wrap; }
.de_pro_block .textbox .buybtns .btns{ margin-right:12px; margin-bottom:10px; display:flex; align-items: center; line-height:48px; background-color:#d66dff; border:1px solid #d66dff; color:#fff; font-size:1.125rem; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; padding:0 20px; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }
.de_pro_block .textbox .buybtns .btns .icon{ width:24px; height:24px; background-image:url(../images/layout/icon_shopping.svg); background-size:24px; margin-right:5px; background-repeat:no-repeat; background-position:center; }
.de_pro_block .textbox .buybtns .btns.color01{ background-color:#a112d9; border-color:#a112d9; }
.de_pro_block .textbox .buybtns .btns.color02{ background-color:#fff; border-color:#a112d9; color:#a112d9; }
.de_pro_block .textbox .lineid{ background:#eee; border:1px solid #ccc; display:flex; align-items: center; padding:10px; margin-top:10px; }
.de_pro_block .textbox .lineid .title{ color:#00e716; margin-right:15px; font-weight: bold; }
.de_pro_block .textbox .lineid .text{ color:#333; }

.de_sort{ position: relative; border-bottom:1px solid #ccc;  width:100%; }
.de_sort .whauto{ width:100%; overflow:auto; font-size:0; padding: 0 50px; }
.de_sort .grids{ display:inline-block; vertical-align:middle; line-height:50px; padding:0 30px; border-bottom:3px solid #fff; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }
.de_sort .grids.hold{ border-color:#1c8ccc; color:#1c8ccc; font-weight:bold; }

.de_sort .de_tab_left,
.de_sort .de_tab_right { position: absolute; top: 50%; transform: translateY(-50%); }
.de_sort .de_tab_left { left: 5px; }
.de_sort .de_tab_right { right: 5px; }

.de_sort .nomore { cursor: not-allowed; }
.de_sort .nomore img { opacity: 0; }

.de_contbox{ padding:40px 0 50px 0; border-bottom:1px solid #ccc; }
.de_contbox .textblock{ width:100%; line-height:1.6; }

.de_contbox .textblock *{ font-weight:revert; font-size:inherit; color: revert; }
.de_contbox .textblock a{ color: #ef6565; text-decoration: underline; }
.de_contbox .textblock ul,.de_contbox .textblock ol{ margin:0 0 0 25px; }
.de_contbox .textblock img{ max-width:100%; }

.de_contbox .textblock .blue{ color:#1c8ccc; font-weight:500; }

.de_mimgbox{ display:flex; flex-wrap:wrap; padding:60px 0 0 0; margin-left:-20px; }
.de_mimgbox .grids{ padding:0 0 20px 20px; width:25%; display:flex; }
.de_mimgbox .grids .gs{ width:100%; background: #f5f5f5; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; overflow:hidden; }
.de_mimgbox .grids .gs .imgs{ width:100%; padding-bottom:100%; background-repeat:no-repeat; background-position:center; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; }
.de_mimgbox .grids .gs .h3{ padding:15px 20px 20px 20px; }

.de_table{ display:table; width:100%; border-collapse:collapse; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; overflow: hidden; margin: 0 0 50px 0; }
.de_table .tr{ display:table-row; }
.de_table .th{ display:table-cell; vertical-align:middle; padding:10px; background:#a112d9; color:#fff; font-size:1rem; text-align:center; border-bottom:2px solid #fff; }
.de_table .th .sm{ font-size:0.75rem; color:#fff; }
.de_table .td{ display:table-cell; vertical-align:middle; padding:10px; background:#eee; color:#333; font-size:0.938rem; border-bottom:2px solid #fff; text-align:center; }
.de_table .td .stitle{ width:160px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:0.938rem; margin:auto; }
.de_table.sml{ margin:0 0 15px 0; }
.de_table.sml .th{ font-size:0.875rem; }
.de_table.sml .td{ font-size:0.813rem; }
.de_table .tr.total .td{ background:#ccc; }
.de_table .wh01{ width: 8.33333333%; }
.de_table .wh02{ width: 16.66666667%; }
.de_table .wh03{ width: 25%; }
.de_table .wh04{ width: 33.33333333%; }
.de_table .wh05{ width: 41.66666667%; }
.de_table .wh06{ width: 50%; }
.de_table .wh07{ width: 58.33333333%; }
.de_table .wh08{ width: 66.66666667%; }
.de_table .wh09{ width: 75%; }
.de_table .wh10{ width: 83.33333333%; }
.de_table .wh11{ width: 91.66666667%; }
.de_table .wh12{ width: 100%; }

.de_table .td a{ color:#1c8ccc; text-decoration:underline; font-size:0.938rem; }

.de_table .td .mark_red{ color:#F00; }
.de_table .td .mark_green{ color:#090; }

.de_table .td .imgbox{ width:80%; max-width:124px; margin:auto; }
.de_table .td .imgs{ width:100%; padding-bottom:100%; background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; }

.de_table .td .s_btn{ display:block; width:100%; background:#1c8ccc; font-size:0.875rem; color:#fff; padding:5px 0; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; margin:5px 0; text-decoration:none; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }

.de_txt{ color: #1c8ccc; font-size:0.875rem; }

.actualbox{ margin-top:40px; border:1px solid #ccc; padding:20px; }
.actualbox .span01{ font-size:0.875rem; color: #dc4747; }
.actualbox .span02{ font-size:1.5rem; font-weight:bold; color:#1c8ccc; }
.actualbox .span_title{ font-size:1rem; }
.actualbox .spanlist{ display:block; font-size:1rem; margin-bottom:5px; }
.actualbox .spanlist:first-child{ margin:0; }

/*頁碼*/
.page_number{ position:relative; text-align:center; }
.page_number .btn{ display:inline-block; min-width:30px; padding:0; background-color: #fff; line-height:30px; height:30px; font-size:14px; color:#555; border:1px solid #ccc; vertical-align:top; margin:0 2px; text-align:center;}
.page_number .btn.focus{ border:1px solid #0889ca; background-color:#0889ca; color:#fff; font-weight:bold;}
.page_number .btn .fa{ line-height:28px;}
.page_number .btn.looking{ color:#ccc; border-color:#ddd; cursor:not-allowed;}
.page_number .quantity{ font-size:12px; color:#555; position:absolute; top:0; right:6px; line-height:30px;}
.page_number .quantity .fa{ padding-right:5px;}

/*詩*/
.poetrybox{ display:flex; margin-left:-20px; padding-top:80px; padding-bottom:80px; flex-wrap:wrap; }
.poetrybox .grids{ padding:0 0 20px 20px; width:50%; display:flex; }
.poetrybox .grids.long{ width:100%; }
.poetrybox .grids .gs{ border:3px solid #eee; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; overflow:hidden; width:100%; }
.poetrybox .grids .gs .title{ position:relative; padding:20px 20px 70px 20px; color:#333; font-size:1.25rem; font-weight:700; overflow:hidden;
background: #43cdee; 
background: -moz-linear-gradient(left,  #43cdee 0%, #a803d7 100%); 
background: -webkit-linear-gradient(left,  #43cdee 0%,#a803d7 100%); 
background: linear-gradient(to right,  #43cdee 0%,#a803d7 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#43cdee', endColorstr='#a803d7',GradientType=1 );  }
.poetrybox .grids .gs .title span{ color:#333; padding:0 0 0 10px; font-weight:500; }
.poetrybox .grids .gs .title:after{ content:""; display:block; position:absolute; background:#fff; left:0; right:-3px; margin:auto; bottom:-30px; height:60px; transform: rotate(-3deg); }
.poetrybox .grids .gs .contbox{ background:#fff; position:relative; padding:5px 15px 30px 15px; text-align:center; font-size:0.875rem; line-height:1.6; }

/*開通碼畫面*/
.activblock{ max-width:600px; margin:auto; padding:20px; }
.activblock .range{ border:2px solid #ccc; border-radius:15px; overflow:hidden; }
.activblock .range .title{ background:#eee; padding:10px 15px; display:flex; justify-content:space-between; }
.activblock .range .title .h1{ font-weight:bold; font-size:1.125rem; }
.activblock .range .title .btnbox{ padding:0 0 0 10px; }
.activblock .range .title .btn{ display:inline-block; padding:0 10px; line-height:32px; background: #a112d9; color:#fff; font-size:0.875rem; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; }
.activblock .range .contbox{ padding:5px 15px 5px; }
.activblock .range .contbox .list{ display:flex; width:100%; margin-bottom:5px; border-bottom:1px dashed #ccc; padding:0 0 5px 0; }
.activblock .range .contbox .list:last-child{ margin:0; border:none; padding:0; }
.activblock .range .contbox .list .h4{ width:110px; line-height:36px; font-size:1rem; font-weight:bold; color:#333; }
.activblock .range .contbox .list .ps{ flex:1; padding:0 0 0 15px;  }
.activblock .range .contbox .list .ps .wlex{ display:block; }
.activblock .range .contbox .list .ps .w1{ flex:1; }
.activblock .range .contbox .list .ps .w2{ width:100px; padding:5px 0 0 0; }
.activblock .range .contbox .list .ps .w2:first-child{ padding:0; }
.activblock .range .contbox .list .ps .wlex.wlex_paste{ display:flex; flex-direction:row; }
.activblock .range .contbox .list .ps .wlex.wlex_paste .w1{ padding-left:5px; }
.activblock .range .contbox .list .ps .wlex.wlex_paste .w2{ padding:0; }

.activblock .range .contbox .list .ps .input{ width: 100%; line-height: 36px; height: 36px; border: 1px solid #ccc; background: #fff; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; text-indent: 15px; }
.activblock .range .contbox .list .ps .btns{ display:block; width:100%; padding:0 10px; line-height:36px; background:#1c8ccc; color:#fff; font-size:0.875rem; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; text-align:center; }
.activblock .range .contbox .list .ps .txt{ line-height:36px; font-size:1rem; }

.activblock .range .contbox .list .ps .filesty{ position:relative; }
.activblock .range .contbox .list .ps .filesty .input{ height: 100px; opacity: 0; position:relative; z-index:50; }
.activblock .range .contbox .list .ps .filesty .gray{ background:#eee; position:absolute; top:0; left:0; bottom:0; right:0; margin:auto; z-index:1; display:flex; justify-content: center; align-items: center; }
.activblock .range .contbox .list .ps .filesty .gray .txt{ font-size:1rem; text-align:center; line-height: 100%; }
.activblock .range .contbox .list .ps .filesty .gray .txt span{ display:inline-block; font-size:1.5rem; padding:0 0 5px 0; }

/*================================●●●●●●●●●●●●Hover●●●●●●●●●●●●================================*/
@media screen and (min-width:1024px){
/*首頁*/
.prolistbox .progrids .sbg:hover{ transform:translateY(-5px); -webkit-transform:translateY(-5px); -moz-transform:translateY(-5px); box-shadow: 0 5px 10px rgba(0,0,0,0.2); }
	
/**/	
.blockbox .leftbox .menulist .m_box .m_list:hover{ color:#1c8ccc; }

.searchblock .grids .btn:hover{ opacity:0.7; }

.sort_block .s_left .s_btn:hover{ color:#1c8ccc; border-color:#1c8ccc; }
.sort_block .s_left .s_btn.hold{ color:#fff; }

.sort_block .s_right .btns:hover{ background:#1c8ccc; color:#fff; }
.sort_block .s_right .btns:hover .fa{ color:#fff; }

.member_data_box .member_text .btnbox .btns .btn:hover{ opacity:0.7; }

/*老師文章*/
.teacherbox .grids .gs:hover{ opacity:0.7; }

/*註冊*/
.formbtn .btns:hover{ opacity:0.7; }
.formH1_block .f_right .btns:hover{ background:#1c8ccc; color:#fff; }
.formH1_block .f_right .btns:hover .fa{ color:#fff; }

.form_Text .f_btn .btns:hover{ background:#a112d9; color:#fff; }
.form_Text .f_btn .btns:hover .fa{ color:#fff; }

.formbox .f_grids .inputbox .btn_del:hover{ background:#dc4747; color:#fff; }
.formbox .f_grids .inputbox .btn_del:hover .fa{ color:#fff; }

/*我已購買*/
.oldbuy .oldbuy_list:hover{ background:#f8f8f8; }
.oldbuy .oldbuy_list:hover .otitle{ opacity:0.7; border-bottom: 1px solid #ddd; }

.receipts .btn:hover{ opacity:0.7; }
.tobuybox .tobuylist .flex_s .flexlist .ptxt a.btns:hover{ opacity:0.7; }

/*機碼開通*/
.keycode .grids .g_btn:hover{ opacity:0.7; }
.keycode .grids .g_list .downbtn:hover{ opacity:0.7; }

/*產品詳細*/
.de_sort .grids:hover{ color: #1c8ccc; }
.de_pro_block .textbox .buybtns .btns:hover{ opacity:0.7; }

/*社區留言版*/
.release .rebtns .btns:hover{ opacity:0.7; }
.messagebox .meslist .replybox .re_flex .btns:hover{ opacity:0.7; }

/*我的好友*/
.myfriend .grids:hover .imgs{ opacity: 0.7; }
.myfriend .grids .btns .btn:hover{ background:#dc4747; color:#fff; opacity: 1; }
.myfriend .grids .btns .btn:hover .fa{ color:#fff; }

.myfriend .grids .btns .btn.send:hover{ background: #a112d9; color:#fcee21; }
.myfriend .grids .btns .btn.send:hover .fa{ color:#fcee21; }

/*相簿*/
.albumblock .agrids .gs:hover{ transform: translateY(-5px); -webkit-transform: translateY(-5px); -moz-transform: translateY(-5px); box-shadow: 0 5px 10px rgba(0,0,0,0.2); background: #f8f8f8; }

.album_de_block .agrids .imgbox:hover{ opacity: 0.7; }
.album_de_block .agrids .btnbox .btns .btn:hover{ background:#dc4747; color:#fff; }

/*產品詳細*/
.de_table .td .s_btn:hover{ opacity: 0.7; }

}


/*================================●●●●●●●●●●●●平板●●●●●●●●●●●●================================*/
@media screen and (max-width:1160px){
/*首頁*/
.prolistbox .progrids{ width:33.333334%; }

/*老師文章*/
.teacherbox .grids{ width:25%; }

/*我已購買*/
.tobuybox .tobuylist .imgs{ width:120px }

/*相簿*/
.albumblock .agrids{ width:33.33334%; }

/*商品詳細*/
.de_mimgbox .grids{ width:33.333334%; }

}

@media screen and (min-width:768px) and (max-width:1023px){
/*首頁*/
.banner{ margin-top: 70px; }
.banner .imgbox{ padding:0; }

.blockbox .rightbox{ padding: 0 0 0 50px; }

.prolistbox .progrids{ width:33.333334%; }

.poetrybox .grids{ width:100%; }
.poetrybox .grids .gs .title{ padding: 20px 20px 40px 20px; }
.poetrybox .grids .gs .title:after{ height: 40px; bottom: -20px; }

/*內頁*/
.page_title{ margin-top:70px; }

.sort_block .s_left .s_btn{ line-height:36px; padding:0 20px; }

/*老師文章*/
.teacherbox .grids{ width:33.33334%; }

/*社區留言板*/
.release .rebox{ display: block; }
.release .rebox .re_Text{ padding:0 0 20px 0; }
.release .rebox .re_Text .areaText{ height:120px; }
.release .rebox .re_down{ width:100%; }


/*我已購買*/
.totalbox .grids .title{ padding:0 10px 0 15px; font-size:0.875rem; }
.totalbox .grids .tsbox{ padding:0 0 0 10px; font-size:0.875rem; }
.totalbox .grids .tsbox span{ font-size:0.75rem; }

.oldbuy .oldbuy_list .obox .ogrid .g1{ font-size:0.875rem; }
.oldbuy .oldbuy_list .obox .ogrid .g2{ font-size:0.875rem; }
.oldbuy .oldbuy_list .obox .ogrid .g2 .nametitle{ font-size:0.875rem; }

.tobuybox .tobuylist{ flex-wrap:wrap; padding:0; overflow:hidden; }
.tobuybox .tobuylist .img_box{ width:100%; padding: 20px 0 20px 0; background:#eee; }
.tobuybox .tobuylist .imgs{ margin:auto; }
.tobuybox .tobuylist .flex_s{ margin:0; flex: inherit; width:50%; padding: 15px 20px 0 20px; border:none; }
.tobuybox .tobuylist .flex_s:last-child{ border-left:2px solid #e8e8e8; }
.tobuybox .tobuylist .flex_s .flexlist .h2{ font-size:0.875rem; }
.tobuybox .tobuylist .flex_s .flexlist .ptxt{ font-size:0.875rem; }
.tobuybox .tobuylist .flex_s .flexlist .ptxt a.link{ font-size:0.875rem; }

/*我的好友*/
.myfriend .grids{ width:33.333334%; }

/*相簿*/
.albumblock .agrids{ width:50%; }

.album_de_block .agrids{ width:33.33334%; }

/*商品詳細*/
.de_mimgbox .grids{ width:50%; }

.de_table{ display:block; border-radius:0; -webkit-border-radius:0; -moz-border-radius:0; margin: 0 0 30px 0; }
.de_table .tr.disnone{ display:none; }
.de_table .tr{ display:block; margin: 0 0 20px 0; }
.de_table .tr:before{ content:""; display:block; width:100%; height:3px; background:#1c8ccc; }
.de_table .td{ display:flex; flex-wrap: wrap; font-size:1rem; text-align: left; position: relative; padding: 10px 10px 10px 130px; min-height: 46px; }
.de_table .td:before{ content:attr(data-title); min-width:100px; max-width:150px; font-size:1rem; font-weight:bold; color:#1c8ccc; padding: 0; position: absolute; left: 10px;}
.de_table .td .stitle{ width:100%; }

.de_table.sml .td{ font-size:1rem; }

.de_table .td .imgbox{ margin:0; }
.de_table .td .s_box{ width:100%; }
.de_table .td .s_btn{ text-align:center; display:inline-block; vertical-align:middle; margin:5px; width:auto; padding:5px 15px; }

}

@media screen and (min-width:768px) and (max-width:900px){
/*首頁*/
.prolistbox .progrids{ width:50%; }

/*註冊*/
.formbox .f_grids.pad_wh01{ width:100%; }

.formbox .f_grids .inputbox .wh04{ width:120px; }

/*我已購買*/
.totalbox{ padding:10px; }
.totalbox .grids{ width:100%; }
.total_block .t_grids{ padding:10px 0; }

.oldbuy .oldbuy_list .obox .ogrid{ width:100%; }

/*機碼開通*/
.keycode .grids{ width:100%; }

/*產品詳細*/
.de_pro_block{ display:block; }
.de_pro_block .imgbox{ width:100%; max-width:none; }
.de_pro_block .textbox{ padding:20px 0 0 0; }



/*我的好友*/
.myfriend .grids{ width:50%; } 

}


/*================================●●●●●●●●●●●●手機●●●●●●●●●●●●================================*/
@media screen and (max-width:767px){
.banner{ margin-top:60px; }
.banner .imgbox{ padding:0; }
.banner .imgbox .pc_img{ display:none; }
.banner .imgbox .mob_img{ display:block; }

.nav{ padding:15px; }
.nav .onediv{ font-size:0.75rem; }
.nav .twodiv{ font-size:0.75rem; }

/*首頁*/
.blockbox{ display:block; }
.blockbox .leftbox{ width:auto; }
.blockbox .leftbox .menublock{ display:none; padding:50px 15px 15px 15px; position: fixed; top: 0; left: 0; right: 0; bottom: 0; margin: auto; background: #fff; z-index: 110; }
.blockbox .leftbox .m_ht{ height:100%; overflow:auto; }
.blockbox .leftbox .menulist .mtitle{ padding:15px; font-size:1rem; }
.blockbox .leftbox .menulist .mtitle span{ width:14px; height:14px; }
.blockbox .leftbox .menulist .mtitle span:before{ height:2px; width: 14px; }
.blockbox .leftbox .menulist .mtitle span:after{ width:2px; height:14px; }
.blockbox .leftbox .menulist .m_box .m_list{ padding:15px; font-size: 0.875rem; }
.blockbox .leftbox .closebtn{ display:block; position:absolute; top:15px; right:15px; width:24px; height:24px; transform:rotate(45deg); }
.blockbox .leftbox .closebtn:before{ content:""; position:absolute; top:0; left:0; bottom:0; right:0; margin:auto; display:block; width:24px; height:2px; background:#1c8ccc; }
.blockbox .leftbox .closebtn:after{ content:""; position:absolute; top:0; left:0; bottom:0; right:0; margin:auto; display:block; width:2px; height:24px; background:#1c8ccc; }

.blockbox .categories{ padding: 10px 0; cursor: pointer; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px; display:flex; justify-content:center; align-items:center;
background: #43cdee; 
background: -moz-linear-gradient(left,  #43cdee 0%, #a803d7 100%); 
background: -webkit-linear-gradient(left,  #43cdee 0%,#a803d7 100%); 
background: linear-gradient(to right,  #43cdee 0%,#a803d7 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#43cdee', endColorstr='#a803d7',GradientType=1 ); }
.blockbox .categories .icons{ width:24px; height:18px; background-image:url(../images/page/icon_search_sort.svg); background-position:center; background-repeat:no-repeat; background-size:24px; }
.blockbox .categories .text{ font-size:1rem; color:#fff; padding:0 0 0 5px; }

.blockbox .sorbox{ flex-wrap: wrap; margin-bottom: 30px; border-radius:0; -webkit-border-radius:0; -moz-border-radius:0; background:none; }
.blockbox .sorbox .sortleft{ width:100%; background: #eee; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; overflow:hidden; } 
.blockbox .sorbox .sortleft .grids{ width: 50%; justify-content: center; border-right: 1px solid #dbdbdb; }
.blockbox .sorbox .sortleft .grids:last-child{ border-right:none; }
.blockbox .sorbox .sortright{ padding:10px; width: 100%; text-align:right; background: #fff; font-size: 0.75rem; padding:5px 0 0 0; }

.blockbox .rightbox{ padding:40px 0 0 0; max-width: none; }

.prolistbox{ margin-bottom:20px; }
.prolistbox .progrids{ width:100%; padding:0 0 0 20px; }
.prolistbox .progrids .sbg{ padding-left:140px; padding-bottom:30px; background:none; overflow:inherit; border-radius:0; -webkit-border-radius:0; -moz-border-radius:0; }
.prolistbox .progrids .imgs{ width:120px; padding-bottom:120px; position:absolute; top:0; left:0; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; }
.prolistbox .progrids .textbox{ padding:0 0 15px 0; }
.prolistbox .progrids .textbox .h1{ margin-bottom:5px; }
.prolistbox .progrids .btn_s{ display:flex; justify-content:flex-end; }
.prolistbox .progrids .btn01{ position:static; margin-left:10px; }
.prolistbox .progrids .btn02{ position:static; }

.poetrybox{ padding-bottom:40px; padding-top: 60px; }
.poetrybox .grids{ width:100%; }
.poetrybox .grids .gs .title{ padding: 20px 20px 40px 20px; font-size:1rem; }
.poetrybox .grids .gs .title:after{ height: 40px; bottom: -20px; }
.poetrybox .grids .gs .title span{ font-size: 0.875rem; }
.poetrybox .grids .gs .contbox{ font-size:0.75rem; padding: 5px 15px 20px 15px; }

/*內頁*/
.page_title{ margin-top:60px; font-size: 1.5rem; padding: 50px 15px 20px 15px; }

.searchblock{ margin-left:-5px; }
.searchblock .grids{ padding:0 0 5px 5px; }
.searchblock .grids .h2{ font-size:0.813rem; }
.searchblock .grids .ptxt{ font-size:0.813rem; }
.searchblock .grids.wt00{ width:100%; }
.searchblock .grids.wt01{ width:110px; }
.searchblock .grids.wt02{ width:100%; }
.searchblock .grids.wt03{ width:50%; }
.searchblock .grids .input{ font-size:0.813rem; text-indent: 5px; }
.searchblock .grids .date .icon{ width:14px; height:14px; line-height:14px; font-size:0.875rem; }

.searchblock .outside_s.mob{ width:100%; }

.sort_block{ display:block; margin-bottom: 10px; }
.sort_block .s_left{ margin-bottom:10px; margin-left:-10px; }
.sort_block .s_left .s_grids{ width:33.333334%; margin:0; padding-left:10px; }
.sort_block .s_left .s_btn{ text-align:center; padding: 0 10px; }
.sort_block .s_right{ width:100%; text-align:right; }
.sort_block .s_right .btns{ display:inline-block; }

.sort_Text{ margin-bottom:10px; }


/*老師文章*/
.teacherbox{ margin-left:-15px; }
.teacherbox .grids{ width:50%; padding-left:15px; padding-bottom:30px; }
.teacherbox .grids .gs .name_s{ font-size:1rem; padding: 5px 10px; }
.teacherbox .grids .gs .textbox{ padding:15px 10px; }
.teacherbox .grids .gs .textbox .list{ display:block; }
.teacherbox .grids .gs .textbox .list .h2{ font-size:0.875rem; padding:0; }
.teacherbox .grids .gs .textbox .list .h3{ font-size:0.875rem; padding:0; }

/*註冊*/
.fromH1.title.marbotm{ margin-bottom:15px; } 

.formbox .f_grids{ width:100%; }
.formbox .f_grids .inputbox label{ font-size:0.875rem; margin: 5px 0; display: block; }
.formbox .f_grids .inputbox .input{ line-height: 32px; font-size: 0.875rem; text-indent: 10px; }
.formbox .f_grids .inputbox .wh02{ width:100px; }
.formbox .f_grids .inputbox .wh03{ width:44px; padding:0; }
.formbox .f_grids .inputbox .wh04{ width:33.3334%; } 
.formbox .f_grids .inputbox .rebtn { width: 34px; height: 34px; line-height: 36px; }
.formbox .f_grids .inputbox .rebtn .fa{ font-size:1rem; }
.formbox .f_grids .inputbox .i_txt{ font-size:0.875rem; }

.formbox .f_grids .inputbox .chexs{ display:block; padding-bottom: 15px; }
.formbox .f_grids .inputbox .chexs .c_1{ padding:0 0 5px 0; }
.formbox .f_grids .inputbox .chexs .c_2 .flexs .ftxt_2{ font-size:0.875rem; }

.formbtn .btns{ font-size:1rem; margin:5px; }

/*忘記密碼*/
.m_formbox .m_list .m_flex .f2{ width:100px; }
.m_formbox .m_list .m_flex .f3{ width:44px; padding: 0; }
.m_formbox .m_list .m_flex .rebtn{ width: 34px; height: 34px; line-height: 36px; }
.m_formbox .m_list .m_flex .rebtn .fa{ font-size:1rem; }
.m_formbox .m_list .m_flex .input{ line-height: 32px; font-size: 0.875rem; text-indent: 10px; }
.m_formbox .m_list .m_flex .i_txt { line-height: 1.6; font-size: 1rem; color: #333; background: #eee; padding: 6px 10px; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px;}

/*購物車*/
.stepbox{ margin-bottom:20px; }
.stepbox .arrow{ display:none; }
.stepbox .grids{ display:none; }
.stepbox .grids.hold{ display:block; }

.buy_box .pins{ padding:15px; }

.buy_box .table{ display:block; }
.buy_box .table .tr{ display:block; position: relative; border-bottom: 1px solid #ccc; padding-bottom:15px; margin-bottom:15px; min-height:130px; }
.buy_box .table .tr.mobnone{ display:none; }
.buy_box .table .tr:after{ content:""; display:block; width:100%; }
.buy_box .table .td{ display:block; padding:5px; border:none; margin-left:110px; font-size:0.875rem; }
.buy_box .table .td.img{ width:110px; float:left; margin: auto; }
.buy_box .table .td.title{ font-size:0.938rem; }
.buy_box .table .td.del{ position: absolute; bottom:10px; right: 0; }

.buy_box .h_title{ font-size:1.125rem; }
.buy_box .total_box{ display:block; }
.buy_box .total_box .picbox{ padding:0 0 20px 0; border:none; display:block; }
.buy_box .total_box .picbox .y1{ padding:0; margin-bottom:5px; }
.buy_box .total_box .picbox .y2{ text-align:left; }
.buy_box .total_box .btnbox{ margin:0; text-align:center; }
.buy_box .point_box .lists .blues{ display:inline-block; }
.buy_box .point_box .lists .input{ width:80px; }

.buy_box .total_box_two .total_list{ display:block; }
.buy_box .total_box_two .total_list .h1{ color:#999; }
.buy_box .total_box_two .total_list .h2{ width:100%; text-align:left; }

.buy_box .labbox{ display:block; }
.buy_box .labbox .grids{ line-height:1.8; }

.buyTextbox{ padding:15px; }
.buyTextbox .iconbox{ width:120px; }

.stepblock .textblock .fimgs .fgrids{ margin-bottom:20px; }
.stepblock .textblock .fimgs .fgrids .fs{ width:96%; }

/*會員*/
.member_data_box{ display:flex; align-items:center; margin: 0 0 20px 0; }
.member_data_box .member_imgs{ width:120px; padding-bottom:120px; }
.member_data_box .member_text{ padding:0 0 0 15px; flex:1; }

/*社區留言板*/
.member_data_box .member_text .list{ flex-wrap:wrap; }
.member_data_box .member_text .list .p1{ font-size:1.125rem; margin-left: 5px; }
.member_data_box .member_text .list .p2{ font-size:0.75rem; margin-left: 5px; }
.member_data_box .member_text .list .p3{ margin-left: 5px; font-size: 1.25rem; }
.member_data_box .member_text .list .p3 span{ font-size:0.875rem; }
.member_data_box .member_text .btnbox{ padding:0; justify-content: flex-start; margin-left:-5px; }
.member_data_box .member_text .btnbox .btns{ max-width:100px; padding:0 0 5px 5px; }
.member_data_box .member_text .btnbox .btns .btn{ font-size:0.75rem; }

.messagebox .t_flex .opbox .ops{ width:75px; }
.messagebox .t_flex .opbox .ops .input{ text-indent: 5px; }


.release .rebox{ display: block; }
.release .rebox .re_Text{ padding:0 0 20px 0; }
.release .rebox .re_Text .areaText{ height:120px; }
.release .rebox .re_down{ width:100%; }
.release .rebox .re_down .downbtn .text{ font-size:0.75rem; }

.release .h1{ font-size:1.125rem; margin-bottom: 10px; }
.release .rebtns .btns{ font-size:1rem; height:42px; line-height:42px; padding:0 25px; }
.release .rebtns{ padding:20px 0 0 0; }


.messagebox .meslist .infos .imgbox{ width:90px; }
.messagebox .meslist .infos .textbox .one_list{ display:block; }
.messagebox .meslist .infos .textbox .one_list .dates{ padding:10px 0 0 0; }
.messagebox .meslist .infos .textbox .two_list{ font-size:0.875rem; }
.messagebox .meslist .infos .textbox .three_list .imgs{ width:100px; height:100px; }

.messagebox .meslist .replybox{ padding:15px; }
.messagebox .meslist .replybox .re_flex{ flex-wrap:wrap; }
.messagebox .meslist .replybox .re_flex .v_1{ order:2; padding:10px 0 0 0; justify-content: space-between; }
.messagebox .meslist .replybox .re_flex .v_1 .v_txt{ font-size:0.75rem; }
.messagebox .meslist .replybox .re_flex .v_1 .v_txt span{ font-size:0.75rem; }
.messagebox .meslist .replybox .re_flex .v_1 .v_btn{ font-size: 0.875rem; }
.messagebox .meslist .replybox .re_flex .v_2{ order:1; width:100%; }
.messagebox .meslist .replybox .re_flex .btns{ font-size:0.875rem; }

.messagebox .meslist .replybox .m_res .infos .imgbox{ width:50px; }
.messagebox .meslist .replybox .m_res .infos .imgbox .imgs{ background-size:20px; }
.messagebox .meslist .replybox .m_res .infos .textbox{ padding:0 0 0 10px; }

.messagebox .meslist .replybox .noreText{ font-size:1rem; }

.messagebox .morebtn .btns{ line-height:36px; height:36px; padding:0 25px; font-size:1rem; }

/*我已購買*/
.totalbox{ padding:10px; }
.totalbox .grids{ width:100%; }
.totalbox .grids .title{ padding:0 10px 0 15px; font-size:0.875rem; }
.totalbox .grids .tsbox{ padding:0 0 0 10px; font-size:0.875rem; }
.totalbox .grids .tsbox span{ font-size:0.75rem; }
.totalbox .grids .tsbox .link{ font-size:0.75rem; }
.total_block .t_grids{ padding:10px 0; }
.total_block .t_grids .pads{ padding: 0 10px 5px 10px; font-size: 0.875rem; display:block; }
.total_block .t_grids .sm{ font-size:1.125rem; }

.oldbuy .oldbuy_list .obox .ogrid{ width:100%; }
.oldbuy .oldbuy_list .obox .ogrid .g1{ font-size:0.875rem; }
.oldbuy .oldbuy_list .obox .ogrid .g2{ font-size:0.875rem; }
.oldbuy .oldbuy_list .obox .ogrid .g2 .nametitle{ font-size:0.875rem; }

.tobuybox .tobuylist{ display:block; margin-bottom: 20px; }
.tobuybox .tobuylist .img_box{ width:100%; padding: 0 0 15px 0; }
.tobuybox .tobuylist .imgs{ margin: auto; } 
.tobuybox .tobuylist .flex_s{ margin:auto; width:100%; padding:0; border:none; }
.tobuybox .tobuylist .flex_s .flexlist{ padding-top:10px; border-top:1px solid #ccc; } 
.tobuybox .tobuylist .flex_s .flexlist .h2{ font-size:0.875rem; }
.tobuybox .tobuylist .flex_s .flexlist .ptxt{ font-size:0.875rem; }
.tobuybox .tobuylist .flex_s .flexlist .ptxt a.link{ font-size:0.875rem; }



/*機碼開通*/
.keycode .grids{ width:100%; }
.keycode .grids .topbox .imgbox{ width:150px; }
.keycode .grids .topbox .textbox{ padding:0 0 0 20px; }
.keyText ul li{ font-size:0.938rem; }

/*我的好友*/
.quantity{ margin-bottom:15px; }
.myfriend{ margin-left:-15px; }
.myfriend .grids{ width:50%; padding-left:15px; margin-bottom:30px; }

/*相簿*/
.albumblock{ margin-left:-10px; }
.albumblock .agrids{ width:50%; padding: 0 0 30px 10px; }
.albumblock .agrids .datebox{ display:block; }
.albumblock .agrids .datebox .date{ padding:0; font-size:0.75rem; }
.albumblock .agrids .datebox .phos{ text-align:left; padding:0; font-size:0.75rem; }
.albumblock .agrids .btnbox{ display:block; }
.albumblock .agrids .btnbox .btns{ width:100%; margin-top:5px; }

.album_de_block .agrids{ width:50%; padding-bottom:30px; }

/*商品詳細*/
.de_pro_block{ display:block; margin-bottom: 40px; }
.de_pro_block .imgbox{ width:100%; max-width:none; }
.de_pro_block .textbox{ padding:20px 0 0 0; }
.de_pro_block .textbox .h1{ font-size:1.125rem; margin-bottom: 15px; }
.de_pro_block .textbox .top_box{ margin-bottom:15px; padding-bottom:15px; }
.de_pro_block .textbox .list_s{ margin-bottom:5px; }
.de_pro_block .textbox .list_s .title{ font-size:0.938rem; }
.de_pro_block .textbox .list_s .contTxt{ font-size:0.938rem; }
.de_pro_block .textbox .pricing_s .title{ font-size:0.938rem; }
.de_pro_block .textbox .pricing_s .contTxt{ font-size:0.938rem; }
.de_pro_block .textbox .hint{ font-size:0.875rem; }

.de_pro_block .textbox .buybtns{ margin-left:-10px; }
.de_pro_block .textbox .buybtns .btns{ margin-right:auto; margin-left:10px; padding: 0 10px; width: calc( 50% - 10px ); font-size:1rem; justify-content: center; }
.de_pro_block .textbox .buybtns .btns:last-child{ width: calc( 100% - 10px ); }

.de_sort .grids{ padding:0 15px; }

.de_mimgbox{ margin-left:-15px; }
.de_mimgbox .grids{ width:50%; padding-left:15px; }
.de_mimgbox .grids .gs{ border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; }
.de_mimgbox .grids .gs .h3{ padding:10px 15px 15px 15px; }

.de_table{ display:block; border-radius:0; -webkit-border-radius:0; -moz-border-radius:0; margin: 0 0 30px 0; }
.de_table .tr.disnone{ display:none; }
.de_table .tr{ display:block; margin: 0 0 20px 0; }
.de_table .tr:before{ content:""; display:block; width:100%; height:2px; background:#1c8ccc; }
.de_table .td{ display:flex; flex-wrap:wrap; font-size:0.875rem; text-align: left; padding: 10px 10px 10px 110px; position: relative; min-height: 42px; word-break: break-all; }
.de_table .td:before{ content:attr(data-title); min-width:80px; max-width:130px; font-size:0.875rem; font-weight:bold; color:#1c8ccc; padding:0; position: absolute; left: 10px; }
.de_table .td a{ font-size:0.875rem; }
.de_table .td .stitle{ width:100%; font-size:0.875rem; }
.de_table.sml{ margin:0; }
.de_table.sml .td{ font-size:0.875rem; }

.de_table .td .imgbox{ margin:0; }
.de_table .td .s_box{ width:100%; }
.de_table .td .s_btn{ text-align:center; display:inline-block; vertical-align:middle; margin: 0 3px 6px 0; font-size:0.75rem; width:auto; padding:5px 10px; }

.actualbox .spanlist{ margin-bottom:10px; }
.actualbox .span_title{ display:block; font-size:0.75rem; }

/*開通碼畫面*/
.activblock .range .contbox .list{ display:block; }
.activblock .range .contbox .list .ps{ padding:0; }

.activblock .range .contbox .list .h4{ width:auto; }

/*頁碼*/
.page_number .btn{ font-size:12px; min-width:26px; line-height:26px; height:26px; }

}