@charset "UTF-8";
/*----------reset css-----------*/
html { font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }

body { margin: 0; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }

a { background-color: transparent; }

a:active, a:hover { outline: 0; }

img { border: 0; }

button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; }

button { overflow: visible; }

button, select { text-transform: none; }

button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; }

button[disabled], html input[disabled] { cursor: default; }

button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

input { line-height: normal; }

input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; }

input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; }

input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }

input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

textarea { overflow: auto; }

table { border-collapse: collapse; border-spacing: 0; }

td, th { padding: 0; }

ul, ol, dl, h1, h2, h3, h4, h5, h6, p, figure { padding: 0; margin: 0; }

textarea { resize: none; }

/*-------------------basic scss---------------------*/
* {-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;}

a { text-decoration: none; color: inherit; -moz-transition: all 0.3s; -o-transition: all 0.3s; -webkit-transition: all 0.3s; transition: all 0.3s; }

a:active, a:focus { text-decoration: none; }

::-webkit-input-placeholder { color: #999999; }

::-moz-placeholder { color: #999999; }

/* firefox 19+ */
:-ms-input-placeholder { color: #999999; }

/* ie */
input:-moz-placeholder { color: #999999; }

/*反白文字*/
::selection { background: #1db1b3; color: white; }

::-moz-selection { background: #1db1b3; color: white; }

.clearfloat { clear: both; height: 0; font-size: 1px; line-height: 0px; }

.floatleft { float: left; }

.floatright { float: right; }

.textEllipsis { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; width: 100%; display: block; }

.vermid { vertical-align: middle; display: inline-block; }

.video-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; }

.video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.red { color: #cc0000; }

.fontsize12 { font-size: 12px; }

/*-------------------common css-----------------*/
body {font-size: 15px;color: #222222;font-family: Microsoft JhengHei, "Arial", sans-serif, Helvetica, Arial, PMingLiU;line-height: 1.7;font-weight: normal;letter-spacing: 0.025em;width: 100%;overflow-x: hidden;margin: 0 auto;}

.wrapper {max-width: 1170px;width: 100%;margin: 0 auto;position: relative;/* -webkit-box-shadow: 0px 6px 7px 2px rgba(0, 0, 0, 0.37); */-moz-box-shadow: 0px 6px 7px 2px rgba(0, 0, 0, 0.37);/* box-shadow: 0px 6px 7px 2px rgba(0, 0, 0, 0.37); */-moz-transition: all 0.3s;-o-transition: all 0.3s;-webkit-transition: all 0.3s;transition: all 0.3s;}

.bluecolor { color: #78c5e8; }

.textunderline { text-decoration: underline; }

/*------------------Header--------------------*/
header .headerright .headertop .socialicons ul, footer .footertop .socialicons ul { padding-right: 2px; }
header .headerright .headertop .socialicons ul:after, footer .footertop .socialicons ul:after { content: ''; display: block; clear: both; }
header .headerright .headertop .socialicons ul li, footer .footertop .socialicons ul li { float: left; list-style: none; padding: 0 3px; }
header .headerright .headertop .socialicons ul li a, footer .footertop .socialicons ul li a { background: #d2d2d2; border-radius: 100%; width: 32px; height: 32px; text-align: center; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; }
header .headerright .headertop .socialicons ul li a.fbiconh:hover, footer .footertop .socialicons ul li a.fbiconh:hover { background: #365899; }
header .headerright .headertop .socialicons ul li a.youtubeiconh:hover, footer .footertop .socialicons ul li a.youtubeiconh:hover { background: #e62d28; }
header .headerright .headertop .socialicons ul li a.rssiconh:hover, footer .footertop .socialicons ul li a.rssiconh:hover { background: #fa9d39; }
header .headerright .headertop .socialicons ul li a i, footer .footertop .socialicons ul li a i { color: #ffffff; font-size: 19px; }

header .logo a, footer .footerbot .box1.logo a { display: block; background: url(../images/logo.png) no-repeat center center; background-size: 100%; width: 334px; height: 109px; overflow: hidden; white-space: nowrap; text-indent: 100%; }

header { padding: 10px 30px 0 30px; }
header .logo { margin-top: 24px; float: left; }
header .headerright { float: right; width: 66%; }
header .headerright .headertop { margin-bottom: 15px; float: right; }
header .headerright .headertop:after {
    content:'';
	display:block;
	clear: both; }
header .headerright .headertop nav.smallmenu { float: left; }
.carNum {
    height: 23px;
    width: 23px;
    line-height: 23px;
    color: #fff;
    font-size: 12px;
    border-radius: 23px;
    background: #f39925;
    text-align: center;
    margin: -3px 0 0 0;
    display: inline-block;
}
header .headerright .headertop nav.smallmenu ul:after { content: ''; display: block; clear: both; }
header .headerright .headertop nav.smallmenu ul li { float: left; list-style: none; }
header .headerright .headertop nav.smallmenu ul li:after { content: "|"; display: inline-block; padding: 5px 10px; color: #c7c7c7; font-family: PMingLiU, sans-serif; }
header .headerright .headertop nav.smallmenu ul li a { font-size: 12px; color: #000000; }
header .headerright .headertop nav.smallmenu ul li a i { color: #aaa; font-size: 15px; }
header .headerright .headertop nav.smallmenu ul li a:hover i { color: #008dc6; }
header .headerright .headertop .socialicons { float: left; }
header .headerright .headertop .googlelang { float: left; padding: 3px 0px; }
header .headerright .headerbot .search { font-size: 12px; float: left; margin-top: 35px; }
header .headerright .headerbot .search .searchin { float: left; }
header .headerright .headerbot .search .searchin input[type="text"] { border: none; border-bottom: 1px solid #e5e5e5; width: 130px; padding: 6px 0; }
header .headerright .headerbot .search .searchin input[type="text"]:focus { outline: none; }
header .headerright .headerbot .search .searchin .searchsubmit { display: inline-block; position: relative; border-radius: 100%; width: 34px; height: 34px; background: #d2d2d2; -moz-transition: all 0.3s; -o-transition: all 0.3s; -webkit-transition: all 0.3s; transition: all 0.3s; }
header .headerright .headerbot .search .searchin .searchsubmit:hover { background: #008dc6; }
header .headerright .headerbot .search .searchin .searchsubmit input[type="submit"] { border-radius: 100%; width: 34px; height: 34px; background: transparent; border: none; text-indent: -9999px; position: relative; z-index: 999; }
header .headerright .headerbot .search .searchin .searchsubmit input[type="submit"]:focus { outline: none; }
header .headerright .headerbot .search .searchin .searchsubmit .searchbtn { color: white; font-size: 16px; display: inline-block; position: absolute; left: 50%; margin-left: -8px; top: 0; line-height: 34px; }
header .headerright .headerbot .search .hotkeytext { width: 200px; float: left; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; margin-top: 7px; margin-left: 10px; margin-right: 17px; }
header .headerright .headerbot .headerad { float: right; width: 330px; height: 70px; }
header .headerright .headerbot .headerad img { width: 100%; }

/*------------------Header END--------------------*/
/*------------------NAV 主選單--------------------*/
nav.mainmenu { background: #bfedfa; width: 100%; padding: 10px 30px; margin-top: -3px; }
nav.mainmenu > ul:after { content: ''; display: block; clear: both; }
nav.mainmenu > ul > li { position: relative; float: left; list-style: none; }
nav.mainmenu > ul > li:after {content: "|";display: inline-block;color: white;padding: 0 11.5px;font-family: PMingLiU, sans-serif;margin-left: -2px;}
nav.mainmenu > ul > li:last-child:after, nav.mainmenu > ul > li:nth-last-child(2):after, nav.mainmenu > ul > li:nth-last-child(3):after { content: initial; padding: 0; }
nav.mainmenu > ul > li .bigmenu { display: inline; }
nav.mainmenu > ul > li .bigmenu:after { display: none; content: ""; background: #ffffff; border: 3px solid #008dc6; border-bottom: none; position: absolute; width: 100%; height: 44px; top: -10px; left: -16px; z-index: 100000000; }
nav.mainmenu > ul > li .bigmenu a { color: #41474a; font-size: 16px; position: relative; z-index: 100000001; }
nav.mainmenu > ul > li:last-child .bigmenu a, nav.mainmenu > ul > li:nth-last-child(2) .bigmenu a { color: white; background: #008dc6; border-radius: 5px; padding: 5px 12px; margin-left: 14px; }

.submegamenu { width: 554px; position: absolute; left: -16px; border: 3px solid #008dc6; background: #ffffff; z-index: 9999999; padding: 20px; display: none; top: 34px; }
.submegamenu .submegamenuleft { float: left; width: 40%; padding: 0 20px 0 10px; }
.submegamenu .submegamenuleft ul.submenuul li { list-style: none; list-style: disc; border-bottom: 1px dotted #ababab; padding: 7px 0; list-style-position: inside; }
.submegamenu .submegamenuleft ul.submenuul li a:hover { color: #008dc6; }
.submegamenu .submegamenuright { float: left; width: 60%; padding: 0 10px; }
.submegamenu .submegamenuright .submenurphoto { width: 100%; }
.submegamenu .submegamenuright .submenurphoto img { width: 100%; }
.submegamenu .submegamenuright .submenurtext { font-size: 15px;  color: #008dc6; }
.submegamenu .submegamenuright .submenurtext a:hover {
    text-decoration: underline;
}

nav.mainmenu > ul > li:hover .bigmenu:after { display: block; }

nav.mainmenu > ul > li:hover:last-child .bigmenu:after { display: none; }

nav.mainmenu > ul > li:hover:nth-last-child(3) .bigmenu:after { width: 106px; }

nav.mainmenu > ul > li:hover .submegamenu { display: block; }

nav.mainmenu > ul > li:nth-child(7) .submegamenu, nav.mainmenu > ul > li:nth-child(8) .submegamenu, nav.mainmenu > ul > li:nth-child(9) .submegamenu { right: 10px; left: initial; }
nav.mainmenu > ul > li:nth-child(10) .submegamenu{ right: -14px; left: initial; }
nav.mainmenu > ul > li:nth-child(11) .submegamenu { right: 0px; left: initial; }
nav.mainmenu > ul > li:nth-child(11) .bigmenu:after{left: 12px; width: 53px}
nav.mainmenu > ul > li:nth-last-child(2):hover .bigmenu>a{
  background:none;
  color: black;
  border-radius: none;
}
.mobilemainmenu { display: none; }

/*------------------NAV 主選單 END--------------------*/
/*------------------FOOTER--------------------*/
footer { padding: 30px 30px 15px 30px; }
footer .footertop .leftbox { float: left; }
footer .footertop .leftbox .footernav ul:after { content: ''; display: block; clear: both; }
footer .footertop .leftbox .footernav ul li { list-style: none; float: left; }
footer .footertop .leftbox .footernav ul li:after { content: '|'; padding: 12px; font-size: 15px; font-family: PMingLiU, sans-serif; }
footer .footertop .leftbox .footernav ul li:last-child:after { content: initial; }
footer .footertop .socialicons { float: right; }
footer .footerbot { margin-top: 15px; }
footer .footerbot .box1.logo { float: left; margin-right: 15px; }
footer .footerbot .box1.logo a { width: 270px; height: 90px; background-size: 100%; }
footer .footerbot .box2 { float: left; font-size: 13px; line-height: 1.4; }
footer .footerbot .box3 { float: right; }
footer .footerbot .box3 .title { font-size: 16px; font-weight: bold; color: #008dc6; }
footer .footerbot .box3 .emailorderform input[type="text"] { border-radius: 5px 0 0 5px; border: 1px solid #008dc6; padding: 0px 15px; height: 34px; }
footer .footerbot .box3 .emailorderform input[type="text"]:focus { outline: none; }
footer .footerbot .box3 .emailorderform input[type="submit"] { color: white; border-radius: 0 5px 5px 0; border: none; padding: 0px 15px; background: #008dc6; height: 34px; }
footer .footerbot .box3 .emailorderform input[type="submit"]:focus { outline: none; }
footer .footerbot .box3 .copyright { text-align: right; font-size: 10px; color: #999999; margin-top: 15px; }

/*----------------FOOTER END-------------------*/
.mainsection { padding: 0 30px; }

.topad { margin-top: 15px; margin-bottom: 10px; }
.topad a { display: block; }
.topad a img { width: 100%; }

.indexbannersection {margin-bottom: 10px;padding: 10px 0px 0 0px;}
.indexbannersection .banner {float: left;width: 80%; position: relative;}
.indexbannerout{opacity: 0;}
.bannerloading{
  position: absolute;
  left: 50%;
  top: 50%;
  margin-top: -32px;
  margin-left: -32px;
}
.indexbannersection .magazine {float: right;width: 18%;}
.indexbannersection .magazine figure {width: 100%;margin-bottom: 9px;}
.indexbannersection .magazine figure img { width: 100%; display: block; }
.indexbannersection .magazine .buybtn .abuybtn {color: #008dc6;display: block;float: left;padding: 8px 15px;border: 2px solid #008dc6;font-size: 15px;width: 48%;text-align: center;}
.indexbannersection .magazine .buybtn .abuybtn:nth-child(2) {float: right;}
.indexbannersection .magazine .buybtn .abuybtn:hover { background: #008dc6; color: white; }

.bodyarticle {background: #f6f6f6;position: relative;}
.bodyarticle .leftbox {background: #f6f6f6;float: left;width: 71%;}
.bodyarticle .leftbox.indexleftbox { padding-top: 20px; }
.bodyarticle .leftbox .blocklist { margin-bottom: 20px; }
.bodyarticle .leftbox .blocklist .bigtitleout { padding: 0 25px; }
.bodyarticle .leftbox .blocklist.articleinblocklist .bigtitleout { padding: 0px; }

.bodyarticle .leftbox .blocklist .bigtitle { border-bottom: 5px solid #c5eaf4; width: 100%; line-height: 1.3; margin-bottom: 10px; }
.bodyarticle .leftbox .blocklist .bigtitle .tw { font-size: 18px; font-weight: bold; color: #333333; border-bottom: 5px solid #00b8ee; }
.bodyarticle .leftbox .blocklist .bigtitle .en {font-size: 16px;display: inline-block;margin-top: 5px;font-weight: bold;}
.bodyarticle .leftbox .figureset { padding: 0 15px; }
.bodyarticle .leftbox .articleinblocklist .figureset {
    padding: 0px;
}
.bodyarticle .leftbox .figureset .oneset {float: left;width: 33.33333%;padding: 0 10px;margin-bottom: 15px;}
.bodyarticle .leftbox .figureset .oneset .onesetin {background: #ffffff;position: relative;-webkit-box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.4);-moz-box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.4);box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.4);padding-bottom: 15px;}
.bodyarticle .leftbox .figureset .oneset figure {width: 100%;height: 129px;overflow: hidden;}
.bodyarticle .leftbox .figureset .oneset figure img {width: 100%;display: block;}
.bodyarticle .leftbox .figureset .oneset .textbox {padding: 10px 15px;height: 135px;overflow: hidden;}

.bodyarticle .leftbox .articleinblocklist .figureset .oneset .textbox {
    height: 60px;
    overflow: hidden;
}

.bodyarticle .leftbox .figureset .oneset .textbox h2.title {font-size: 17px;color: #008dc6;line-height: 1.4;margin-bottom: 0;}
.bodyarticle .leftbox .figureset .oneset .textbox h2.title:hover { text-decoration: underline; }
.bodyarticle .leftbox .figureset .oneset .textbox h2.title2 { font-size: 19px; color: #000379; text-align: center; }
.bodyarticle .leftbox .figureset .oneset .textbox .summary {color: #868686;font-size: 14px;line-height: 1.45;}
.bodyarticle .leftbox .bodycenterad { padding: 0px 25px; margin-bottom: 20px; }
.bodyarticle .leftbox .bodycenterad img { width: 100%; display: block; }
.bodyarticle .rightbox {background: #f0f0f0;float: left;width: 29%;/* position: relative; */padding-top: 25px;}
.bodyarticle .rightbox .sidead {overflow: hidden;max-width: 300px;width: 100%;margin: 0px auto;margin-bottom: 10px;/* height: 250px; */}
.bodyarticle .rightbox .sidead img { display: block; }
.bodyarticle .rightbox .sidearticlelist { max-width: 300px; background: white; margin: 10px auto; }
.bodyarticle .rightbox .sidearticlelist .title { font-size: 16px; padding: 10px 24px 5px 24px; position: relative; }
.bodyarticle .rightbox .sidearticlelist .title .clip { position: absolute; top: 3px; left: -5px; color: #999999; font-size: 23px; }
.bodyarticle .rightbox .sidearticlelist .title .tw { color: #008dc6; font-weight: bold; }
.bodyarticle .rightbox .sidearticlelist .title .en { color: #00b8ee; }
.bodyarticle .rightbox .sidearticlelist .sidearticleul .number { background: #008dc6; color: white; border-radius: 100%; width: 25px; height: 25px; line-height: 25px; display: inline-block; text-align: center; margin-right: 5px; }
.bodyarticle .rightbox .sidearticlelist .sidearticleul li { padding: 10px 20px; border-bottom: 1px dashed #979797; list-style: none; font-size: 15px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.bodyarticle .rightbox .sidearticlelist .sidearticleul li a:hover { color: #008dc6; }
.bodyarticle .rightbox2 { padding: 20px; background: #f6f6f6; }

a.fullblock { display: block; position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; }

/*-----單篇文章內頁-----*/
/*--路徑--*/
.pathroad { color: #666666; font-size: 14px; margin-left: 30px; margin-right: 30px; margin-bottom: 10px; padding-top: 20px; }

.whitebg { background: #fff; padding: 30px; margin: 0 30px 30px 30px; position: relative; min-height: 500px; -moz-box-shadow: 1px 3px 5px 2px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 1px 3px 5px 2px rgba(0, 0, 0, 0.1); box-shadow: 1px 3px 5px 2px rgba(0, 0, 0, 0.1); }
.whitebg .shareicon {
    position: initial;
    box-shadow: none;
    width: initial;
    text-align: left;
    padding: 0;
}
/*.whitebg .shareicon:before { content: ""; background: url(../images/shareicon.png) no-repeat; width: 54px; height: 12px; display: inline-block; position: absolute; top: -12px; left: 0px; }*/
.whitebg .shareicon a {display: inline-block;background: #c9c9c9;width: 38px;height: 38px;border-radius: 3px;color: white;line-height: 38px;text-align: center;font-size: 21px;margin: 5px 0;}
.whitebg .shareicon a.fbcolor{background: #365899}
.whitebg .shareicon a.googlecolor{background: #dd5044;}
.whitebg .shareicon a.linecolor{background: #00c402;}
.whitebg .shareicon a.sinacolor{background: #d52b2b;}
.whitebg .shareicon a.weixincolor{background: #12d41c;}
.whitebg .shareicon a:hover { background: #c9c9c9; }
.weixinbox{
    position: relative;
}
.weixinclickshow{
    display: none;
    position: absolute;
    top: 30px;
    left: 0;
    z-index: 999;
    border: 5px;
    border: 1px solid #ccc;
    padding: 30px;
    background: white;
    -webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.21);
    -moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.21);
    box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.21);
    min-width: 250px;
}
.weixinclose{
    color: #ccc;
    position: absolute;
    top: 0px;
    right: 10px;
    cursor: pointer;
    font-size: 20px;
}
.weixinpc{
  display: block;
}
.weixinmobile{
  display: none;
}
.textcenter{text-align: center;}
.whitebg .maintitle { color: #008dc6; font-size: 25px; font-weight: normal; float: left; line-height: 1.2; font-weight: bold;}
.articletitletop{border-bottom: 1px solid #e5e5e5; margin-bottom: 10px; }
.articletag{float: right; vertical-align: middle;}
.articletag img{display: inline;}
.whitebg .articletop { margin-bottom: 10px; }
.whitebg .articletop .articletopleft {font-size: 14px;float: left;margin-right: 14px;line-height: 1.6;color: #898989;}
.whitebg .articletop .articletopleft .sfont {font-size: 14px;}
.whitebg .articletop .articletopright {float: right;color: #787878;font-size: 14px;/* width: 133px; */}
.whitebg .articletop .articletopright a.marright {margin-right: 7px;float: left;}
.whitebg .articletop .articletopright i { color: #bababa; }
.whitebg .articletop .articletopright a.mylove.active i { color: red; }
.whitebg .articletop .articletopright .fontsize { background: #f0f0f0; padding: 3px 5px; }
.whitebg .articletop .articletopright .fontsize.active { background: #bfedfa; }
.whitebg .mainarticleimg { margin-bottom: 25px; }
.whitebg .mainarticleimg img { width: 100%; }
.whitebg .articletext {font-size: 16px;margin-bottom: 40px;}
.whitebg .articlekeyword { color: #7f7f7f; font-size: 14px; margin-bottom: 20px; }
.whitebg .bootmbox { color: #333333; font-size: 15px; border: 1px solid #dcdcdc; padding: 10px; text-align: center; border-radius: 5px; margin-bottom: 25px; }
.whitebg .articlead { margin-bottom: 30px; }
.whitebg .articlead .adleft { float: left; width: 50%; max-width: 336px; }
.whitebg .articlead .adleft img { width: 100%; }
.whitebg .articlead .adright { float: right; width: 50%; max-width: 336px; }
.whitebg .articlead .adright img { width: 100%; }
.whitebg .articenterbox .articenterboxin .title { font-size: 18px; font-weight: bold; color: #333333; border-bottom: 5px solid #ccf1fc; line-height: 23px; margin-bottom: 10px; }
.whitebg .articenterbox .articenterboxin .title .twbefore { border-bottom: 5px solid #00b8ee; }
.whitebg .articenterbox .articenterboxin .title .en { font-size: 16px; display: inline-block; margin-top: 5px; }
.whitebg .articenterbox .articenterboxin .articlelist { font-size: 14px; color: #008dc6; position: relative; }
.whitebg .articenterbox .articenterboxin .articlelist ul li { list-style: none; margin: 5px 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
img.discstyle{vertical-align: middle;}
.whitebg .articenterbox .articenterboxin .articlelist ul li a {line-height: 1.3;font-size: 16px;}
.whitebg .articenterbox .articenterboxin .articlelist ul li a:hover { text-decoration: underline; }
.whitebg .articenterbox .articenterboxleftbox { float: left; width: 50%; margin-bottom: 30px; padding-right: 20px; }
.whitebg .articenterbox .articenterboxrightbox { float: left; width: 50%; padding-left: 20px; }
.whitebg .articlebottombox a { position: absolute; width: 100%; height: 100%; top: 0; bottom: 0; display: block; }
.whitebg .articlebottombox .innertext { font-weight: bold; font-size: 18px; color: #008dc6; text-align: center; position: absolute; top: 50%; z-index: 9999; left: 50%; margin-top: -15px; margin-left: -36px; }
.whitebg .articlebottombox .articleftbox { float: left; width: 50%; max-width: 336px; position: relative; }
.whitebg .articlebottombox .articrightbox { float: right; width: 50%; max-width: 336px; position: relative; }
.whitebg .articlebottombox .bottomarti img { width: 100%; }

/*文章列表*/
.contentmaintitle {border-bottom: 6px #c5eaf4 solid;margin-right: 30px;margin-left: 30px;margin-bottom: 20px;line-height: 1.3;position: relative;}
.contentmaintitle .tw {font-size: 18px;font-weight: bold;border-bottom: 6px #00b8ee solid;}
.contentmaintitle .tw .columlisth1{font-size: 18px; display: inline;}
.contentmaintitle .tw .group2title{font-size: 18px;display: inline}
.contentmaintitle .tw.selectresult{font-weight: normal;}
.contentmaintitle .en { font-size: 16px; display: inline-block; margin-top: 5px; }
.booksearch { position: absolute; bottom: 6px; right: 0; }
.bookinsearch{padding: 0 10px 10px 30px;}
.booksearch .booksearchtext, .bookinsearch .booksearchtext {background: white;border: #cccccc 1px solid;width: 180px;height: 32px;font-size: 14px;padding: 0 5px;vertical-align: middle;}
.booksearch .booksearchinput { background: none; border: none; text-indent: -9999px; background: url(../images/searchicon.png) no-repeat; width: 15px; height: 15px; position: absolute; right: 8px; top: 9px; }
.bookinsearch .booksearchinput { background: none; border: none; text-indent: -9999px; background: url(../images/searchicon.png) no-repeat; width: 15px; height: 15px; position: relative; left: -27px; top: 6px;}
.booksearch .booksearchinput:focus { outline: none; }

.articlebox { margin-right: 30px; margin-left: 30px; }
.articlebox .articlelist { background: white; padding: 20px; margin-bottom: 15px; position: relative; -moz-box-shadow: 1px 3px 5px 2px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 1px 3px 5px 2px rgba(0, 0, 0, 0.1); box-shadow: 1px 3px 5px 2px rgba(0, 0, 0, 0.1); }
.articlebox .articlelist .articlephoto { float: left; width: 25%; padding-right: 15px; }
.articlebox .articlelist .articlephoto img { width: 100%; display: block; }
.articlebox .articlelist .articlerightcon { float: left; width: 75%; }
.articlebox .articlelist .articlerightcon .arrightcontitle h2 { font-size: 16px; color: #008dc6; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.articlebox .articlelist .articlerightcon .arrightcontitle h2 a:hover { text-decoration: underline; }
.articlebox .articlelist .articlerightcon .arightcontent {font-size: 15px;color: #868686;height: 70px;overflow: hidden;}
.articlebox .articlelist .articlerightcon .bottomdate {color: #b6b6b6;font-size: 12px;text-align: right;bottom: 15px;right: 20px;margin-top: 10px;/* position: absolute; */}
.mylovedelet{text-align: right;color: #a2a2a2;position: relative;z-index: 99999;}

/*頁數*/
.pagenumber { margin-top: 30px; margin-bottom: 30px; text-align: center; }
.pagenumber a.prepage { margin: 0 5px; }
.pagenumber a.number { background: #eaeaea; border-radius: 100%; color: #555555; text-align: center; width: 25px; height: 25px; margin: 0 5px; display: inline-block; }
.pagenumber a.number.active, .pagenumber a.number:hover { background: #008dc6; color: white; }
.pagenumber a.nextpage { margin: 0 5px; }

.mainconwrapper { margin: 20px 30px 30px 30px; }

.bookbanner a img { width: 100%; }

.magtitle { font-size: 18px; color: #008dc6; border-bottom: 6px solid #00b8ee; position: relative; margin-top: 20px; font-weight: bold; margin-bottom: 20px; }
.magtitlein{margin: 0px 30px}
.magtitle select {font-weight: normal;position: absolute;font-size: 14px;color: #000000;height: 32px;width: 100px;right: 0;bottom: 5px;border: 1px solid #ccc;}
.magtitle .allbook { font-weight: normal; position: absolute; font-size: 14px; color: #000000; right: 0; bottom: 0px; }

.bookblock .oneset {width: 24%;display: inline-block;padding-right: 10px;/* float: left; */margin-bottom: 20px;vertical-align: top;}
.sidearticlelist .bookblock .oneset {width: 100%;padding: 0 40px;margin-bottom: 10px;}
.bookblock .oneset .onesetin { background: white; padding: 20px; -moz-box-shadow: 1px 3px 5px 2px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 1px 3px 5px 2px rgba(0, 0, 0, 0.1); box-shadow: 1px 3px 5px 2px rgba(0, 0, 0, 0.1); }
.sidearticlelist .bookblock .oneset .onesetin {-moz-box-shadow: none;-webkit-box-shadow: none;box-shadow: none;border: 1px solid #ccc;padding: 30px 5px 5px 5px;}
.bookblock .oneset figure.bookfigure a img { width: 100%; }
.sidearticlelist .bookfigure{padding: 0 42px;}
.bookblock .oneset .booktitle {font-size: 16px;color: #008dc6;text-align: center;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;line-height: 1.3;}
.sidearticlelist .bookblock .oneset .booktitle {
    overflow: none;
    white-space: initial;
    text-overflow: initial;
}
.bookblock .oneset .outerlinestyle { font-size: 14px; text-align: center; border: 1px solid #ccc; border-radius: 5px; display: block; padding: 5px; }
.bookblock .oneset .outerlinestyle.mar10 { margin-bottom: 5px; }
.bookblock .oneset .outerlinestyle:hover { background: #008dc6; color: white; }
.pricecost{text-align: center;}
.pricecost .redcolor{text-align: center; color: red; font-weight: bold; font-size: 20px;}
.bookproducts .bookblock .oneset .booktitle {
    overflow: initial;
    white-space: initial;
    text-overflow: initial;
    line-height: 1.4;
}
.orderblock .oneset {width: 32%;display: inline-block;float: none;vertical-align: top;}
.orderblock .oneset .booktitle { font-size: 15px; color: #333333; text-align: left; height: 40px; overflow: hidden; white-space: initial; text-overflow: initial; line-height: 1.3; font-weight: bold; }
.orderblock .oneset .orderprice { font-size: 13.5px; }
.orderblock .oneset .orderprice .red { color: #ff0000; }
.orderblock .oneset .orderprice .big { font-size: 18px; }
.orderblock .oneset .outerlinestyle { font-size: 14px; text-align: left; border: none; border-radius: none; display: inline-block; padding-right: 5px; text-decoration: underline; color: #008dc6; }
.orderblock .oneset .outerlinestyle.mar10 { margin-bottom: 5px; }
.orderblock .oneset .outerlinestyle:hover { background: #008dc6; color: white; }
.booknum{
  background: #f2941a;
  display: inline-block;
  color: white;
  padding: 0 8px;
  position: absolute;
}

.bookclass { margin-bottom: 20px; }
.bookclass a { display: inline-block; padding: 5px 12px; margin-right: 3px; text-align: center; background: #999999; color: white; border-radius: 5px; }
.bookclass a.active, .bookclass a:hover { background: #008dc6; }

/*網路書店雜誌內頁*/
.bmtopbox .bmleftbox { float: left; width: 33.33333%; padding-right: 20px; }
.bmtopbox .bmleftbox figure { width: 100%; }
.bmtopbox .bmleftbox figure img { width: 100%; }
.bmtopbox .bmleftbox .keywordbm { color: #008dc6; font-size: 12px; }
.bmtopbox .bmleftbox .keywordbm .keywone a {display: inline-block;border: #ccc 1px solid;padding: 0 3px;margin-right: 4px;margin-bottom: 4px;}
.bmtopbox .bmleftbox .keywordbm .keywone a:hover { background: #008dc6; border: 1px solid #008dc6; color: white; }
.bmtopbox .bmrightbox { float: left; width: 66.66667%; }
.bmrightboxtop{height: 278px;overflow: hidden;margin-bottom: 10px;}
.bmrightboxtopmag{height: 252px;}
.bmtopbox .bmrightbox .bmsmalltop { font-size: 14px; color: #999999; }
.bmtopbox .bmrightbox .bmtitle { font-size: 24px; color: #008dc6; font-weight: bold; margin-bottom: 10px; line-height: 1.3; }
.bmtopbox .bmrightbox .bmlist {margin-bottom: 20px;}
.bmtopbox .bmrightbox .bmlist2 {margin-bottom: 20px;height: 200px;overflow: hidden;}
.bmtopbox .bmrightbox .bmlist2.bookbookin{height: 230px; }
.bmtopbox .bmrightbox .bmpricebot .bmpricebotleftbox {float: left;line-height: 1;padding-top: 22px;}
.bmtopbox .bmrightbox .bmpricebot .bmpricebotleftbox .topbox { color: #999999; font-size: 12px; text-decoration: line-through; }
.bmtopbox .bmrightbox .bmpricebot .bmpricebotleftbox .botbox .lowpricename { font-size: 14px; color: #333333; }
.bmtopbox .bmrightbox .bmpricebot .bmpricebotleftbox .botbox .lowpricename .red { color: #ff0000; font-family: "Arial"; font-weight: bold; }
.bmtopbox .bmrightbox .bmpricebot .bmpricebotleftbox .botbox .lowprice { color: #ff0000; font-size: 14px; }
.bmtopbox .bmrightbox .bmpricebot .bmpricebotleftbox .botbox .lowprice .morebig { font-size: 30px; font-family: "Arial"; font-weight: bold; }
.bmtopbox .bmrightbox .bmpricebot .bmpricebotrightbox {float: right;margin-top: 20px;}
.bmtopbox .bmrightbox .bmpricebot .bmpricebotrightbox.bookprobuy{float: left; margin-left: 20px;}
a.bmbuybtn { display: inline-block; color: #fff; padding: 10px 20px; font-size: 15px; border-radius: 3px; text-align: center; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e10019+0,990000+100 */ background: #e10019; /* Old browsers */ background: -webkit-linear-gradient(#e10019 0%, #990000 100%); background: -o-linear-gradient(#e10019 0%, #990000 100%); background: linear-gradient(#e10019 0%, #990000 100%); /* FF3.6-15 */ /* Chrome10-25,Safari5.1-6 */ /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e10019', endColorstr='#990000',GradientType=0 ); /* IE6-9 */ }
.bmbotbox .p_tab_text_area a:hover{color: #00a0e9;}

/*輪播頁籤*/
.tab_area { margin: 14px 0px 10px 0px; width: 100%; }

.tabs_btn_now { transition: 0.3s ease all; color: #fff; font-size: 13px; line-height: 39px; /* padding:0px 36px 0px 36px; */ text-align: center; display: none; position: relative; width: 100%; box-sizing: border-box; background: #606060; }

.tabs_btn_now:hover { background: #00a0e9; }

.tabs_btn_now_arrow { position: absolute; border-top: solid 5px #FFF; top: 17px; right: 20px; border-left: solid 5px rgba(255, 255, 255, 0); border-right: solid 5px rgba(255, 255, 255, 0); }

.img-scroll { height: 39px; position: relative; width: 100%; background: #eeeeee; border-bottom: 1px solid #cccccc; }

.img-scroll2 { background: #595959; }

.img-list { position: relative; width: 100%; }

ul.tabs { margin: 0; padding: 0; list-style: none; width: 100%; overflow: hidden; }

.tabs li { line-height: 39px; float: left; position: relative; font-size: 15px; }

.tabs li a:hover { color: #008dc6; }

.tabs a { color: #333333; text-decoration: none; display: block; /* padding:0px 36px 0px 36px; */ transition: 0.3s ease all; text-align: center; width: 100%; padding: 0 18.8px; }

.tabs li.active { /*當前模式*/ }

.tabs li.active a { color: #008dc6; }

.tabs li.active:after { content: ""; background: url(../images/tabtri.png) no-repeat center center; position: absolute; bottom: -7px; margin: 0px 0px 0px 0; width: 100%; height: 16px; display: block; }

/*發票資料*/
.smallgraytext{
  font-size: 13px;
  color: #9E9E9E;
}
.invoiceblock{
  margin-left: 18px;
  color: #9E9E9E
}
.invoiceblock .oneline{
  margin-bottom: 5px;
}
.sameorder{
  color: #9E9E9E;
  font-size: 13px;
  margin-top: 15px;
}
.sameorder input{
  vertical-align: middle;
  margin-right: 5px;
}
.invoiceblock2 .oneline{
  margin-bottom: 5px;
}
/*付款方式*/
/*pay*/
table.cartchose {
  width: 100%;
  max-width: 650px;
}
table.cartchose2 {
  width: 100%;
  max-width: 650px;
  min-width: 500px;
}
table.cartchose tr td {
  border: 1px solid #d0d0d0;
  font-size: 14px;
  padding: 10px;
  border-left: none;
  border-right: none;
  line-height: 1.3;
}
table.cartchose tr td.bordernonebot{
  border-bottom: none;
  padding-bottom: 3px;
}
table.cartchose tr td.bordernonetop{
  border-top: none;
  padding-top: 0px
}


table.cartchose tr td.bkcolortd {
  background: #eeeeee;
  font-weight: bold;
  text-align: center;
}
table.cartchose tr td img {
  vertical-align: middle;
}
table.cartchose tr td.bkpink {
  background: #ffeeee;
}
table.cartchose tr.borderdashed td{
  border: none;
  border-bottom: 1px dotted #d0d0d0;
}
table.cartchose tr.bordertopnone td{
  border-top: none;
}
table.cartchose tr td.borderbotgray{
  border-bottom: 1px solid #d0d0d0;
}
@media (max-width: 980px) { /*輪播頁籤*/
  .tab_area { position: relative; }
  .tabs_btn_now { display: block; }
  .img-scroll { display: none; height: auto; position: absolute; width: 100%; z-index: 999; }
  .tabs li { float: none; text-align: center; width: 100%; }
  .tabs li.active:after { content: ""; background: none; } }
.unreset img { max-width: 100%; }

.bookorderbot { border-radius: 3px; border: 1px solid #d2d2d2; padding: 15px 15px 30px 15px; }
.bookorderbot .boprice .oldprice { color: #999999; font-size: 12px; text-decoration: line-through; }
.bookorderbot .boprice .lowprice { font-size: 14px; }
.bookorderbot .boprice .lowprice .red { color: #ff0000; }
.bookorderbot .boprice .lowprice .morebig { font-size: 30px; font-family: "Arial", "微軟正黑體"; font-weight: bold; }
.bookorderbot .ordermonth select {height: 29px;border: 1px solid #ccc;max-width: 320px;min-width: 250px;}
.bookorderbot .othergift .orthgiftname { float: left; }
.bookorderbot .othergift .orgiftchose { font-size: 12px; float: left; }
.bookorderbot .othergift .orgiftchose .oneline { display: inline-block; }
.bookorderbot .addcart { margin-top: 20px; }

table.formstyle { width: 100%; margin: 0 auto; font-size: 14px; }
table.tablespanstyle tr td{width: initial; display: initial}
table.formstyle tr td { padding: 5px; }
table.formstyle tr td .red { color: red; }
table.formstyle tr td .deepred { color: #990000; }
table.formstyle tr td img { vertical-align: middle; }
table.formstyle tr td:first-child { text-align: right; width: 95px; vertical-align: middle; }
table.formstyle tr td input[type="text"], table.formstyle tr td select {height: 35px;margin-bottom: 5px;max-width: 310px;width: 100%;padding: 5px;border: 1px solid #CCC;box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset;transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;}
table.formstyle tr td input[type="text"]:focus, table.formstyle tr td select:focus { border-color: #66AFE9; outline: 0px none; box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset, 0px 0px 8px rgba(102, 175, 233, 0.6); }
table.formstyle tr td input[type="text"].codeinput, table.formstyle tr td select.codeinput { width: 126px; }
table.formstyle tr td input[type="text"].input1, table.formstyle tr td select.input1 { max-width: 105px; }
table.formstyle tr td input[type="text"].input2, table.formstyle tr td select.input2 { max-width: 100%; }

table.formstyle tr td input[type="password"], table.formstyle tr td select {height: 35px;margin-bottom: 5px;max-width: 250px;width: 100%;padding: 5px;border: 1px solid #CCC;box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset;transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;}
table.formstyle tr td input[type="password"]:focus, table.formstyle tr td select:focus { border-color: #66AFE9; outline: 0px none; box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset, 0px 0px 8px rgba(102, 175, 233, 0.6); }
table.formstyle tr td input[type="password"].codeinput, table.formstyle tr td select.codeinput { width: 126px; }
table.formstyle tr td input[type="password"].input1, table.formstyle tr td select.input1 { max-width: 105px; }
table.formstyle tr td input[type="password"].input2, table.formstyle tr td select.input2 { max-width: 100%; }
#twzipcodeAddressee select, #twzipcodeAddressee input, #twzipcodeinvoice input, #twzipcodeinvoice select{
  width: 100px;
  margin-right: 5px;
  height: 35px;
  padding: 5px;
  margin-bottom: 5px;
  border: 1px solid #CCC;
}
#twzipcodeorder select, #twzipcodeorder input{
  width: 100px;
  margin-right: 5px;
} 
.select3style{
  width: 310px;
  margin-right: 5px;
  height: 35px;
  padding: 5px;
  margin-bottom: 5px;
  border: 1px solid #CCC;
}
table.formstyle tr td textarea { width: 100%; height: 200px; padding: 5px; border: 1px solid #CCC; box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset; transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s; }
table.formstyle tr td textarea:focus { border-color: #66AFE9; outline: 0px none; box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset, 0px 0px 8px rgba(102, 175, 233, 0.6); }
table.formstyle tr td .codeimg { display: inline-block; vertical-align: middle; margin-left: 10px; }
table.formstyle tr td .oneline { margin-right: 5px; display: inline-block; }
table.formstyle tr td .oneline input { vertical-align: middle; }
table.formstyle .select1 { max-width: 105px; }

.submitbtn { margin-top: 20px; }
.submitbtn input { /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e10019+0,990000+100 */ background: #e10019; /* Old browsers */ background: -webkit-linear-gradient(#e10019 0%, #990000 100%); background: -o-linear-gradient(#e10019 0%, #990000 100%); background: linear-gradient(#e10019 0%, #990000 100%); /* FF3.6-15 */ /* Chrome10-25,Safari5.1-6 */ /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e10019', endColorstr='#990000',GradientType=0 ); /* IE6-9 */ color: white; padding: 10px 40px; border: none; border-radius: 3px; }

table.formstyle2 tr td:first-child { width: 125px; }

table.formstyle2 tr td .checkbox { display: inline-block; }

table.formstyle3 tr td:first-child { width: 62px; }

.textright{
  text-align: right;
}
.arinrbt{
  float: left;
}
.arinrbb{
  float: left;
}
.unmmorebig{
  font-size: 26px;
  color: #00b8ee;
}

@media (max-width: 860px) { table.formstyle tr td { display: block; padding: 0; }
  table.formstyle tr td:first-child { text-align: left; margin-top: 10px; }
  .weixinpc{
    display: none;
  }
  .weixinmobile{
    display: block;
  }
  .weixinclickshow{
    right: -43px;
    left: initial;
  }
}
@media (max-width: 750px) { .contactbox .rightbox { width: 100%; }
  .contactbox .leftbox { width: 100%; padding-left: 0px; }
  .contactbox .rightbox .rightbg { padding: 15px; } }
.htmlediortitle { font-size: 26px; font-weight: bold; color: #008dc6; border-bottom: 6px solid #ccf1fc; line-height: 1.4; }
.htmlediortitle .tw { border-bottom: 6px solid #008dc6; }
.htmlediortitle .en { font-size: 14px; color: #333333; display: inline-block; margin-top: 5px; }

.htmlediortitle2 { font-size: 18px; }

.htmledior { margin: 20px 10px 20px 10px; }

.onecolumlist {/* float: left; */display: inline-block;width: 32.8%;margin-bottom: 15px;padding-right: 15px;vertical-align: top;}
.onecolumlist .onecolumlist_in { position: relative; }
.onecolumlist figure img { width: 100%; display: block; }
.onecolumlist:hover .columnistname { text-decoration: underline; }
.onecolumlist .columnistname { color: white; background: rgba(0, 0, 0, 0.7); width: 100%; position: absolute; bottom: 0; padding: 10px 15px; line-height: 1.3; }
.onecolumlist .columnistname .cntopclass { font-size: 12px; }
.onecolumlist .columnistname .cntopclassname h2 { font-size: 20px; font-weight: normal; }
.onecolumlist .alinkblock { height: 100%; width: 100%; position: absolute; top: 0; bottom: 0; }

.columlistarticlebox { background: white; padding: 20px; -moz-box-shadow: 1px 3px 5px 2px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 1px 3px 5px 2px rgba(0, 0, 0, 0.1); box-shadow: 1px 3px 5px 2px rgba(0, 0, 0, 0.1); margin-bottom: 15px; }
.columlistarticlebox_mobile { display: none; }
.mcolisttop .mcoluimg { float: left;width: 40%; }
.mcolisttop .mcoluimg img{ width: 100%; }
.mcolisttop .mcolumlistname { float: left; width: 60%; padding-left: 10px; line-height: 1.3; margin-top: 20px;}
.mcolisttop .mcolumlistname h2 { font-size: 20px; margin-bottom: 5px;}
.mcolistbot .mcolumnincontent {}
.columlistarticlebox .colistleft { float: left; width: 33.33333%; padding-right: 20px; }
.columlistarticlebox .colistleft figure.coluimg { width: 100%; }
.columlistarticlebox .colistleft figure.coluimg img { display: block; width: 100%; }
.columlistarticlebox .colistright { float: left; width: 66.66667%; }
.columlistarticlebox .colistright .topline { margin-bottom: 10px; }
.columlistarticlebox .colistright .topline .leftline { float: left; color: #666666 ；; }
.columlistarticlebox .colistright .topline .rightline { float: right; color: #008ec6; }
.columlistarticlebox .colistright .columlistname { margin-bottom: 10px; }
.columlistarticlebox .colistright .columlistname h1 { font-size: 20px; color: #666666; font-weight: bold; }
.columlistarticlebox .colistright .columnincontent { color: #666666; font-size: 15px; }
.columlistarticlebox .colistright .columnincontent .orang { color: #ff6600; }

.signuptitle .signupleft { font-size: 26px; color: #008dc6; font-weight: bold; float: left; }
.signuptitle .signupright { font-size: 12px; color: #333333; float: right; }
.signuptitle .signupright .blueunderline { color: #008dc6; text-decoration: underline; }

.emaillogin { margin-bottom: 15px; display: block; }
.emaillogin .topline { background: #ffbb45; color: white; padding: 15px; text-align: center; font-size: 16px; position: relative; border-radius: 3px 3px 0 0; }
.emaillogin .topline:before { content: "\f0e0"; font-family: FontAwesome; position: absolute; font-size: 26px; left: 20px; top: 6px; }
.emaillogin .bottomline { border: 1px solid #ffbb45; padding: 20px; font-size: 14px; border-top: none; }
.emaillogin .bottomline table.emailsignintab tr td { padding: 5px; }
.emaillogin .bottomline table.emailsignintab tr td:first-child { text-align: right; }
.emaillogin .bottomline table.emailsignintab tr td input[type="text"],.emaillogin .bottomline table.emailsignintab tr td input[type="password"] { height: 36px; border: 1px solid #cccccc; padding: 5px; }
.emaillogin .bottomline table.emailsignintab tr td input[type="submit"] { color: white; padding: 10px 30px; border-radius: 3px; border: none; background: #e10019; background: -webkit-linear-gradient(#e10019 0%, #990000 100%); background: -o-linear-gradient(#e10019 0%, #990000 100%); background: linear-gradient(#e10019 0%, #990000 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e10019', endColorstr='#990000',GradientType=0 ); }
.emaillogin .bottomline table.emailsignintab tr td img { vertical-align: middle; }
.emaillogin .bottomline table.emailsignintab tr td .forgetpass { font-size: 12px; color: #008dc6; text-decoration: underline; }

.signinother { background: #3d5a99; color: white; font-size: 16px; text-align: center; padding: 15px; position: relative; border-radius: 3px; margin-bottom: 15px; display: block; }
.signinother:before { content: ""; position: absolute; font-size: 26px; left: 20px; top: 6px; font-family: FontAwesome; }

.fblogin:before { content: "\f09a"; }

.googlelogin { background: #d03324; }
.googlelogin:before { content: "\f0d5"; }

/*購物車*/
.innerpagefullwidth { width: 100%; padding-bottom: 20px; }
.innerpagefullwidth .whitebg { margin-bottom: 20px; }

.cartheaderbar { width: 100%; color: #fff; background: #999999; height: 40px; line-height: 40px; }
.cartheaderbar .cartflow { padding: 10px 30px; }
.cartheaderbar .cartflow.active { background: #008dc6; height: 40px; line-height: 40px; position: relative; }
.cartheaderbar .cartflow.active:after { content: url(../images/tri.png); position: absolute; display: inline-block; right: -14px; width: 14px; height: 40px; }
.cartheaderbar .cartflow .nember { width: 30px; height: 30px; border-radius: 100%; margin-right: 5px; border: 1px solid #fff; display: inline-block; line-height: 30px; text-align: center; }

table.carttab { width: 100%; min-width: 600px; }
table.carttab tr th { background: #333333; font-size: 14px; text-align: center; border: 1px solid #fff; padding: 10px; color: white; }
table.carttab tr td { border: 1px solid black; padding: 10px; text-align: center; }
table.carttab tr td.textalignright { text-align: right; }
table.carttab tr td.textalignleft { text-align: left; }
table.carttab tr td select { width: 120px; border: 1px solid #ccc; }
table.carttab tr td.prophoto img { max-width: 50px; }
table.carttab tr td.red { color: #ff0000; }
table.carttab tr td.green { color: #009900; }
table.carttab tr td .morebig { font-size: 20px; font-weight: bold; }
table.carttab tr td .numberselect { max-width: 50px; }
.cartinnerlayout .cartbtns { text-align: left; display: block; margin-top: 10px;}
.cartbtns { text-align: right; }
.cartbtns a { color: white; padding: 10px 30px; border-radius: 3px; border: none; }
.cartbtns a.btnback { /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#00cc00+0,474747+100 */ background: #00cc00; /* Old browsers */ background: -moz-linear-gradient(top, #00cc00 0%, #474747 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #00cc00 0%, #474747 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #00cc00 0%, #474747 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00cc00', endColorstr='#474747',GradientType=0 ); /* IE6-9 */ }
.cartbtns a.btnnext { background: #e10019; background: -webkit-linear-gradient(#e10019 0%, #990000 100%); background: -o-linear-gradient(#e10019 0%, #990000 100%); background: linear-gradient(#e10019 0%, #990000 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e10019', endColorstr='#990000',GradientType=0 ); }

.cart2set { margin-bottom: 30px; }
.cart2set .cartinnerlayout { margin-top: 20px; }
.cartinnerlayout2{margin-left: 20px}
.cart2set .cartinnerlayout .oneline { display: block; }

.textalignleft { text-align: left; }

.ordertopbluetext { color: #008dc6; font-size: 16px; }

/*書籍目錄*/
.twocolumn { float: left; width: 50%; padding: 10px; }
.twocolumn .oneset .bigtitle { font-size: 14px; font-weight: bold; border-bottom: 1px dotted #ccc; padding: 5px 0; }
.twocolumn .oneset h2 { font-size: 13px; color: #333333; padding-left: 10px; border-bottom: 1px dotted #ccc; width: 100%; }

.bluecolor { color: #008dc6; }
.bluecolor .morebig { font-size: 18px; font-weight: bold; }

.taboverflowhidden { width: 100%; overflow-x: auto; }

/*會員側邊選單*/
.membersidemenu { background: #fff; padding: 30px; margin: 0 30px 30px 30px; position: relative; min-height: 350px; -moz-box-shadow: 1px 3px 5px 2px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 1px 3px 5px 2px rgba(0, 0, 0, 0.1); box-shadow: 1px 3px 5px 2px rgba(0, 0, 0, 0.1); }
.membersidemenu ul li { list-style: none; padding-left: 15px; margin-bottom: 10px; position: relative; }
.membersidemenu ul li:before { position: absolute; content: "\f054"; font-family: "FontAwesome"; left: 0; display: block; font-size: 12px; top: 3px; }
.membersidemenu ul li a:hover, .membersidemenu ul li a.active { color: #00b8ee; }

.i_banner { position: relative; top: 0; }
.i_banner img { width: 100%; display: block; }
.fb-like{float: left;}

/*20170203 以下是手機版Header*/
.mobilewrapper {position: relative;-webkit-transform: translate3d(280px, 0, 0);-moz-transform: translate3d(280px, 0, 0);transform: translate3d(280px, 0, 0);}
/*.mobilewrapper:after { position: absolute; width: 100%; height: 100%; z-index: 99999; background: rgba(0, 0, 0, 0.5); content: ""; display: black; left: 0; top: 0; }*/

.menuoutbg{
	display: none;
}
.menuoutbg.menuoutbgactive{
	position: absolute; width: 100%; height: 100%; z-index: 999; background: rgba(0, 0, 0, 0.5); content: ""; display: block; left: 0; top: 0;
}

.mobileheader {background: #d6f4fd;position: relative;/* height: 75px; */display: none;z-index: 9;}
.mobileheader .mobilenav {position: absolute;left: 0;top: 0;padding: 15px 10px;background: #f2941a;cursor: pointer;height: 100%;width: 75px;}
.mobileheader .mobilenav img { width: 100%; }
.mobileheader .mobilelogo {/* text-align: center; */padding-top: 15px;padding-left: 102px;}
.mobileheader .mobilelogo img { max-width: 150px; }
.mobileheader .mobileicons { position: absolute; right: 0; top: 0; color: #1baddd; padding: 10px 0; line-height: 1.3; }
.mobileheader .mobileicons .mobileiconsearch { float: left; text-align: center; margin-right: 30px; font-weight: bold; }
.mobileheader .mobileicons .mobileiconsearch i { font-size: 40px; }
.mobileheader .mobileicons .mobileiconuser { float: left; text-align: center; margin-right: 20px; font-weight: bold; }
.mobileheader .mobileicons .mobileiconuser i { font-size: 40px; }
.mobileheader .mobileicons .mobileiconuser2{margin-right: 30px;}

/*20170304 add start*/
.mobileuserlogout{
	display: none;
	position: absolute;
	right: 10px;
	border: 1px solid #ccc;
	border-radius: 3px;
	padding: 10px;
	background: #ffffff;
	font-size: 13px;
	z-index: 999999;
}
.mobileuserlogout:before{
	content: "";
	display: inline-block;
	position: absolute;
	top: -8px;
	right: 6px;
	width: 12px;
	height: 9px;
	background: url(../images/triangle.png) no-repeat;
}
.mobileuserlogouttop{
	margin-bottom: 5px;
}
.musername{
	margin-right: 5px;
}
.muserclass{
	text-align: center;
	color: #1baddd;
	padding: 0 3px;
	border: 1px solid #1baddd;
}
.mobileuserlogoutbot{
	text-align: right;
}
/*20170304 end*/

.mobilesearch { background: #d6f4fd; padding: 10px; display: none; }
.mobilesearch .mseartext { width: 100%; background: white; padding: 5px; position: relative; }
.mobilesearch .mobiletextform { width: 95%; border: none; height: 30px; }
.mobilesearch .mobiletextform:focus { outline: none; }
.mobilesearch .mobilesearchbtnout { background-color: #f2941a; border: none; width: 30px; height: 30px; position: relative; display: inline-block; position: absolute; top: 5px; right: 5px; }
.mobilesearch .mobilesearchbtnout:after { display: block; position: absolute; left: 5px; top: 0; color: white; content: "\f002"; font-family: FontAwesome; font-size: 18px; }
.mobilesearch .mobilesearchbtnout .mobilesearchbtn { background: none; border: none; }

.mobilesidemenu {position: absolute;left: 0px;-webkit-transform: translate3d(-280px, 0, 0);-moz-transform: translate3d(-280px, 0, 0);transform: translate3d(-280px, 0, 0);width: 280px;z-index: 9999;background: white;font-size: 16px;-moz-transition: all 0.3s;-o-transition: all 0.3s;-webkit-transition: all 0.3s;transition: all 0.3s;}
.mobilesidemenu .mobilesidehead { text-align: center; color: white; position: relative; background: #00b8ee; padding: 5px; height: 42px; padding-top: 8px; }
.mobilesidemenu .mobilesidehead .mobilenavclose { position: absolute; right: 10px; top: 3px; cursor: pointer; font-size: 22px; }
.mobilesidemenu ul.mobilesidemenuul > li > a { display: block; padding: 5px 10px; border-bottom: 1px solid #eaeaea; font-weight: bold; position: relative; }
.mobilesidemenu ul.mobilesidemenuul > li > a:after { content: "\f105"; position: absolute; font-family: FontAwesome; right: 10px; top: 6px; color: #cccccc; font-size: 16px; }
.mobilesidemenu ul.mobilesidemenuul > li ul.mobilesecmenu { display: none; }
.mobilesidemenu ul.mobilesidemenuul > li ul.mobilesecmenu > li { list-style: none; }
.mobilesidemenu ul.mobilesidemenuul > li ul.mobilesecmenu > li > a { display: block; width: 50%; float: left; text-align: center; border-right: 1px solid #bfedfa; border-bottom: 1px solid #bfedfa; font-size: 14px; padding: 3px; }
.mobilesidemenu ul.mobilesidemenuul > li ul.mobilesecmenu > li > a:nth-child(2n) { border-right: none; }
.mobilesidemenu ul.mobilesidemenuul > li:after { content: ''; display: block; clear: both; }
.mobilesidemenu ul.mobilesidemenuul > li.active { color: #00b8ee; position: relative; }
.mobilesidemenu ul.mobilesidemenuul > li.active:before { content: ""; height: 100%; width: 4px; background: #00b8ee; display: block; left: 0; top: 0; position: absolute; z-index: 99999; }
.mobilesidemenu ul.mobilesidemenuul > li.active > a { border-bottom: 1px solid #bfedfa; }
.mobilesidemenu ul.mobilesidemenuul > li.active > a:after { color: #00b8ee; }

.mobilesidemenuadd {-webkit-transform: translate3d(0, 0, 0);-moz-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);}

/*20170203 以上是手機版Header*/

/*20170303 add*/
.listItem {
    height: 280px;
    border: 1px solid #CBCBCB;
    margin: 0px auto;
    position: relative;
    /* float: left; */
    padding: 35px 15px 15px 15px;
    list-style: none;
    width: 95%;
}

.listItem:hover {
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=90);
    opacity: .9
}

.listItem .containPic {
    width: 100%;
    height: 187px;
    margin: 10px auto 0px auto;
    background-repeat: no-repeat;
    background-position-x: center;
}

.listItem .list_title {
    width: 117px;
    height: 24px;
    background-color: #00b8ee;
    color: #fff;
    font-size: 108%;
    line-height: 24px;
    position: absolute;
    top: 10px;
    left: 0;
    z-index: 10
}

.listItem .list_title a {
    display: block;
    padding-left: 15px;
    width: 100%;
    height: 100%
}

.listItem .list_title a:hover {
    text-decoration: none
}

.listItem .coverTitle {
    position: absolute;
    background-image: url("../images/black2.png");
    width: 100%;
    height: 56px;
    color: #fff;
    font-size: 123.1%;
    padding: 0 20px;
    left: 0;
    bottom: 0;
}

.listItem .coverTitle:before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 0;
    height: 100%
}

.listItem .coverTitle .txt {
    display: inline-block;
    font-size: 16px;
    vertical-align: middle
}

.listItem .bgPic {
    position: absolute;
    left: 0;
    top: 0
}
.graytitlecolor{
  color: #999999;
}
.mobilecaption{display: none;}
.bookSelect {
    height: 32px;
    max-width: 250px;
    padding: 5px;
    border: 1px solid #CCC;
    box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset;
    vertical-align: middle;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
}
.addressinput{
    height: 35px;
    margin-bottom: 5px;
    max-width: 310px;
    width: 100%;
    padding: 5px;
    border: 1px solid #CCC;
    box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
}
.smallwidthinput{
    height: 35px;
    margin-bottom: 5px;
    max-width: 110px;
    width: 100%;
    padding: 5px;
    border: 1px solid #CCC;
    box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
}
.bluelink{
  color: blue;
  text-decoration: underline;
  font-size: 12px;
}
@media (max-width: 1242px) { .whitebg .shareicon { position: initial; box-shadow: none; width: initial; text-align: left; padding: 0; }
  .whitebg .shareicon:before { display: none; }
  .mainconinwrapper { padding: 0; margin: 20px 0; }
  .fb-like{/* margin-right: 5px; *//* padding-top: 10px; */}
   }
@media (min-width: 1191px) { .mobilesearch { display: none !important; } }

@media (max-width: 1190px) { .mainmenu { display: none; }
  .mobilemainmenu { display: block; background: #bfedfa; width: 100%; }
  .mobilemainmenu .mobileicon2 { text-align: center; color: #008dc6; font-size: 32px; cursor: pointer; width: 100%; }
  .mobilemainmenu ul.mobileul { display: none; background: #008dc6; color: white; }
  .mobilemainmenu ul.mobileul li { list-style: none; }
  .mobilemainmenu ul.mobileul li a { display: block; text-align: center; padding: 10px; font-size: 16px; border-bottom: 1px dotted #a7bdc5; }
  header .headerright .headerbot .search { width: initial; float: right; margin-left: 20px; }
  header .headerright .headerbot .headerad { float: right; }
  header .headerright .headerbot .search .hotkeytext { display: none; }
  /*20170203 以下是手機版header*/
  .mobileheader { display: block; }
  header { display: none; }
  .bodyarticle{
    position: relative;
    top: -15px;
  }
  .bodyarticle.indexbodyarticle{
    top: 0;
  }
}
@media (max-width: 1155px) { .buybtn { text-align: center; }
  .indexbannersection .magazine .buybtn .abuybtn { padding: 3px 0; width: 48%; }
  .whitebg .articlead .adleft { overflow: hidden; }
  .whitebg .articlead .adright { overflow: hidden; }
  .columlistarticlebox_pc { display: none; }
  .columlistarticlebox_mobile { display: block; }
}
@media (max-width: 1082px) { .bodyarticle .leftbox { width: 68%; }
  .bodyarticle .rightbox { width: 32%; }
  footer .footerbot .box2 { width: 382px; }
  footer .footerbot .box3 { width: 246px; } }
@media (max-width: 1048px) { header .logo { width: 34%; }
  header .logo h1 a { width: 100%; }
  footer .footertop .leftbox .footernav ul li:after { padding: 5px; }
  footer .footerbot .box2 { width: 322px; } }
@media (max-width: 960px) { .bodyarticle .leftbox { width: 100%; }
  .bodyarticle .rightbox { width: 100%; text-align: center; }
  .bodyarticle .rightbox .sidead { display: inline-block; float: none; vertical-align: top; }
  .bodyarticle .rightbox .sidearticlelist { display: inline-block; float: none; text-align: left; vertical-align: top; }
  .whitebg .articlead .adleft, .whitebg .articlead .adright { float: none; display: inline-block; width: 49%; }
  .whitebg .articlead { text-align: center; }
  .whitebg .articlebottombox .articleftbox, .whitebg .articlebottombox .articrightbox { float: none; display: inline-block; width: 49%; }
  .articlebottombox { text-align: center; }
  .bodyarticle .rightbox.membersidemenuout{
    text-align: left;
    height: initial;
  }
  .bodyarticle .rightbox.membersidemenuout .membersidemenu{
    min-height: initial;
    padding: 20px;
    margin: 10px;

  }
}
@media (max-width: 940px) { .indexbannersection .magazine .buybtn .abuybtn { width: 100%; margin-bottom: 5px; } }
@media (max-width: 920px) { footer .footerbot .box1.logo h1 a { display: none; }
  footer .footertop .leftbox { float: none; }
  footer .footertop .socialicons { float: none; margin-top: 10px; }
  footer .footertop .leftbox .footernav ul li:after { padding: 12px; } }
@media (max-width: 900px) { header .logo { width: 100%; text-align: center; }
  header .headerright { width: 100%; }
  header .logo h1 a { width: 334px; margin: 0 auto; }
  header .headerright .headertop { float: none; width: 553px; margin: 0 auto; padding: 15px 0; }
  .headerbot { width: 520px; margin: 0 auto 15px auto; }
  .bookclass a { margin-top: 3px; } }
@media (max-width: 800px) { .sp-bottom-thumbnails { display: none; }
  .indexbannersection .banner { width: 75%; }
  .indexbannersection .magazine { width: 25%; padding-left: 10px; }
  .indexbannersection .magazine .buybtn .abuybtn { width: 48%; margin-bottom: 0px; }
  table.emailsignintab { width: 100%; }
  .emaillogin .bottomline table.emailsignintab tr td { display: block; }
  .emaillogin .bottomline table.emailsignintab tr td input[type="text"] { width: 100%; }
  .emaillogin .bottomline table.emailsignintab tr td:first-child { text-align: left; }
  .emaillogin .bottomline table.emailsignintab tr td input[type="text"].codewidth { width: 200px; }
  .pccaption{display: none;}
  .mobilecaption{display: block;}
  .bmtopbox .bmrightbox .bmpricebot .bmpricebotleftbox {
      padding-top: 0px;
  }
  .bmtopbox .bmrightbox .bmpricebot .bmpricebotrightbox {
    margin-top: 0px;
  }
}
@media (max-width: 720px) { .bookblock .bookoneset:nth-child(4) { display: none; }
  .bookblock .oneset {width: 32.33333%;}
  .bmtopbox .bmrightbox .bmpricebot .bmpricebotleftbox { float: none; }
  .bmtopbox .bmrightbox .bmpricebot .bmpricebotrightbox { float: none; margin-top: 20px; } }
.magazine.mobilemagazine { display: none;}
.mobileshareicon{
    display: none;
  }
.bottomad{display: none;}
@media (max-width: 700px) { .indexbannersection .banner { width: 100%; margin-bottom: 10px; float: none; }
  .indexbannersection .magazine { width: 100%; padding-left: 0; max-width: 208px; margin: 0 auto; float: none; }
  .indexbannersection .magazine.pcmagazine { width: 100%; padding-left: 0; max-width: 208px; margin: 0 auto; float: none; display: none;}
  .magazine.mobilemagazine { display: block;}
  .bottomad{display: block;margin-top: 10px;text-align: center;}
  .whitebg .articenterbox .articenterboxin .title .en {/* display: none; */}
  .whitebg .articletop .articletopright {float: left;/* margin-top: 5px; */}
  .magazine.mobilemagazine { width: 100%; padding-left: 0; max-width: 208px; margin: 0 auto; float: none; margin-top: 20px; }
  .magazine.mobilemagazine figure { width: 100%; margin-bottom: 3px; }
  .magazine.mobilemagazine figure img { width: 100%; display: block; }
  .magazine.mobilemagazine .buybtn .abuybtn { color: #008dc6; display: block; float: left; padding: 4px; border: 2px solid #008dc6; font-size: 15px; width: 49%; text-align: center; }
  .magazine.mobilemagazine .buybtn .abuybtn:nth-child(2) { float:right;}
  .buybtn:after{content: ""; display: block; clear:both;}
  .magazine.mobilemagazine .buybtn .abuybtn:hover { background: #008dc6; color: white; }
  .pcshareicon{
    display: none;
  }
  .mobileshareicon{
    display: block;
  }
  .whitebg .articletop .articletopright a.marright {
    margin-left: 7px;
    float: left;
  }
  .whitebg .articletop .articletopleft{
    margin-bottom: 5px;
  }
  }
@media (max-width: 640px) { footer .footerbot .box2 { width: 320px; float: none; margin: 0 auto; text-align: center; }
  footer .footerbot .box3 { width: 246px; margin: 0 auto; float: none; margin-top: 10px; }
  footer .footerbot .box3 .title { text-align: center; }
  footer .footerbot .box3 .copyright { text-align: center; }
  header .headerright .headertop .socialicons ul li, footer .footertop .socialicons ul li { float: none; display: inline-block; }
  footer .footertop .socialicons { text-align: center; }
  .footernav { text-align: center; }
  footer .footertop .leftbox .footernav ul li { float: none; display: inline-block; }
  footer { padding: 15px 0; }
  .articlebox .articlelist .articlephoto { width: 30%; }
  .articlebox .articlelist .articlerightcon { width: 70%; }
  .whitebg .articlead .adleft, .whitebg .articlead .adright {width: 100%;}
  .whitebg .articlebottombox .articleftbox, .whitebg .articlebottombox .articrightbox { width: 100%; }
  .articenterbox { text-align: center; }
  .whitebg .articenterbox .articenterboxleftbox, .whitebg .articenterbox .articenterboxrightbox { width: 100%; max-width: 336px; padding-right: 0px; padding-left: 0; display: inline-block; text-align: left; float: none; }
  .whitebg .articenterbox .articenterboxleftbox, .whitebg .articenterbox .articenterboxrightbox { margin-bottom: 10px; }
  /*20170203 以下是手機版Header*/
  .mobileheader .mobilenav {height: 100%;width: 42px;padding: 12px 10px;}
  .mobileheader .mobilelogo img {max-width: 100px;display: block;}
  .mobileheader .mobilelogo {padding-top: 6px;padding-bottom: 6px;}
  .mobileheader .mobileicons .mobileiconsearch i, .mobileheader .mobileicons .mobileiconuser i { font-size: 20px; }
  .mobileheader .mobileicons .mobileiconsearch { margin-right: 10px; }
  .mobileheader .mobileicons .mobileiconsearch, .mobileheader .mobileicons .mobileiconuser { font-size: 13px; }
  .mobileheader .mobileicons { position: absolute; right: 0; top: 0; color: #1baddd; padding: 5px 0; line-height: 1.3; }
  .mobileheader .mobileicons .mobileiconuser { margin-right: 10px; }
  .mobileheader {/* height: 42px; */}
  .mobileheader .mobilelogo {
      padding-left: 55px;
  }
  .textunderline{
    text-decoration: underline;
  }
  .whitebg .articlead .adright.adrightmobilehidden{
    display: none;
  }
}
.mobilemainmenu ul.mobileul li.mobilesocialicons { display: none; }

@media (max-width: 590px) { header .headerright .headertop .socialicons { display: none; }
  header .headerright .headertop { width: 429px; }
  .mobilemainmenu ul.mobileul li.mobilesocialicons { display: block; padding: 10px 0; width: 128px; margin: 0 auto; }
  .mobilemainmenu ul.mobileul li.mobilesocialicons a { background: #d2d2d2; border-radius: 100%; width: 32px; height: 32px; text-align: center; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; float: left; margin: 0px 5px; }
  .mobilemainmenu ul.mobileul li.mobilesocialicons:after { content: ''; display: block; clear: both; }
  .whitebg { padding: 15px; margin: 0; }
  .bodyarticle .rightbox .sidearticlelist {
      display: block;
      width: 100%;
      max-width: 100%;
      margin-top: 0;
  }
  .bodyarticle .rightbox {
      padding: 0 15px;
  }
  .pathroad {
      display: none;
  }
  .contentmaintitle {
    margin-top: 25px;
  }
  .bodyarticle {
    top: 0px;
  }
  .bcl_bookmin{
    top: -15px;
  }
  body{
    background: #f6f6f6;
  }
  .bmrightboxtopmag {
    height: initial;
  }
  .bmtopbox .bmrightbox .bmlist2 {
    height: initial;
  }
  .bmrightboxtop {
    height: initial;
  }
  .cartbtns {
    text-align: center;
    padding-bottom: 20px;
  }
}
@media (max-width: 558px) { header .headerright .headerbot .headerad { width: 250px; }
  .headerbot { width: 440px; }
  header .headerright .headerbot .search { margin-top: 16px; }
  header .headerright .headerbot .headerad { height: initial; }
  .headerbot { margin: 0 auto 10px auto; }
  .sp-caption-container { font-size: 16px !important; line-height: 1.3 !important; font-weight: normal !important; }
  .bodyarticle .leftbox .figureset .oneset {width: 100%;padding: 0;}
  .bodyarticle .leftbox .figureset .oneset .onesetin {
      -webkit-box-shadow: none;
      -moz-box-shadow: none;
      box-shadow: none;
   }
  .articlebox .articlelist .articlerightcon .arightcontent { line-height: 1.2; height: 38px; }
  .articlebox .articlelist .articlerightcon .bottomdate { position: initial; }
  .articlebox .articlelist { padding: 10px; }
  .pathroad, .contentmaintitle, .articlebox {margin-right: 15px;margin-left: 15px;padding-top: 10px;}
  .onecolumlist {width: 49%;}
  .bookmagablock .oneset {width: 49%;}
  .mainconwrapper { padding: 15px; margin: 0; }
  .mainconwrapperbook{
    padding: 5px 15px 5px 15px;
  }
  .contentmaintitle .en { display: none; }
  .cartheaderbar .cartflow { display: block; }
  .cartheaderbar .cartflow.active:after { display: none; }
  .cartheaderbar { height: initial; }
  .cartheaderbar .cartflow.active { height: initial; }
  .cartheaderbar .cartflow { padding: 5px 30px; }
  .bodyarticle .leftbox .blocklist .bigtitleout {
      padding: 0 15px;
  }
  .articlebox .articlelist {
      -moz-box-shadow: none;
      -webkit-box-shadow: none;
      box-shadow: none;
  }
  .bodyarticle .leftbox .figureset .oneset .textbox h2.title {
      font-size: 20px;
      line-height: 1.2;
      margin-bottom: 9px;
  }
  .bodyarticle .leftbox .figureset .oneset .textbox h2.title.articleintexth2{
     text-overflow: ellipsis;
     white-space: nowrap;
     overflow: hidden;
  }
  .bodyarticle .leftbox .figureset .oneset .textbox .summary {
      font-size: 17px;
      line-height: 1.45;
  }
  .bodyarticle .leftbox .figureset .oneset figure {
      width: 100%;
      height: 197px;
      overflow: hidden;
  }
  .bodyarticle .leftbox {
      background: #eaeaea;
  }
  .bodyarticle .leftbox .figureset .oneset {
      margin-bottom: 10px;
  }
  .bodyarticle .leftbox .blocklist {
    margin-bottom: 0px;
  }
  .bodyarticle .rightbox {
      padding-top: 10px;
  }
  .magazine.mobilemagazine {
      margin-top: 10px;
  }
  .bodyarticle .rightbox .sidead.onlypcshow{
    display: none;
  }
  .whitebg .articlead {
    margin-bottom: 0px;
  }
  .bodyarticle .leftbox .articleinblocklist .figureset .oneset .textbox {
    height: 45px;
    background: #e6e6e6;
  }
  .bodyarticle .leftbox .figureset .oneset .onesetin {
    padding-bottom: 0;
  }
  .whitebg {
    padding-bottom: 10px;
  }
  .whitebg .articlead .adleft, .whitebg .articlead .adright{
    display: block;
    margin-left: auto;
    margin-right: auto;
  }
  .bodyarticle .leftbox .figureset .oneset .textbox {
    height: initial;
  }
  body{
    background: #eaeaea;
  }
  .magtitlein {
    margin: 0px 15px;
  }

}
@media (max-width: 480px) { header .logo { margin-top: 10px; }
  header .logo h1 a { width: 200px; height: 75px; }
  .smalliconmobilenone { display: none; }
  header .headerright .headertop nav.smallmenu ul li:after { display: none; }
  header .headerright .headertop nav.smallmenu ul li a { background: #c3c3c3; padding: 9px; border-radius: 100%; display: inline-block; margin-right: 5px; }
  header .headerright .headertop nav.smallmenu ul li a i { font-size: 20px; color: #fff; }
  header .headerright .headertop { width: 300px; }
  header .headerright .headertop .googlelang { padding: 6px 0px; }
  header { padding: 10px 10px 0 10px; }
  .bookblock .oneset { width: 100%; padding-right: 0; }
  .contentmaintitle {margin-top: 15px;}
  .bmtopbox .bmleftbox { width: 100%; padding-right: 0px; max-width: 208px; margin: 0 auto; float: none; margin-bottom: 10px; }
  .bmtopbox .bmrightbox { float: none; width: 100%; }
  .whitebg .shareicon {/* text-align: center; */}
  .bmtopbox .bmrightbox .bmpricebot .bmpricebotleftbox { text-align: center; }
  .bmtopbox .bmrightbox .bmpricebot .bmpricebotrightbox { text-align: center; }
  .bmtopbox .bmrightbox { text-align: center; }
  .bookorderbot { text-align: left; }
  .twocolumn { width: 100%; }
  .contentmaintitle {
    margin-bottom: 5px;
  }
  .contentmaintitle .booksearch {
    position: absolute;
    bottom: 6px;
    right: 0;
  }
  .bmtopbox .bmrightbox .bmpricebot .bmpricebotrightbox.bookprobuy.proshopbtn{
    float: none;
    margin-left: 0;
  }
  .magtitle {
    margin-top: 10px;
    margin-bottom: 10px;
  }
  .bookbanner{
    margin-bottom: 30px;
  }
  .contentmaintitle .tw {
    border-bottom: none;
  }
  .cartbtns a {padding: 10px 15px;}
  .mobilehidden{display: none;}
 }
@media (max-width: 460px) { header .headerright .headerbot .headerad {width: 100%;max-width: 330px;float: none;margin: 0 auto;display: none;}
  .headerbot { width: 100%; }
  header .headerright .headerbot .search { margin-top: 0px; }
  header .headerright .headerbot .search { width: initial; float: none; margin-left: 0; width: 168px; margin: 0 auto; margin-bottom: 10px; }
  .mainsection {padding: 5px 0px 5px 0px;/* height: 50px; */overflow: hidden;}
  .topad {
      /*display: none;*/
      margin-top: 0px;
      margin-bottom: 0px;
  }
  footer .footerbot .box3 .emailorderform input[type="text"] {
      width: 160px;
  }
  .emailorderform{
    text-align: center;
  }
  .indexbannersection {
    padding: 10px 15px 0 15px;
  }
  .ctmtbook{
    margin-top: 50px;
  }
  .contentmaintitle .booksearch {
    position: absolute;
    top: -35px;
    left: 0;
  }
  .contentmaintitle .booksearch .booksearchinput{
    margin-left: -25px;
    right: 8px;
    position: absolute;
    top: 4px;
  }
  .searchinputiconout{
    position: relative;
  }
  .bodyarticle {
    top: 5px;
  }
  .bcl_bookmin {
    top: -15px;
  }
}
@media (max-width: 420px) { .onecolumlist { width: 100%; }
  .onecolumlist { padding-right: 0; }
  .columlistarticlebox .colistright .topline .leftline { margin-right: 15px; }
  .columlistarticlebox .colistright .topline .rightline { float: left; } }

@media (max-width: 355px) {
  .bookSelect {
    max-width: 80px;
  }
  .contentmaintitle .booksearch .booksearchtext {
    width: 130px;
  }
  #twzipcodeorder select, #twzipcodeorder input {
    width: 100%;
    margin-right: 5px;
    max-width: 310px;
  }
  #twzipcodeAddressee select, #twzipcodeAddressee input, #twzipcodeinvoice input, #twzipcodeinvoice select {
    width: 100%;
    max-width: 310px;
  }
}
/*-------------------unrest css-----------------*/
.unreset li { display: list-item; }
.unreset head { display: none; }
.unreset col { display: table-column; }
.unreset colgroup { display: table-column-group; }
.unreset td, .unreset th { display: table-cell; }
.unreset caption { display: table-caption; text-align: center; }
.unreset th { font-weight: bold; text-align: center; }
.unreset body { margin: 8px; }
.unreset address, .unreset blockquote, .unreset dd, .unreset div, .unreset dl, .unreset dt, .unreset fieldset, .unreset form, .unreset frame, .unreset frameset, .unreset h1, .unreset h2, .unreset h3, .unreset h4, .unreset h5, .unreset h6, .unreset noframes, .unreset ol, .unreset p, .unreset ul, .unreset center, .unreset dir, .unreset hr, .unreset menu, .unreset pre { display: block; }
.unreset h1 { font-size: 2em; margin: 0.67em 0; }
.unreset h2 { font-size: 1.5em; margin: 0.75em 0; }
.unreset h3 { font-size: 1.17em; margin: 0.83em 0; }
.unreset h4, .unreset p, .unreset blockquote, .unreset ul, .unreset fieldset, .unreset form, .unreset ol, .unreset dl, .unreset dir, .unreset menu { margin: 1.12em 0; }
.unreset h5 { font-size: .83em; margin: 1.5em 0; }
.unreset h6 { font-size: .75em; margin: 1.67em 0; }
.unreset h1, .unreset h2, .unreset h3, .unreset h4, .unreset h5, .unreset h6, .unreset b, .unreset strong { font-weight: bolder; }
.unreset blockquote { margin-left: 40px; margin-right: 40px; }
.unreset i, .unreset cite, .unreset em, .unreset var, .unreset address { font-style: italic; }
.unreset pre, .unreset tt, .unreset code, .unreset kbd, .unreset samp { font-family: monospace; }
.unreset pre { white-space: pre; }
.unreset button, .unreset textarea, .unreset input, .unreset select { display: inline-block; }
.unreset big { font-size: 1.17em; }
.unreset small, .unreset .unreset sub, .unreset .unreset sup { font-size: 0.83em; }
.unreset sub { vertical-align: sub; }
.unreset sup { vertical-align: super; }
.unreset s, .unreset strike, .unreset del { text-decoration: line-through; }
.unreset hr { border: 1px inset; }
.unreset ol, .unreset ul, .unreset dir, .unreset menu, .unreset dd { margin-left: 40px; }
.unreset ol, .unreset ol li { list-style-type: decimal; }
.unreset ol ul, .unreset ul ol, .unreset ul ul, .unreset ol ol { margin-top: 0; margin-bottom: 0; }
.unreset ul, .unreset ul li { list-style-type: disc; }
.unreset u, .unreset ins { text-decoration: underline; }
.unreset br:before { content: "\A"; white-space: pre-line; }
.unreset center { text-align: center; }
.unreset:link, .unreset:visited { text-decoration: underline; }
.unreset:focus { outline: thin dotted invert; }

pre{
    margin: 0;
    padding: 0;
    white-space: initial;
}
/*# sourceMappingURL=style.css.map */