@charset "utf-8";
/* CSS Document */

/*回版頭*/
#gotop { display: none; position:fixed; z-index:10; right:20px; bottom:30px;padding:10px 10px 3px 10px; border-radius:50px; font:12px/30px Verdana; text-align:center; color:#000;  background-color:rgba(255,255,255,0.7); cursor:pointer;
  -webkit-transition: all 0.3s ease;
     -moz-transition: all 0.3s ease;
      -ms-transition: all 0.3s ease;
       -o-transition: all 0.3s ease;
          transition: all 0.3s ease;}
#gotop:hover { padding-top:40px; background-color:#fff;} 
#gotop::before { content: ""; position:absolute; top:7px; left:18px; width: 0; height: 0; border: 4px solid #000; border-color: transparent transparent #000; }
	@media screen and (max-width:767px){
		#gotop { right:20px; bottom:85px; }
	}


/*LOGO*/
.momologo { z-index:2; position: absolute; top: 15px; left:15px;}
.momologo a { display:block; width:140px; height:21px;}
.momologo a svg { width:140px; height:21px; }
.momologo a path { fill:#EA27C2; }
.momologo-pink  a path { fill:#EA27C2; }/*LOGO 桃紅色*/
.momologo-white a path { fill:#ffffff; }/*LOGO 白色*/
	@media screen and (max-width:767px){
		.momologo { display:none;}
	}


/*通知浮層*/
.agreeArea { z-index:1; position:relative; top:5%; margin:0 auto 30px; width:94%; max-width:700px; font-family:"Century Gothic", "微軟正黑體", sans-serif;}
.agreeArea img{ width:100%; height:auto;}
.agreeArea .box { border-radius:10px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); background-color:#fff; overflow:hidden;text-align:left;}
.agreeArea .box .txtArea { height:600px; overflow-y:auto;}
.agreeArea .box h3 { margin:0; padding:0; height:3rem; font-size:1.25rem; font-weight:800;line-height:3rem; text-align:center; color:#fff; background-color:#ee7687;}
.agreeArea .box p { margin:10px auto; margin-top:1rem; padding:0 0 0 24px; text-align:center; font-size:1em; line-height:1.2em; color:#000;}
.agreeArea .box p b { display:block; padding-bottom:0px;}
.agreeArea .box p span { }
.agreeArea .box .qrcodeimg { text-align:center; }
.agreeArea .box .qrcodeimg a { color:#006afe;}
.agreeArea .box .qrcodeimg img { width:100%; height:auto;}
.agreeArea .box .agree_table table { margin:20px auto; border-collapse:collapse; width:90%; text-align:center;}
.agreeArea .box .agree_table th { padding:5px; border:1px solid #CCC; width:33%; font-size:0.9em; }
.agreeArea .box .agree_table td { padding:5px; border:1px solid #CCC; font-size:0.9em; }
.agreeArea .box .agree_table th a{ color:#c70026; text-decoration:underline;}
.agreeArea .box .xxx{ display:block; width:80%; height:40px; font-size:1.5em; text-align:center; line-height:40px; color:#FFF; background-color:#7048A0; margin:0 auto; margin-bottom:20px; margin-top:10px; font-weight:bold; border-radius:10px;}
.agreeArea .box ul,
.agreeArea .box ol { margin:0;}
.agreeArea .box li { margin:0 20px 10px 0px; font-size:0.9em;}


/*浮層嘿嘿*/
.blackBox_play {}
.blackBox { display:none; z-index:9; position:absolute; top:0px; left:0px; width:100%; height:100%; background-color: rgba(34,34,34,0.75); }
.blackBox * { font-family:"微軟正黑體"; box-sizing:border-box;}
.blackBox  a { text-decoration:none;}
/*浮層基本*/
.blackBox .box .button {  border-top:1px solid #d6d6d6; text-align:center; font-size:1.25rem; line-height:3.5rem; font-weight:bold;}
.blackBox .box .but-close { clear:both; width:100%;}
.blackBox .box .but-close a { display:inline-block;  width:100%; height:100%; color:#333;}
.blackBox .box h3 span.close { position:absolute; top:6px; right:5px; display:block; border:2px solid #333; border-radius:5px; width:63px; height:33px; font-size:1rem; line-height:2rem; text-align:center;}
.blackBox .box h3 span.close a { display:inline-block; width:100%; height:100%; color:#333;}
.blackBox .Boxclose { position:absolute; top:0px; left:0px; width:100%; height:100%; background-color: transparent;}
.blackBox .box h4 {height: 3rem; font-size: 0.8rem; font-weight: 100; text-align: center; color: #000;}

/*贈品介紹*/
.agreeArea .box {border-radius: 10px;background-color: #fff; overflow: hidden;}
.agreeArea .box_title { padding: 5% 5% 0; font-weight: 800; line-height: 1; text-align: center;}
.agreeArea .box_title b { position: relative; display: block;}
.agreeArea .box_title span { z-index: 1; position: relative; display: inline-block; padding: 0 0.5em; background-color: #fff;}
.agreeArea .box_title b:before { content: ""; position: absolute; bottom: -0.55em; display: block; width: 100%; height: 1px; background-color: #000;}
.agreeArea .box_title img { width: 35%;}
.agreeArea .box_sub { text-align: center;}
.agreeArea .box_derails { padding: 0 5%; font-weight: 800;}
.agreeArea .box_derails dt { margin: 0; margin-top: 0.8em; padding: 0.5em 0; border-top: 1px solid #000; text-align: center;}
.agreeArea .box_derails dd { margin: 0; padding: 0; color: #9d9d9d; line-height: 1.2;}
.agreeArea .box_derails dd ul { margin: 0; padding: 0; padding-left: 1em;}
.agreeArea .box_derails dd li img { margin: 0.2em 0; width: 70%; max-width: 480px; box-shadow: 0em 0.3em 1.5em rgba(0,0,0,0.1);}
.agreeArea .box_derails .txt_into { color: #5a5958;}
.agreeArea .box_derails .txt_spec ul { padding-left: 1em; list-style: none;}
.agreeArea .box_derails .txt_note ul { list-style: decimal; }
        @media screen and (min-width:768px){
			.agreeArea .box table	{width:100%;margin: 0 0 5%}
          .agreeArea .box_title { font-size: 40px; }
          .agreeArea .box_title span { font-size: 30px;}
		      .agreeArea .box_sub { font-size: 18px; line-height: 30px; margin: 22px 0 10px; padding: 0 5%}
          .agreeArea .box_derails { font-size: 30px;}
          .agreeArea .box_derails span { font-size: 22px;}
          .agreeArea .box_derails td { font-size: 22px;}
          .agreeArea .box_derails dd { font-size: 26px;}
        }
        @media screen and (max-width:767px){
			.agreeArea .box table	{width:100%;margin: 0 0 5%}			
          .agreeArea .box_title { font-size: 1.2rem; }
          .agreeArea .box_title span { font-size: 1.25rem;}
          .agreeArea .box_derails span { font-size:4vw;}
          .agreeArea .box_derails td { font-size:4vw;}			
		      .agreeArea .box_sub { font-size: 1rem; line-height: 1.5rem; margin: 0.5rem 0 0.5rem; padding: 0 10% ;}
          .agreeArea .box_derails { font-size: 1.25rem;}
          .agreeArea .box_derails dd { font-size: 1.1rem;}
        }

/*贈品表格*/
.agreeArea .box ul,.agreeArea .box ol { margin: 0;}
.agreeArea .box li {margin: 0 20px 10px 0px;font-size: 0.9em}
.agreeArea .box table {margin: 0 5%;width: 90%;border-collapse: collapse}
.agreeArea .box th {padding: 5px;border: 1px solid #CCC;background: #eee;font-size: 0.8em}
.agreeArea .box td {padding: 5px;border: 1px solid #CCC;font-size: 0.8em;vertical-align: top}

/*注意事項*/	
/*.Areamore {z-index: 2;}*/