@charset "utf-8";
/**
 * 1.0 - Reset
 */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {border:0;font-family:inherit;/*font-size:100%;*/font-style:inherit;font-weight:inherit;margin:0;outline:0;padding:0;vertical-align:baseline;}
html{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;/*font-size:62.5%;*/overflow-y:scroll;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;}
*,
*:before,
*:after {-webkit-box-sizing:inherit;-moz-box-sizing:inherit;box-sizing:inherit;}
html,body{margin:0;padding:0;font-size:16px;font-family:'微軟儷黑體', '微軟正黑體', 'Arial', 'Helvetica', 'Geneva', sans-serif;}
article,aside,details,figcaption,figure,footer,header,main,nav,section{display:block;}
ol,ul{list-style:none;}
table {border-collapse:separate;border-spacing:0;}
caption,th,td {font-weight:normal;text-align:left;}
fieldset {min-width:inherit;}
blockquote:before,
blockquote:after,
q:before,
q:after {content:"";}
blockquote,q {-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none;quotes:none;}
/*a:focus {outline:2px solid #c1c1c1;outline:2px solid rgba(51, 51, 51, 0.3);}*/
a:hover,
a:active{outline:0;}
a img {border:0;}
h1,h2,h3,p,ul,ol,li,dl,dt,dd,input,textarea,select,option{margin:0;padding:0;font-size:inherit;line-height:1.6;color:inherit;font-family:inherit;font-style:inherit;font-weight:inherit;word-break:break-all;word-wrap:break-word;}
a{text-decoration:none;word-break:break-all;word-wrap:break-word;}
img{margin:0;padding:0;vertical-align:top;max-width:100%;height:auto;}
li{list-style:none;}
em,address{font-style:normal;}
sup{vertical-align:super;font-size:8px;margin-left:-0.3em;}
#herbalrabbit button{background-color:transparent;border:none;cursor:pointer;outline:none;padding:0;appearance:none;}

/*
common
#offerbar
#fv
#tbs
#research4
#magazines
.offer
#modelvoices
#ghs
#media
#voices
#worries
#factors
#solution
#features
#howtouse
#story
#qa
#delivery
#payment
*/

/* form */
#form{max-width:1100px;margin:0 auto;}

/* common */
#herbalrabbit{font-size:16px;position:relative;max-width:1600px;margin:0 auto;}
#btn_pagetop{position:fixed;bottom:3em;right:3em;z-index:9999;display:none;background: none;border: none;}

/* #offerbar */
#offerbar{position:fixed;top:0;left:50%;width:100%;max-width:2000px;margin-left:-62.5em;background:rgba(255,113,192,0.9);border-bottom:1px solid #fff;z-index:9999;width:100%;display:none;}
#offerbar .wrap{width:100%;max-width:1400px;margin:0 auto;display:table;padding:0 6.4%;}
@media screen and (min-width:1400px){
  #offerbar .wrap {width:1400px;padding: 0 90px;}
}
@media screen and (max-width:2000px){
  #offerbar{left:0;margin-left:0;}
}
#offerbar .txt,
#offerbar .btn{display:table-cell;vertical-align:middle;}
#offerbar .txt{width:70.3%;max-width:844px;}
#offerbar .txt img.img1{width:36.72%;max-width:310px;max-height:91px;vertical-align:middle;}
#offerbar .txt img.img2{width:37.2%;max-width:314px;max-height:91px;vertical-align:middle;}
#offerbar .txt .offprice{width:26%;max-width:220px;display:inline-block;vertical-align:middle;text-align:center;}
#offerbar .txt .offprice strong{font-size:3.6em;display:block;font-weight:bold;line-height:1.4;color:#fff;vertical-align:top;background:linear-gradient(transparent 65%, #51d6c5 65%, #51d6c5 85%,transparent 85%);white-space:nowrap;}
#offerbar .txt .offprice em{font-size:0.5em;}
#offerbar .txt .offprice span{font-size:0.7em;}
#offerbar .btn{width:29.6%;max-width:356px;}
#offerbar .btn a{display:block;}
#offerbar .btn a:hover{opacity:0.5;}
#offerbar .btn img{width:100%;max-width:356px;max-height:91px;height:auto;}

/* #header_txt */
#header_txt{height:36px;background:#ff117b;color:#fff;}
#header_txt .wrap{max-width:1400px;margin:0 auto;}
#header_txt .txt_h1{padding:0 100px;line-height:2.25;font-size:1em;}
@media screen and (max-width:1400px){
  #header_txt{height:2.57vw;}
  #header_txt .txt_h1{padding:0 7.14vw;}
}

