﻿@import url("reset.css");

*{
	margin:0;
	padding:0;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
}
a{color: #FFFFFF;}
html{ 
	font-family:Arial, Verdana, "微軟正黑體";
	-webkit-text-size-adjust:none;
}

body{
  	font-family: ‘Noto Sans TC’, Arial, Verdana, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.5em;
	letter-spacing:0px;
	background-image:url(../images/BGbody.jpg);
	background-repeat:repeat;
	background-color:#fff;
	background-position:center top;

	}
.header {
    position: fixed;
    margin: auto;
    background-color: #FFF;
    z-index: 100;
    width: 100%;
    top: 0;
}
#wrap{width:100%;margin:0 auto;overflow:hidden;padding-top:50px;}
/***共用***/
p{font-size: 0.8em;line-height: 1.4em;letter-spacing:1px;}
.buy1{width: 70%; margin:1% 0 2% 1%; text-align: center;}
.buy1 img{max-width: 150px;}
.flr{float: none;}
.fll{float: none;}
.red{font-size: 1.4em;color:#e95484;font-weight: 600;}
.blue{color:#0f85c9;font-weight: 600;}
.pur{color:#7348ff;font-weight: 600;}
.white{color: #fff;}
.green{color: #32af76;}
.em{font-style:  italic;}
.pagetxt{font-size: 1.2em;line-height: 1.8em;letter-spacing:1px;}
.wordb1{font-size: 0.9em;letter-spacing: 0;}
.words1{font-size:16px;padding: 1% 0;text-align: right;}
.heightlight{font-weight:bold; background:-webkit-gradient(linear, left bottom, left top, from(#ffeb8e), color-stop(50%, #ffeb8e), color-stop(50%, rgba(255, 235, 142, 0)), to(rgba(255, 235, 142, 0))) bottom center;
    background:-webkit-linear-gradient(bottom, #ffeb8e 0%, #ffeb8e 50%, rgba(255, 235, 142, 0) 50%, rgba(255, 235, 142, 0) 100%) bottom center;
    background:-o-linear-gradient(bottom, #ffeb8e 0%, #ffeb8e 50%, rgba(255, 235, 142, 0) 50%, rgba(255, 235, 142, 0) 100%) bottom center;
    background:linear-gradient(0deg, #ffeb8e 0%, #ffeb8e 50%, rgba(255, 235, 142, 0) 50%, rgba(255, 235, 142, 0) 100%) bottom center
}
.bb{font-weight: 600;}
.pcview{display:none;}
.mview{display:block;}

/***1策展人介紹***/
.cont1{width:100%;	margin:0 auto;/*background-color: #fff;*/background-image: url("../images/p1-bg-leftM.png");background-position: center bottom;background-repeat: no-repeat;background-size:contain;/*background-attachment: fixed;*/}
.cont1:after{content: '';display: block;clear: both;}
.box1{width:98%;margin:0 auto;padding: 10px 6% 20%;text-align: left;}
.box1:after{content: '';display: block;clear: both;}/*偽元素,不用設高度,自動撐高*/

.box1 p{margin-top: 2%;}
.aubox{width: 98%;float: none;letter-spacing: 0;padding-top: 2%;}
.txtbg{background-color: #32af76;color: #fff;margin: 6px 6px 15px;padding: 6px; font-weight: 500;line-height: 2.2em;}
.p1-g{max-width: 200px;}

.author{max-width: 90%;margin: 0 8%;}
/*.authorM{display: block;}*/

/*** 2小人物大客廳 ***/

.cont2{width:100%;	margin:0 auto;padding: 0 0 10%;background-color: #fff; background-image: url("../images/p2-bg.png");background-position: center bottom;background-repeat: no-repeat;background-size: contain;}
.cont2:after{content: '';display: block;clear: both;}
.cont2 h2{text-align: center;margin: 0 auto;}
.cont2 h2 img{width: 90%;margin: 0 auto;padding: 4%;}
.box2{width:98%;margin:0 auto; padding: 2%;}
.box2:after{content: '';display: block;clear: both;}
.box2 h2{text-align: center;margin: 3% auto;}

.logot{max-width: 200px;margin:3% 0;}
.logo4{max-width: 23%;margin-right:2%; vertical-align:top;}
.pageintro img{}
.pageintroTXT{width: 100%;height: auto;padding-bottom: 20px; margin: 1%;text-align: left;}
.box2-1{width:98%;margin:0 auto; background-color: #ccfbe3;border-radius: 20px; padding:2%;margin-bottom: 0;position: relative;}
.box2-1:after{content: '';display: block;clear: both;}
.box2-1 h2{text-align: center;margin: 0 auto;}
.box2-1 p{line-height: 1.8em;margin: 1% auto;}
.box2-1 p img{vertical-align:bottom;padding-right: 6px;}
.box2-1 ul{padding-left:6%;}
.box2-1 ul li{ list-style-type: disc;font-size: 0.8em;line-height: 1.5em;letter-spacing:1px;/*list-style-image: url(../images/tick.png);*/}
.p2-g4{	position: absolute;	left: 60px;	top: -109px;}
.p2-g1{max-width: 90%;height: auto;border-radius: 12px;border:6px solid #fff;box-shadow:2px 2px 2px 2px rgba(10%,10%,10%,0.2);margin-right: 0;margin: 2% 5%;}

.p2-g2{max-width: 90%;height: auto;border-radius: 12px;border:6px solid #fff;box-shadow:2px 2px 2px 2px rgba(10%,10%,10%,0.2);margin-left: 0;margin: 2% 5%;}
.p2-g3{max-width: 90%;height: auto;border-radius: 12px;border:6px solid #fff;box-shadow:2px 2px 2px 2px rgba(10%,10%,10%,0.2);margin-right: 0;margin: 2% 5%;}


/*** 3新手爸媽育兒寶典 ***/
.cont3{width:100%;	margin:0 auto;padding: 3% 0 100px; background-color: #fddbdb; background-image: url("../images/p3-bgM.png");background-position: center bottom;background-size: contain; background-repeat: no-repeat;}
.cont3:after{content: '';display: block;clear: both;}
.cont3 h2{text-align: center;margin: 3% auto;}
.cont3 h2 img{width: 90%;margin: 0 auto;padding: 4%;}
.box3{width:98%;margin:0 auto; padding: 2%;background-color: #fff;border-radius: 20px;background-image: url("../images/p3-box3bg.png");background-position: center bottom;background-size: cover; background-repeat: no-repeat;position: relative;}
.box3:after{content: '';display: block;clear: both;}
.box3 h2{text-align: center;margin: 3% auto;}
.box3 p{text-align: center;padding: 0 3%;}
.c3book{width: 100%;float: none;text-align: center;margin: 2% auto;}
.c3book img{max-width: 300px;}
.c3bookt{width: 100%;margin:5% auto;padding-left: 0; float: none;position: relative;}
.c3bookt img{border: solid #ccc 10px;border-radius: 10px;width: 98%;margin:0 auto;}
.c3book{}
.c3down{width: 130px; height: auto;	z-index: 99;margin: 0 auto;left: 14%; top:82%;position: absolute;}
.c3down img{width: 130px;margin: 0 auto;text-align: center;}
.p3-g1{position: absolute;}

/*** 4 0-3歲寶寶有聲書 ***/

.cont4{width:100%;	margin:0 auto;padding: 3% 0 50px; background-image: url("../images/p4-bg.png");background-position: center bottom;background-repeat: no-repeat;background-size: contain;}
.cont4:after{content: '';display: block;clear: both;}
.cont4 h2{text-align: center;margin: 0 auto 1%;}
.cont4 h2 img{width: 90%;margin: 0 auto;padding: 0;}
.cont4 p{text-align: center;margin: 0 auto 2%;}
.box4{width:98%;margin:0 auto; padding: 2%;background-color: #32af76;border-radius: 20px;position: relative;}
.box4 p{text-align: center;padding: 0 3%;}
.box4:after{content: '';display: block;clear: both;}
.p4-g1{	position: absolute;	left: 28px;	top: -244px;}
.p4-g2{	position: absolute;	left: 844px;	top: -175px;}
.box4 h3{text-align: center;margin: 3% auto;}
.flim,.flim2{width:90%;margin:20px auto;border: solid #fff 6px;border-radius: 10px; box-shadow:3px 2px 4px rgba(57,57,57,0.3)}
.flim2{width:92%;}
.box4-2{width:98%;margin:0 auto; padding: 10px 1% 10px;text-align: center;}
.box4-2 h2{text-align: center;margin: 2% auto;}
.box4-2:after{content: '';display: block;clear: both;}
.mvl{width: 100%;float: none;background-color: #3399cc;margin: 3% auto;border-radius: 10px;padding: 2% 0;}
.mvl h2 img{width: 40%;}
.mvr{width: 98%;float: none;margin: 3% auto;font-size: 0.9em;line-height: 1.5em;letter-spacing:0;font-weight: 600;}
.mvr p{text-align: center;}
.mvr img{max-width: 98%;margin: 0 auto;}

/*** 5 好書推薦 ***/
.cont5{width:100%;	margin:0 auto;padding: 0 0 50px; /*background-color: #fff; background-image: url("../images/p5-bg.png");background-position: center bottom;background-size: contain; background-repeat: no-repeat;*/}
.cont5:after{content: '';display: block;clear: both;}
.cont5 h2{text-align: center;margin: 0 auto 3%;}
.cont5 h2 img{width: 90%;margin: 0 auto;padding: 4%;}
.cont5 p{text-align: center;margin: 0 auto 2%;}
.box5{width:98%;margin:3% auto;border:solid 6px #32af76;border-radius: 20px;position: relative;}
.box5 p{text-align: center;padding: 0 3%;}
.box5:after{content: '';display: block;clear: both;}
.box5 h2{width: 60%; font-size: 1em;	text-align: center;	margin: 2%;	padding: 6px;	background-color: #32af76;	color: #fff;	border-radius: 10px;	z-index: 99;position: absolute;	left: 20%;	top: -1%;}
.p5-g1{	position: absolute;	left: 815px;	top: -168px;}
.box5-2{width:98%;margin:2% auto; border:solid 6px #e95484;border-radius: 20px;position: relative;}
.box5-2 p{text-align: center;padding: 0 3%;}
.box5-2:after{content: '';display: block;clear: both;}
.box5-2 h2{width: 60%; font-size: 1em; text-align: center;margin: 2%;	padding: 6px;;background-color: #e95484;	color: #fff;border-radius: 10px;z-index: 99;position: absolute;left: 20%;	top: -1%;}

.box5-3{width:98%;margin:2% auto; border:solid 6px #0f85c9;border-radius: 20px;position: relative;}
.box5-3 p{text-align: center;padding: 0 3%;}
.box5-3:after{content: '';display: block;clear: both;}
.box5-3 h2{width: 60%; font-size: 1em; text-align: center;margin: 2%;	padding: 6px;background-color: #0f85c9;	color: #fff;border-radius: 10px;z-index: 99;position: absolute;left: 20%;	top: -1%;}

.tsBookBg{width: 48%;letter-spacing: -2px;font-size: 15px; height: auto;padding-bottom: 20px; background-color: #FFFFFF;margin: 1%;position: relative;text-align: center;float: left;border-radius:20px;}
.tsBookBg img{max-width: 100%;height: auto;padding: 10px 0 0 0;}
.tsBookBg p a:link,a:visited,a:hover,a:active{color: #333;text-decoration: none;}
.tsBookBg p img{max-width:120px;}
.tsBookBg p{font-size: 0.9em;color:#666;font-weight: 500;}


/*** footer ***/
.bottom a:link{font-size:13px;font-weight:bold;color:#FFF;text-decoration:none}
.bottom a:hover{font-size:13px;font-weight:bold;color:#FFF;background-color:#666666;text-decoration:underline}
.bottom a:visited{font-size:13px;font-weight:bold;color:#FFF;background-color:#666666;text-decoration:none}
.footer01{font-size:13px;font-weight:bold;color:#bd4d03;background-color:#fff;text-align:center;padding:20px 0 10px 0}
.footer02{font-size:13px;text-align:center;color:#000;line-height:24px;background-color:#fff}
.footer02 a:link{font-size:13px;text-align:center;color:#000;text-decoration:none}
.footer02 a:hover{font-size:13px;text-align:center;color:#000;text-decoration:underline}
.footer02 a:visited{font-size:13px;text-align:center;color:#000;text-decoration:none}
.bottom1{font-size:13px;font-weight:bold;color:#FFF;background-color:#3e3d43;height:35px;padding:20px 0 10px 0;text-align:center;margin: 0 auto;}
.footer011{font-size:13px;font-weight:bold;color:#fff;background-color:#3e3d43;text-align:center;padding:20px 0 10px 0}
.footer011 img{margin: 0 30px;}
.footer021{font-size:13px;text-align:center;color:#aaaaaa;line-height:24px;background-color:#222127;}