/* #fv */
#fv .wrap{margin:0 auto;}
/* #tbs */
#tbs .wrap{margin:0 auto;}

/* #research4 */
#research4{background:#fffae7;}
#research4 .wrap{max-width:1600px;margin:0 auto;}

/* #magazines */
#magazines{background:url(../img/magazines_bg.jpg) 50% 0 repeat #ffebec;}
#magazines .wrap{max-width:1400px;margin:0 auto;}

/* .offer */
.offer{padding:1.25em 0 3.31em;font-size:16px;background:url(../img/offer_bg.png) 50% 0 no-repeat #f7f8fa;}
.offer .offer_btn a{display:block;}
.offer .offer_btn a:hover{opacity:0.5;}
.offer01 .wrap{max-width:1344px;margin:0 auto;background:#fff285;border-radius:8px;padding:2em 0 1.2em;}
.offer01 .offer_desc{margin:2em 0 0;}
.offer01 .offer_item{position:relative;}
.offer01 .offer_item .price1,
.offer01 .offer_item .price2,
.offer01 .offer_item .pricedown,
.offer01 .offer_item .offer_btn{position:absolute;line-height:1.2;}
.offer01 .offer_item .price1{font-size:1.7em;font-weight:bold;top:1.8em;left:21.5%;width:13em;text-align:right;color:#6f6800;}
.offer01 .offer_item .price1 .num{font-size:1.8em;}
.offer01 .offer_item .price2{top:0.8em;left:53%;font-size:2.3em;font-weight:bold;color:#ff117b;}
.offer01 .offer_item .price2 .num{font-size:2.1em;}
.offer01 .offer_item .price2 .fee{display:inline-block;width:1em;vertical-align:bottom;line-height:1.1;font-size:0.6em;padding-left:0.3em;}
.offer01 .offer_item .pricedown{font-size:3.1em;font-weight:bold;right:0;top:1.6em;width:7.5em;text-align:center;color:#fff;line-height:1.1;text-shadow:0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b;}
.offer01 .pricedown strong{display:inline-block;text-align:right;}
.offer01 .pricedown strong .num{font-size:1.5em;}
.offer01 .offer_btn{bottom:8%;left:0;padding:0 30.5%;}
.offer01 .offer_desc{position:relative;}
.offer01 .offer_desc .price{display:table;width:100%;position:absolute;padding:31.5% 18.5% 0 22.5%;top:0;left:0;}
.offer01 .offer_desc .price li{display:table-cell;vertical-align:middle;font-size:1.5em;font-weight:bold;color:#ff117b;width:33.3%;text-align:center;}
.offer01 .offer_desc .price li .num{font-size:1.8em;}
.offer02{margin:2.31em 0 0;}
.offer02 .wrap{max-width:1344px;margin:0 auto;background:#00d7c5;border-radius:8px;padding:2em 0 1.2em;}
.offer02 .offer_3items,
.offer02 .offer_5items{margin-top:1.25em;position:relative;}
.offer02 .total{position:absolute;bottom:1.4em;left:3.5em;width:13.5em;text-align:center;font-size:1.3em;color:#777;font-weight:bold;}
.offer02 .total strong{color:#ff117b;font-size:0.7em;}
.offer02 .total .num{font-size:2.2em;}
.offer02 .compare .price1_1,
.offer02 .compare .price1_2,
.offer02 .compare .price2_1,
.offer02 .compare .price2_2,
.offer02 .pricedown,
.offer02 .offer_btn{position:absolute;line-height:1.2;}
.offer02 .compare .price1_1{top:2.3em;left:36.3%;font-size:1.7em;width:5.7em;text-align:center;}
.offer02 .compare .price1_2{top:5.7em;left:7%;text-align:right;width:22.8em;font-weight:bold;font-size:1.5em;}
.offer02 .compare .price1_1,.offer02 .compare .price1_2{color:#009e91;}
.offer02 .compare .price1_2 strong{font-size:1.2em;}
.offer02 .compare .price1_2 strong .num{font-size:1.7em;}
.offer02 .compare .price2_1{top:2.3em;left:61.5%;font-size:1.7em;width:5.7em;text-align:center;}
.offer02 .compare .price2_2{top:2.9em;left:52%;font-size:2.5em;font-weight:bold;}
.offer02 .compare .price2_1,.offer02 .compare .price2_2{color:#ff117b;}
.offer02 .compare .price2_2 .num{font-size:2em;}
.offer02 .compare .price2_2 .fee{display:inline-block;width:1em;vertical-align:bottom;line-height:1.1;font-size:0.6em;padding-left:0.3em;}
.offer02 .pricedown{font-size:3.1em;font-weight:bold;right:0;top:2.6em;width:7.5em;text-align:center;color:#fff;line-height:1.1;text-shadow:0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b,0 0 4px #fe117b;}
.offer02 .pricedown strong{display:inline-block;text-align:right;}
.offer02 .pricedown strong .num{font-size:1.5em;}
.offer02 .offer_btn{bottom:4%;left:0;padding:0 30.5%;}
.offer03{margin:2.31em 0 0;}
.offer03 .wrap{max-width:1344px;margin:0 auto;background:#c0c0c0;border-radius:8px;padding:2em 0 1.2em;}
.offer03 .offer_item{margin-top:0;position:relative;}
.offer03 .offer_item .price{position:absolute;top:25%;left:0;font-weight:bold;font-size:2.8em;padding:0 11.5%;width:100%;text-align:center;line-height:1.4;color:#6c6c6c;}
.offer03 .offer_item .price em{font-size:0.75em;display:inline-block;vertical-align:top;line-height:1;padding-top:0.85em;}
.offer03 .offer_item .price strong{font-size:1.35em;display:inline-block;vertical-align:baseline;padding-left:0.5em;}
.offer03 .offer_item .price strong span{font-size:0.6em;}
.offer03 .offer_item .offer_btn{position:absolute;bottom:7%;left:0;padding:0 30.5%;}
.offer .info{display:table;width:100%;margin:0 auto;padding:0.8em 4.5em 0;color:#525252;}
.offer .info .item_info,
.offer .info .komelist{display:table-cell;vertical-align:top;}
.offer .info .item_info{width:24.2%;text-align:center;}
.offer .info .item_info p{font-size:0.875em;}
.offer .info .item_info strong{font-size:1.28em;}
@media screen and (max-width:1400px){
  .offer{font-size:1.14vw;background-size:142.85% auto;}
  .offer01,
  .offer02,
  .offer03{padding:0 2vw;}
}

/* #modelvoices */
#modelvoices{background:url(../img/modelvoices_bg.jpg) 50% 0 repeat;}
#modelvoices .wrap{max-width:1400px;margin:0 auto;}

/* #ghs */
#ghs{background:#ffc0db;}
#ghs .wrap{max-width:1400px;margin:0 auto;position:relative;width:100%;}
#ghs .video{position:absolute;left:50%;bottom:6em;margin-left:-450px;width:900px;}

/* #media */
#media{background:url(../img/media_bg.jpg) 50% 0 repeat;}
#media .wrap{max-width:1400px;margin:0 auto;}

/* #voices */
#voices{background:url(../img/voices_bg.png) 50% 0 repeat;padding-bottom:4em;}
#voices .wrap{max-width:1400px;margin:0 auto;}
  /*other voice */
#voices ul.other_voice{background:#fff;width:72.5em;height:35.62em;max-width:1160px;max-height:570px;border:1px solid #ccc;padding:1.25em;overflow:auto;margin:0 auto;}
#voices ul.other_voice li:after{content:".";display:block;clear:both;height:0;visibility:hidden;}
#voices ul.other_voice li{padding:0.76em 0 0.76em 0;margin-bottom:0.76em;border-bottom:1px dotted #ccc;font-size:0.8125em;}
#voices ul.other_voice li:last-child{margin-bottom:0;}
#voices ul.other_voice li .voice_left{float:left;width:13.63%;max-width:150px;border-right:1px solid #ccc;min-height:13em;text-align:center;}
#voices ul.other_voice li .voice_left img{width:5.38em;height:auto;margin-bottom:0.76em;}
#voices ul.other_voice li .voice_right{width:84.81%;max-width:933px;float:right;}
#voices ul.other_voice li .voice_right .lat img{width:1.53em;height:auto;margin-right:1px;vertical-align:middle;}
#voices ul.other_voice li .voice_right .lat span{font-size:2em;font-weight:bold;color:#f2649f;vertical-align:middle;}
#voices ul.other_voice li .voice_right .title{font-weight:bold;margin-bottom:5px;}
#voices .ast{color:#fff;text-align:right;width:83.5vw;max-width:1160px;margin:0.5em auto 0;line-height:1.3;}

/* #worries */
#worries{background:url(../img/worries_bg2.png) 50% 0 repeat-x,url(../img/worries_bg1.gif) 50% 0 repeat;}
#worries .wrap{max-width:1400px;margin:0 auto;}

/* #factors */
#factors{background:url(../img/factors_bg.jpg) 50% 0 repeat-x;background-size:auto 100%;}
#factors .wrap{max-width:1400px;margin:0 auto;}

/* #solution */
#solution{background:url(../img/solution_bg.gif) 50% 0 repeat-x;}
#solution .wrap{max-width:1400px;margin:0 auto;}
#solution .whitening{background:url(../img/solution_whitening_bg_line.png) 50% 0 no-repeat,url(../img/solution_whitening_bg.jpg) 50% 0 repeat;}

/* #features */
#features{background:url(../img/features_bg.png) 50% 0 repeat;}
#features .wrap{max-width:1400px;margin:0 auto;}

/* #howtouse */
#howtouse .wrap{max-width:1400px;margin:0 auto;}
#howtouse .steps{background:url(../img/howtouse_bg.jpg) 50% 0 repeat;}
#howtouse .bodyparts{background:url(../img/howtouse_bodyparts_bg.png) 50% 0 repeat;}

/* #point5 */
#point5{background:url('../img/point5_bg.jpg') 50% 0 repeat-x;text-align:center;background-size:contain;}
#point5 .ttl{border-top:1px solid #cd9c2b;border-bottom:1px solid #cd9c2b;text-align:center;}
#point5 img{max-width:1400px;}

/* #story */
#story{background:url(../img/story_bg.png) 50% 0 repeat;}
#story .wrap{max-width:1400px;margin:0 auto;}

/* #qa */
#qa{background:url(../img/qa_bg.jpg) 50% 0 repeat;}
#qa .wrap{max-width:1400px;margin:0 auto;padding:0 150px 110px;}
#qa .ttl{background:#a78b75;text-align:center;}
#qa .ttl img{max-width:1400px;}
#qa .qa_list{padding:0;box-sizing:border-box;}
#qa .qa_list li{margin-top:0.5em;}
#qa .qa_list li:first-child{margin-top:0.625em;}
#qa .qa_list dl{position:relative;display:block;padding:0.9375em 1.375em 1.875em;border-radius:7px;background:rgba(151, 113, 82, 0.45);overflow:hidden;}
#qa .qa_list dl::after{position:absolute;top:0;left:0;z-index:0;content:'';display:block;width:6.5em;height:800px;background:rgba(151, 113, 82, 0.45);}
#qa .qa_list dl dt{position:relative;display:block;z-index:1;font-size:1.625em;line-height:1.3;padding:0.9em 0.5em 0.9em 4em;margin:0 0 1em;color:#ff0079;background:#fff;}
#qa .qa_list dl dd{position:relative;display:block;z-index:1;font-size:1.125em;color:#fff;padding:0 0 0 5.77em;min-height:28px;}
#qa .qa_list dl dt::before,
#qa .qa_list dl dd::before{position:absolute;left:0.5em;width:50px;text-align:center;display:block;line-height:1;}
#qa .qa_list dl dt::before{content:'Q.';top:0.7em;color:#ff0079;font-size:1.23em;}
#qa .qa_list dl dd::before{content:'A.';top:-0.1em;color:#fff;font-size:1.77em;}
#qa .qa_list dl dd .fs12{font-size:.9em;}

/* #delivery */
#delivery{background:url('../img/delivery_bg.jpg') 50% 0 no-repeat;text-align:center;position:relative;overflow:hidden;}
#delivery .illust{position: absolute;bottom:0;left:50%;margin-left:-1000px;width:2000px;max-width:2000px;}
#delivery .desc img{max-width:1460px;}
@media screen and (max-width:1460px){
  #delivery{background-size:cover;}
  #delivery .illust{width:136.98%;margin-left:-68.49%;}
}
/* #payment */
#payment{background:url('../img/payment_bg.jpg') 50% 0 repeat;text-align:center;}
#payment .wrap{max-width:1460px;margin:0 auto;}

@media screen and (max-width:1400px){
  /* common */
  #herbalrabbit{font-size:1.14vw;}
  /* #offerbar */
  /* #fv */
  /* #tbs */
  /* #research4 */
  /* #magazines */
  /* .offer */
  /* #modelvoices */
  /* #ghs */
  #ghs .video{bottom:6.85vw;margin-left:-32.14vw;width:64.28vw;}
  #ghs .video iframe{width:64.28vw;height:36.14vw;}

  /* #media */
  /* #voices */
  #voices{background-size:27.14vw auto;}
  #voices ul.other_voice{width:82.85vw;height:40.71vw;padding:1.42vw;}

  /* #worries */
  #worries{background-size:auto 100%,3.42vw auto;}

  /* #factors */
  /* #solution */
  #solution .whitening{background-size:auto 100%,36.85vw auto;}

  /* #features */
  /* #howtouse */
  #howtouse .steps {background-size:57.14vw auto;}
  #howtouse .bodyparts{background-size:23.71vw auto;}

  /* #story */
  /* #qa */
  #qa .wrap{padding:0 10.71vw 7.85vw;}
}
