@import url("reset.css");
body {
  -webkit-text-size-adjust: none;
  text-decoration: none;
  font-family: "微軟正黑體", "新細明體", "細明體", Arial, Helvetica, sans-serif;
  background-color: #ff9600;
}

input[type=text]::-ms-clear {
  display: none;
}

/*共用字型*/

#it213 .T01 {
  font-size: 1.1em;
  line-height: 1.6em;
  color: #333;
  margin-right: -1px;
}

#it213 .T02_B {
  /*使用者暱稱*/
  font-size: 2em;
  color: #ef3a91;
  line-height: 1.6em;
  font-weight: bold;
}

#it213 .T02_WO {
  /*使用者暱稱*/
  color: #0053c5;
  font-weight: bold;
}

#it213 .T03 {
  font-size: 1.2em;
  line-height: 1.6em;
  color: #333;
}

#it213 .T04 {
  font-size: 0.9em;
  line-height: 1.6em;
  color: #4e0101;
}

/*文字顏色*/

#it213 .PINK {
  color: #ef3a91;
}

#it213 .RED {
  color: #cc0000;
}

#it213 .GREEN {
  color: #4f8700;
}

#it213 .RED {
  color: #b50000;
}

/*斷行*/

#it213 .TBLANK {
  margin-bottom: 10px;
}

/*共用間距*/

#it213 .BLANK {
  width: 100%;
  height: 20px;
}

#it213 .BLANK02 {
  width: 100%;
  height: 20px;
  background: url(https://imgs.click108.com.tw/unit001/item00213/images/dot02.png) repeat-x center;
}

/*==============桌機版================桌機版==============桌機版=============================================*/

/*PC表頭尾*/

.PC .PC_LOGIN,
.PC .FOOT_PC {
  width: 100%;
  display: block;
}

/*PC表頭尾*/

/*消失區*/

.PC #float_icon,
.PC #header,
.PC .FOOT_MOBILE {
  display: none;
}

/*消失區尾*/

/*框架區*/

.PC #it213 {
  width: 100%;
  height: auto;
  /* overflow: hidden; */
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/bg.jpg);
  background-repeat: repeat-x;
  background-position: top center;
  -webkit-box-sizing: border-box;
}

.PC #it213 .FRAME {
  width: 100%;
  height: auto;
  /* overflow: hidden; */
  margin: 0 auto;
}

/*框架區尾*/

/*表頭區*/

.PC #it213 .e_TOP {
  width: 100%;
  height: 300px;
  background: url(https://imgs.click108.com.tw/unit001/item00213/images/top_bg.png) no-repeat top center;
  margin: 0 auto;
}

.PC #it213 h1 {
  width: 600px;
  height: 300px;
  margin: 0 auto;
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/top_title.png);
  background-repeat: no-repeat;
  background-position: 5px -5px;
  text-indent: -9999px;
}

/*表頭區尾*/

/*內容區*/

.PC #it213 .CONTENT {
  width: 750px;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/con_bg.jpg);
  background-size: 100% auto;
}

/*內容框架*/

.PC #it213 .CONTENT_TOP img,
.PC #it213 .CONTENT_FOOT img {
  display: block;
  width: 750px;
  height: 41px;
  margin: auto;
}

/*共用按鈕*/

.PC #it213 .e_BT {
  clear: both;
  width: 90%;
  margin: 0 auto;
}

.PC #it213 .e_BT ul.ONE {
  width: 100%;
  height: 50px;
}

.PC #it213 .e_BT ul.ONE li {
  width: 50%;
  margin: 0 auto;
  height: 50px;
}

.PC #it213 .e_BT ul.TOW {
  width: 100%;
  height: 50px;
}

.PC #it213 .e_BT ul.TOW li {
  float: left;
  width: 50%;
}

.PC #it213 .e_BT li a {
  display: block;
  width: 95%;
  margin: 0 auto;
  height: 50px;
  color: #fff;
  text-decoration: none;
  font-size: 1.5em;
  font-weight: bold;
  text-align: center;
  line-height: 47px;
}

.PC #it213 .e_BT li a.ALINE {
  font-size: 1.5em;
  font-weight: bold;
  text-align: center;
  line-height: 47px;
}

.PC #it213 .e_BT li a.BLINE {
  font-size: 1.5em;
  font-weight: bold;
  text-align: center;
  line-height: 47px;
}

.PC #it213 .PRINT a {
  display: block;
  width: 50%;
  margin: 0 auto;
  height: 50px;
  font-size: 1.5em;
  color: #fff;
  font-weight: bold;
  text-align: center;
  line-height: 47px;
  text-decoration: none;
}

.PC #it213 a.COLOR {
  background-color: #b34fa8;
  background: -moz-linear-gradient(top, #b34fa8 0%, #760b6a);
  background: -webkit-gradient( linear, left top, left bottom, from(#b34fa8), to(#760b6a));
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  border: 1px solid #760b6a;
  -moz-box-shadow: inset 0px 0px 2px rgba(255, 255, 255, 1);
  -webkit-box-shadow: inset 0px 0px 2px rgba(255, 255, 255, 1);
  box-shadow: inset 0px 0px 2px rgba(255, 255, 255, 1);
}

.PC #it213 a.COLOR:hover {
  background-color: #760b6a;
  color: #fee300;
  background: -moz-linear-gradient(top, #760b6a 0%, #b34fa8);
  background: -webkit-gradient( linear, left top, left bottom, from(#760b6a), to(#b34fa8));
}

/*=========================輸入頁面頭區================*/

.PC #it213 .CON_BOX {
  width: 670px;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
}

.PC #it213 .WHAT_BOX02_BAR {
  width: 100%;
  height: 66px;
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/input_bar.jpg);
  background-repeat: no-repeat;
  margin: 15px auto 0 auto;
  text-align: center;
  font-size: 1.6em;
  line-height: 66px;
  color: #fff;
  font-weight: bold;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
}

.PC #it213 .WHAT_BOX02_BAR .DR_DOWN a {
  display: none;
}

.PC #it213 .WHAT_BOX_BG {
  width: 100%;
  height: auto;
  overflow: hidden;
  clear: both;
  margin: 0 auto 15px auto;
  padding: 15px 0;
  background-color: #fdf9fe;
  box-shadow: inset 0px 0px 50px rgba(227, 153, 219, 1);
  -webkit-box-shadow: inset 0px 0px 50px rgba(227, 153, 219, 1);
  -moz-box-shadow: inset 0px 0px 50px rgba(227, 153, 219, 1);
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
}

.PC #it213 .WHAT_BOX_BG .LISTBOX {
  width: 70%;
  margin: 0 auto;
  height: auto;
  overflow: hidden;
}

.PC #it213 .WHAT_BOX_BG .LISTBOX li {
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/input_icon.png);
  background-repeat: no-repeat;
  background-position-x: 5px;
  background-position-y: 0;
  background-position: 5px 0;
  padding-left: 40px;
  /* width: 90%; */
  margin-bottom: 5px;
  font-size: 1.2em;
  color: #333;
  line-height: 1.8em;
}

.PC #it213 .WHAT_BOX_BG .LISTBOX ul li>ul li {
  width: 90%;
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/dot.png);
  background-repeat: no-repeat;
  background-position-x: 5px;
  background-position-y: 5px;
  background-position: 5px 5px;
  padding-left: 20px;
  color: #333;
  font-weight: normal;
  font-size: 1em;
  margin-bottom: 0px;
}

/*BOX01尾*/

/*CON_BOX_BAR樣式二*/

.PC #it213 .CON_BOX_BAR02 {
  /*NEW*/
  width: 100%;
  height: 60px;
  margin: 0 auto;
  background-color: #f6e3ff;
  -webkit-box-sizing: border-box;
}

.PC #it213 .CON_BOX_BAR02 p {
  /*NEW*/
  font-size: 1.6em;
  line-height: 60px;
  color: #7e00b9;
  font-weight: bold;
  text-align: center;
}

.PC #it213 .CON_BOX_BG02 {
  /*NEW*/
  width: 100%;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
  border: 1px solid #f0cfff;
  -webkit-box-sizing: border-box;
}

.PC #it213 .CON_BOX img {
  display: block;
  width: 100%;
  margin: 0 auto;
}

.PC #it213 .CON_BOX_BG02 .BOX_INSET {
  /*內縮*/
  width: 90%;
  height: auto;
  clear: both;
  overflow: hidden;
  margin: 0 auto;
  margin: 10px auto;
}

.PC #it213 .CON_BOX_BG02 .LISTIMG {
  /*九星宿緣配圖*/
  float: left;
  width: 200px;
  margin-right: 30px;
}

.PC #it213 .CON_BOX_BG02 .LISTBOX {
  width: auto;
  height: auto;
  overflow: hidden;
}

.PC #it213 .CON_BOX_BG02 .LISTBOX li {
  width: auto;
  height: auto;
  overflow: hidden;
  margin-bottom: 5px;
}

.PC #it213 .CON_BOX_BG02 .LISTBOX li>ul li {
  width: auto;
  height: auto;
  overflow: hidden;
  line-height: 1.6em;
  font-size: 1.2em;
  color: #333;
}

.PC #it213 .CON_BOX_BG02 .LISTBOX ul li.LIST_ICON {
  float: left;
  width: 18px;
  height: 18px;
  margin-right: 5px;
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/input_icon2.png);
  background-position: left bottom;
  background-repeat: no-repeat;
  margin-top: 3px;
}

/*輸入框*/

.PC #it213 .ENTER_TOP_BAR {
  width: 100%;
  height: 70px;
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/enter_top.jpg);
  background-repeat: no-repeat;
  margin: 15px auto 0 auto;
  text-align: center;
  font-size: 1.6em;
  line-height: 70px;
  color: #fff;
  font-weight: bold;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
}

.PC #it213 .ENTER_BG {
  width: 100%;
  height: auto;
  overflow: hidden;
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/enter_bg.jpg);
  background-repeat: repeat-y;
  margin: 0 auto;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 20px 30px 5px 30px;
}

.PC #it213 .ENTER_FOOT {
  width: 100%;
  height: 36px;
  overflow: hidden;
  clear: both;
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/enter_foot.jpg);
  background-repeat: no-repeat;
  margin: 0 auto 15px auto;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
}

.PC #it213 .CON_BOX img {
  display: block;
  width: 100%;
  margin: 0 auto;
}

/*輸入框*/

/*內容區尾*/

/*=========================輸入頁面尾區================*/

/*=========================結果頁面頭區================*/

/*第一塊引導區*/

.PC #it213 .GUIDE {
  width: 92%;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
}

.PC #it213 .GUIDE li.TEXT {
  float: right;
  width: 72%;
}

.PC #it213 .GUIDE li.PH {
  float: left;
}

.PC #it213 .GUIDE li.PH img {
  width: 160px;
  height: 160px;
}

/*個人資料*/

.PC #it213 .INFOR {
  height: auto;
  overflow: hidden;
  margin: 0 auto;
  text-align: center;
  padding: 10px 0px;
}

.PC #it213 .INFOR .GENDER {
  display: inline-block;
  width: 30px;
  height: 30px;
  margin: 0 auto;
  margin-bottom: -8px;
}

.PC #it213 .INFOR .GENDER img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0 auto;
}

/*個人資料尾*/

/*結果頁內容區框架*/

.PC #it213 .RE_TOP_FOOT {
  /*標題圖*/
  border-bottom: 3px solid #59710e;
}

.PC #it213 .RE_TOP_FOOT img {
  clear: both;
  display: block;
  width: 664px;
  height: 154px;
  margin: 0 auto;
}

.PC #it213 .RE_BG {
  /*框線*/
  width: 100%;
  height: auto;
  overflow: hidden;
  border: 3px solid #59710e;
  margin: 0 auto;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.PC #it213 .RE_NOSTYLE_COM {
  /*無樣式內容框*/
  width: 95%;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
  padding: 10px 0 10px 0;
}

/*內容欄位樣式用尾*/

.PC #it213 .BAR {
  clear: both;
  width: 100%;
  height: 45px;
  margin: 0 auto;
  background-color: #ef808b;
  font-size: 1.4em;
  line-height: 45px;
  color: #fff;
  text-align: center;
}

/*姓名五行內容*/

.PC #it213 .NAME_FIVE {
  width: 100%;
  height: auto;
  overflow: hidden;
}

.PC #it213 .NAME_FIVE_BG {
  width: 664px;
  height: 522px;
  position: relative;
}

.PC #it213 .NAME_TEXT01 ul {
  width: 28%;
  height: 100px;
  margin: 0 auto;
  text-align: center;
  position: absolute;
  top: 31%;
  left: 15%;
}

.PC #it213 .NAME_TEXT01 li {
  float: left;
  width: 50%;
}

.PC #it213 .NAME_TEXT02 ul {
  width: 45%;
  height: 100px;
  margin: 0 auto;
  text-align: center;
  position: absolute;
  top: 31%;
  right: 0%;
}

.PC #it213 .NAME_TEXT02 li {
  float: left;
  width: 33.3333333%;
}

.PC #it213 .NAME_TEXT03 {
  width: 50%;
  height: 100px;
  margin: 0 auto;
  text-align: center;
  position: absolute;
  top: 12%;
  left: 25%;
}

.PC #it213 .NAME_TEXT04 ul {
  width: 60%;
  height: 100px;
  margin: 0 auto;
  text-align: center;
  position: absolute;
  bottom: 23%;
  left: 20%;
}

.PC #it213 .NAME_TEXT04 li {
  float: left;
  width: 33.3333333334%;
  height: 100px;
  margin: 0 auto;
  text-align: center;
}

.PC #it213 .NAME_TEXT05 {
  width: 50%;
  height: 50px;
  margin: 0 auto;
  text-align: center;
  position: absolute;
  bottom: 18%;
  left: 25%;
  background-color: #c76e32;
  -moz-border-radius: 50px;
  -webkit-border-radius: 50px;
  border-radius: 50px;
  color: #fff;
  font-weight: bold;
  font-size: 2em;
  line-height: 50px;
}

.PC #it213 .NAME_TEXT06 {
  width: 50%;
  height: 50px;
  margin: 0 auto;
  text-align: center;
  position: absolute;
  bottom: 5%;
  left: 25%;
  color: #460000;
  font-size: 1em;
  line-height: 50px;
}

/*姓名五行字型*/

.PC #it213 .NAME_FIVE .NAM {
  width: 100%;
  height: 50px;
  font-family: "標楷體";
  font-size: 5em;
  line-height: 50px;
  color: #000;
}

.PC #it213 .NAME_FIVE .NAM_S {
  width: 100%;
  height: 70px;
  font-size: 1em;
  line-height: 70px;
  color: #000;
}

.PC #it213 .NAME_FIVE .NAM_S02 {
  font-size: 1em;
  color: #999;
}

.PC #it213 .NAME_FIVE .NAM_S03 {
  font-size: 1.5em;
  color: #762200;
  font-weight: bold;
}

.PC #it213 .NAME_FIVE .NAM_RED {
  color: #cc0000;
}

.PC #it213 .NAME_FIVE .NAM_YELLOW {
  color: #ffea00;
}

/*姓名五行內容尾*/

/*五行陣-龍*/

.PC #it213 .FIVE {
  width: 100%;
  height: auto;
  overflow: hidden;
  margin-top: 20px;
}

.PC #it213 .FIVE_BG {
  width: 100%;
  height: 455px;
  position: relative;
  background-repeat: no-repeat;
  background-position: top center;
}

.PC #it213 .FIVE_BG .BALL01 {
  width: 195px;
  height: 195px;
  position: absolute;
  left: 18%;
  top: 28%;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

.PC #it213 .FIVE_BG .BALL02 {
  width: 195px;
  height: 195px;
  position: absolute;
  right: 18%;
  top: 28%;
  background-repeat: no-repeat;
  background-position: center center;
}

.PC #it213 .FIVE_BG .BA_TEXT {
  /*球中字型*/
  font-size: 1.6em;
  line-height: 0.7em;
  color: #000;
  text-align: center;
  margin-top: 25%;
  text-shadow: 0px 0px 15px #fff;
}

.PC #it213 .FIVE_BG .BA_TEXT02 {
  /*球中字型*/
  font-family: "標楷體";
  font-size: 4.3em;
  line-height: 1.3em;
  color: #000;
  text-align: center;
  font-weight: bold;
  text-shadow: 2px 2px 15px #fff;
}

.PC #it213 .FIVE_BG .CENTER_TEXT {
  width: 510px;
  height: 136px;
  position: absolute;
  left: 12%;
  top: 69%;
  background-repeat: no-repeat;
  background-position: center center;
}

.PC #it213 .FIVE_BG .CENTER_TEXT ul {
  display: block;
  margin: 15px auto;
  width: 430px;
  height: 100px;
  background-color: #fffde2;
  border: 2px solid #fffde2;
}

.PC #it213 .FIVE_BG .CENTER_TEXT ul li:nth-child(1) {
  width: 100%;
  height: auto;
  overflow: hidden;
  font-size: 1.4em;
  line-height: 1.6em;
  font-family: "微軟正黑體", "新細明體", "細明體", Arial, Helvetica, sans-serif;
  color: #fff;
  text-align: center;
}

.PC #it213 .FIVE_BG .CENTER_TEXT ul li:nth-child(2) {
  width: 100%;
  height: auto;
  overflow: hidden;
  font-family: "標楷體";
  font-size: 2.5em;
  line-height: 1.6em;
  color: #000;
  font-weight: bold;
  text-align: center;
}

.PC #it213 .FIVE_BG .CENTER_TEXT ul li img {
  width: 80%;
  height: auto;
}

/*五行陣end*/

.PC #it213 .FRAME_TITLE {
  width: 408px;
  height: 76px;
  margin: 10px auto;
  font-family: "標楷體";
  font-size: 1.6em;
  line-height: 76px;
  color: #000;
  text-align: center;
  font-weight: bold;
  background: url(https://imgs.click108.com.tw/unit001/item00213/images/frame_title.jpg) no-repeat center;
}

.PC #it213 .FRAME_WORD {
  width: 408px;
  height: 96px;
  margin: 10px auto;
  font-family: "標楷體";
  font-size: 2.3em;
  line-height: 96px;
  color: #000;
  text-align: center;
  font-weight: bold;
  background: url(https://imgs.click108.com.tw/unit001/item00213/images/frame.jpg) no-repeat center;
}

.PC #it213 .FRAME_WORD img {
  width: 70%;
  height: auto;
  padding-top: 12px;
}

/*歲數運勢*/

.PC #it213 .L_CALENDAR {
  width: 100%;
  height: auto;
  overflow: hidden;
  border: 2px solid #e4b673;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin: 20px 0;
}

.PC #it213 .L_CALENDAR ul {
  width: 100%;
  height: auto;
  overflow: hidden;
  clear: both;
  background-color: #fff2df;
  border-bottom: 2px solid #e4b673;
}

.PC #it213 .L_CALENDAR ul:last-child {
  border: none;
}

.PC #it213 .L_CALENDAR li {
  float: left;
  height: auto;
  overflow: hidden;
  font-weight: normal;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.PC #it213 .L_CALENDAR li:nth-child(odd) {
  width: 28%;
  background-color: #ffe6c2;
  padding-bottom: 500em;
  margin-bottom: -500em;
}

.PC #it213 .L_CALENDAR li:nth-child(even) {
  width: 72%;
  padding: 10px;
  overflow: hidden;
  font-size: 1.1em;
  line-height: 1.6em;
  text-align: left;
  color: #333;
}

.PC #it213 .L_CALENDAR .SEAL {
  width: 152px;
  height: 82px;
  margin: 15px auto;
  vertical-align: middle;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

/*歲數尾*/

/*開運配圖內容*/

.PC #it213 .MAP_COM {
  width: 98%;
  height: auto;
  overflow: hidden;
  margin: 20px auto;
}

.PC #it213 .MAP_COM .MAP_PH {
  float: left;
  width: 200px;
  height: 200px;
}

.PC #it213 .MAP_COM .MAP_PH img {
  clear: both;
  display: block;
  width: 100%;
  height: auto;
  margin: 0 auto;
}

.PC #it213 .MAP_COM .MAP_TEXT {
  width: 380px;
  height: auto;
  overflow: hidden;
  padding-top: 10px;
  padding-left: 30px;
}

/*叮嚀*/

.PC #it213 .EXHORT {
  width: 98%;
  height: auto;
  overflow: hidden;
  clear: both;
  margin: 5px auto;
}

.PC #it213 .EXHORT li:nth-child(1) {
  float: left;
  width: 200px;
  height: 200px;
}

.PC #it213 .EXHORT li:nth-child(2) {
  width: 380px;
  height: auto;
  overflow: hidden;
  padding-top: 25px;
  padding-left: 30px;
}

/*叮嚀*/

/*========================結果頁面尾區================*/

/*=========================試算頁面頭區================*/

.PC #it213-wrapper .NEW_BT_F {
  /*浮水按鈕*/
  width: 100%;
  height: 60px;
  position: fixed;
  bottom: 0;
  z-index: 1000;
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/bt_bg.png);
  background-repeat: repeat;
  padding-top: 5px;
}

.PC #it213-wrapper .NEW_BT_F a {
  /*浮水按鈕*/
  display: block;
  width: 300px;
  margin: 0 auto;
  height: 48px;
  text-decoration: none;
  background-color: #b34fa8;
  background: -moz-linear-gradient(top, #b34fa8 0%, #760b6a);
  background: -webkit-gradient( linear, left top, left bottom, from(#b34fa8), to(#760b6a));
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  border: 1px solid #760b6a;
  -moz-box-shadow: inset 0px 0px 2px rgba(255, 255, 255, 1);
  -webkit-box-shadow: inset 0px 0px 2px rgba(255, 255, 255, 1);
  box-shadow: inset 0px 0px 2px rgba(255, 255, 255, 1);
  color: #fff;
  font-size: 1.5em;
  font-weight: bold;
  text-align: center;
  line-height: 48px;
}

.PC #it213-wrapper .NEW_BT_F a:hover {
  /*浮水按鈕*/
  background-color: #760b6a;
  color: #fee300;
  background: -moz-linear-gradient(top, #760b6a 0%, #b34fa8);
  background: -webkit-gradient( linear, left top, left bottom, from(#760b6a), to(#b34fa8));
}

.PC #it213 .SAMPLE {
  width: 100%;
  height: 150px;
  position: relative;
  background-position: -5px top;
  margin: 3px auto;
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/fuzzy.png);
}

.PC #it213 .SAMPLE02 {
  height: 50px;
}

.PC #it213 .SAMPLE03 {
  height: 80px;
}

.PC #it213 .FREE_PH {
  clear: both;
  width: 470px;
  height: auto;
  overflow: hidden;
  margin: 20px auto;
}

.PC #it213 .FREE_PH img {
  width: 100%;
  height: auto;
}

/*免費頁 動畫*/

.PC #it213 .ANI {
  width: 100%;
  height: 455px;
  position: relative;
  background-color: rgba(255, 255, 255, 0);
  -webkit-animation: fpage 5s infinite ease-out;
  -moz-animation: fpage 5s infinite ease-out;
  animation: fpage 5s infinite ease-out;
}

@-webkit-keyframes fpage {
  10% {
    background-color: rgba(255, 255, 255, 0.8);
  }
  40% {
    background-color: rgba(255, 255, 255, 0);
  }
  50% {
    background-color: rgba(255, 255, 255, 0);
  }
  60% {
    background-color: rgba(255, 255, 255, 0);
  }
  70% {
    background-color: rgba(255, 255, 255, 0);
  }
  80% {
    background-color: rgba(255, 255, 255, 0);
  }
  90% {
    background-color: rgba(255, 255, 255, 0);
  }
  100% {
    background-color: rgba(255, 255, 255, 0);
  }
}

@-moz-keyframes fpage {
  10% {
    background-color: rgba(255, 255, 255, 0.8);
  }
  40% {
    background-color: rgba(255, 255, 255, 0);
  }
  50% {
    background-color: rgba(255, 255, 255, 0);
  }
  60% {
    background-color: rgba(255, 255, 255, 0);
  }
  70% {
    background-color: rgba(255, 255, 255, 0);
  }
  80% {
    background-color: rgba(255, 255, 255, 0);
  }
  90% {
    background-color: rgba(255, 255, 255, 0);
  }
  100% {
    background-color: rgba(255, 255, 255, 0);
  }
}

@keyframes fpage {
  10% {
    background-color: rgba(255, 255, 255, 0.8);
  }
  40% {
    background-color: rgba(255, 255, 255, 0);
  }
  50% {
    background-color: rgba(255, 255, 255, 0);
  }
  60% {
    background-color: rgba(255, 255, 255, 0);
  }
  70% {
    background-color: rgba(255, 255, 255, 0);
  }
  80% {
    background-color: rgba(255, 255, 255, 0);
  }
  90% {
    background-color: rgba(255, 255, 255, 0);
  }
  100% {
    background-color: rgba(255, 255, 255, 0);
  }
}

/*免費頁 動畫尾*/

/*=========================試算頁面尾區================*/

/*=========================浮水購買區塊================*/

.PC #it213-wrapper #INPUT_BOX {
  /* position: fixed;
	width:255px;
	height:280px;
	right:3%;
	top: 220px;
	z-index: 9999; */
  position: fixed;
  width: 255px;
  height: 280px;
  top: 468px;
  right: 1%;
  transform: translate(1%, -50%);
  z-index: 99999;
}

.PC #it213-wrapper #INPUT_BOX .BOX_TOP {
  width: 255px;
  height: 131px;
  position: relative;
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/input_box/in_top2.png);
}

.PC #it213-wrapper #INPUT_BOX .BOX_TOP a {
  display: block;
  position: absolute;
  width: 24px;
  height: 24px;
  right: 10px;
  top: 10px;
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/input_box/in_top_x.png);
  text-indent: -9999px;
}

.PC #it213-wrapper #INPUT_BOX .BOX_FOOT {}

.PC #it213-wrapper #INPUT_BOX .BOX_BG {
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/input_box/in_bg.png);
  /* width: 225px; */
  overflow: hidden;
  padding: 0 10px 0 20px;
  text-align: center;
}

.PC #it213-wrapper #INPUT_BOX .BOX_BG p {
  margin: 8px auto;
}

.PC #it213-wrapper #INPUT_BOX .BLANK3 {
  height: 10px;
}

.PC #it213-wrapper #INPUT_BOX a.BT_PAY {
  display: block;
  width: 140px;
  height: 33px;
  background-position: 0px 0px;
  text-indent: -9999px;
  margin: 0 auto;
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/input_box/bt_input.png);
}

.PC #it213-wrapper #INPUT_BOX a.BT_PAY:hover {
  background-position: 0px -33px;
}

.PC #it213-wrapper #INPUT_BOX .txt01 {
  font-size: 12pt;
  color: #cc0000;
  line-height: 16px;
  font-family: Arial;
  text-decoration: none;
  font-weight: bold;
}

.PC #it213-wrapper #INPUT_BOX .txt02 {
  font-size: 10pt;
  color: #333333;
  line-height: 16px;
  font-family: "Arial";
  text-decoration: line-through;
}

/*=========================浮水購買區塊尾================*/

/*=========================列印頁面區================*/

.PC #it213 .PRINT_TOP {
  width: 680px;
  height: 200px;
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/print.jpg);
  margin: 0 auto;
}

.PC #it213 .PRINT_BG {
  width: 678px;
  border: 1px solid #59710e;
  background-color: #fff;
  margin: 0 auto;
}

/*=========================列印頁面尾區================*/

/*平板小於內容js縮放*/

@media screen and (max-width: 1090px) {
  .PC #it213 {
    width: 1090px !important;
    transform-origin: 0 0;
  }
}

/*==============================手機版=======手機版=====手機版====手機版===============================================*/

.MOBILE .PC_LOGIN,
.MOBILE .FOOT_PC {
  display: none;
}

/*MOBILE表頭尾*/

.MOBILE #float_icon,
.MOBILE #header,
.MOBILE .FOOT_MOBILE {
  width: 100%;
}

/*MOBILE表頭尾*/

/*消失區*/

.MOBILE #it213-wrapper #INPUT_BOX {
  display: none;
}

/*消失區尾*/

/*框架區*/

.MOBILE #it213 {
  width: 100%;
  height: auto;
  overflow: hidden;
  margin-top: 45px;
}

.MOBILE #it213 .FRAME {
  width: 100%;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
}

/*框架區尾*/

/*表頭區*/

.MOBILE #it213 .e_TOP {
  width: 100%;
  height: 0;
  padding-bottom: 52%;
  background: url(https://imgs.click108.com.tw/unit001/item00213/images/top_bg.png) no-repeat top center;
  background-size: cover;
  margin: 0 auto;
}

.MOBILE #it213 h1 {
  width: 100%;
  height: 0;
  padding-bottom: 55%;
  background: url(https://imgs.click108.com.tw/unit001/item00213/images/top_title.png) no-repeat top center;
  background-repeat: no-repeat;
  background-position: -18px -5px;
  background-size: cover;
  text-indent: -9999px;
}

/*表頭區尾*/

/*內容區*/

.MOBILE #it213 .CONTENT {
  width: 100%;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/con_bg.jpg);
  background-size: 100% auto;
}

/*內容框架*/

.MOBILE #it213 .CONTENT img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0 auto;
}

.MOBILE #it213 .CONTENT_TOP img,
.MOBILE #it213 .CONTENT_FOOT img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0 auto;
}

/*共用按鈕*/

.MOBILE #it213 .e_BT {
  width: 90%;
  height: 40px;
  margin: 0 auto;
}

.MOBILE #it213 .e_BT ul.ONE {
  width: 100%;
  height: 50px;
}

.MOBILE #it213 .e_BT ul.ONE li {
  width: 100%;
  margin: 0 auto;
  height: 50px;
}

.MOBILE #it213 .e_BT ul.ONE li a {
  width: 100%;
  margin: 0 auto;
  height: 50px;
  color: #fff;
  font-size: 1.5em;
  font-weight: bold;
  text-align: center;
  line-height: 47px;
}

.MOBILE #it213 .e_BT ul.TOW {
  width: 100%;
  height: 50px;
}

.MOBILE #it213 .e_BT ul.TOW li {
  float: left;
  width: 50%;
}

.MOBILE #it213 .e_BT li a {
  display: block;
  width: 95%;
  margin: 0 auto;
  height: 50px;
  color: #fff;
  text-decoration: none;
}

.MOBILE #it213 .e_BT li a.ALINE {
  font-size: 1.1em;
  font-weight: bold;
  text-align: center;
  line-height: 47px;
}

.MOBILE #it213 .e_BT li a.BLINE {
  font-size: 1.1em;
  /* height:45px; */
  font-weight: bold;
  text-align: center;
  padding-top: 5px;
  line-height: 1.2em;
}

.MOBILE #it213 .e_BT li a.BLINE span.BR {
  display: block;
}

.MOBILE #it213 a.COLOR {
  background-color: #b34fa8;
  background: -moz-linear-gradient(top, #b34fa8 0%, #760b6a);
  background: -webkit-gradient( linear, left top, left bottom, from(#b34fa8), to(#760b6a));
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  border: 1px solid #760b6a;
  -moz-box-shadow: inset 0px 0px 2px rgba(255, 255, 255, 1);
  -webkit-box-shadow: inset 0px 0px 2px rgba(255, 255, 255, 1);
  box-shadow: inset 0px 0px 2px rgba(255, 255, 255, 1);
}

/*=========================輸入頁面頭區================*/

.MOBILE #it213 .CON_BOX {
  width: 92%;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
}

.MOBILE #it213 .WHAT_BOX02_BAR {
  width: 100%;
  background-color: #942f87;
  height: 50px;
  margin: 10px auto 0 auto;
  font-size: 1.3em;
  line-height: 50px;
  color: #fff;
  font-weight: bold;
  text-indent: 15px;
  position: relative;
  font-weight: bold;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
}

.MOBILE #it213 .WHAT_BOX02_BAR .DR_DOWN a {
  position: absolute;
  display: block;
  width: 30px;
  height: 30px;
  background-size: 20px 20px;
  background-repeat: no-repeat;
  right: 0px;
  top: 15px;
}

.MOBILE #it213 .WHAT_BOX_BG {
  width: 100%;
  height: auto;
  overflow: hidden;
  clear: both;
  margin: 0 auto 15px auto;
  padding: 15px 0;
  background-color: #fdf9fe;
  box-shadow: inset 0px 0px 25px rgba(227, 153, 219, 1);
  -webkit-box-shadow: inset 0px 0px 25px rgba(227, 153, 219, 1);
  -moz-box-shadow: inset 0px 0px 25px rgba(227, 153, 219, 1);
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
}

.MOBILE #it213 .WHAT_BOX_BG .LISTBOX {
  width: 97%;
  margin: 0 auto;
  height: auto;
  overflow: hidden;
}

.MOBILE #it213 .WHAT_BOX_BG .LISTBOX li {
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/input_icon.png);
  background-repeat: no-repeat;
  background-size: 25px 25px;
  background-position-x: 7px;
  background-position-y: 2px;
  padding-left: 2em;
  width: 88%;
  margin-bottom: 5px;
  font-size: 1.1em;
  color: #333;
  line-height: 1.6em;
}

.MOBILE #it213 .WHAT_BOX_BG .LISTBOX ul li>ul li {
  width: 88%;
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/dot.png);
  background-repeat: no-repeat;
  background-size: 10px 10px;
  background-position-x: 5px;
  background-position-y: 5px;
  background-position: 5px 5px;
  padding-left: 20px;
  color: #333;
  font-weight: normal;
  font-size: 1em;
  margin-bottom: 0px;
}

/*BOX01尾*/

/*CON_BOX_BAR樣式二*/

.MOBILE #it213 .CON_BOX_BAR02 {
  /*NEW*/
  width: 100%;
  height: 60px;
  margin: 0 auto;
  background-color: #f6e3ff;
  -webkit-box-sizing: border-box;
}

.MOBILE #it213 .CON_BOX_BAR02 p {
  /*NEW*/
  font-size: 1.4em;
  line-height: 60px;
  color: #7e00b9;
  font-weight: bold;
  text-align: center;
}

@media screen and (max-width: 320px) {
  .MOBILE #it213 .CON_BOX_BAR02 p {
    font-size: 1.2em;
  }
  .MOBILE #it213 .WHAT_BOX02_BAR {
    font-size: 1.2em;
  }
}

.MOBILE #it213 .CON_BOX_BG02 {
  /*NEW*/
  width: 100%;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
  border: 1px solid #f0cfff;
  -webkit-box-sizing: border-box;
}

.MOBILE #it213 .CON_BOX img {
  display: block;
  width: 100%;
  margin: 0 auto;
}

.MOBILE #it213 .CON_BOX_BG02 .BOX_INSET {
  /*內縮*/
  width: 90%;
  height: auto;
  clear: both;
  overflow: hidden;
  margin: 0 auto;
  margin: 10px auto;
}

.MOBILE #it213 .CON_BOX_BG02 .LISTIMG {
  /*配圖*/
  width: 80%;
  margin: 0 auto;
}

.MOBILE #it213 .CON_BOX_BG02 .LISTBOX {
  width: auto;
  height: auto;
  overflow: hidden;
}

.MOBILE #it213 .CON_BOX_BG02 .LISTBOX li {
  width: auto;
  height: auto;
  overflow: hidden;
  margin-bottom: 5px;
}

.MOBILE #it213 .CON_BOX_BG02 .LISTBOX li>ul li {
  width: auto;
  height: auto;
  overflow: hidden;
  line-height: 1.6em;
  font-size: 1.2em;
  color: #333;
}

.MOBILE #it213 .CON_BOX_BG02 .LISTBOX ul li.LIST_ICON {
  float: left;
  width: 18px;
  height: 18px;
  margin-right: 5px;
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/input_icon2.png);
  background-position: left bottom;
  background-repeat: no-repeat;
  margin-top: 3px;
}

/*輸入框*/

.MOBILE #it213 .ENTER_TOP_BAR {
  width: 100%;
  height: 50px;
  background-color: #a95f00;
  margin: 15px auto 0 auto;
  text-align: center;
  font-size: 1.3em;
  line-height: 50px;
  color: #fff;
  font-weight: bold;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
}

.MOBILE #it213 .ENTER_BG {
  width: 100%;
  height: auto;
  overflow: hidden;
  background-color: #fff;
  border: 1px solid #a95f00;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 15px 10px;
}

.MOBILE #it213 .ENTER_BG .e_BT {
  width: 100%;
}

.MOBILE #it213 .ENTER_FOOT {
  margin: 0 auto 15px auto;
}

.MOBILE #it213 .CON_BOX img,
.CON_BOX02_FOOT {
  display: block;
  width: 100%;
  margin: 0 auto;
}

/*=========================輸入頁面尾區================*/

/*=========================結果頁面頭區================*/

/*第一塊引導區*/

.MOBILE #it213 .GUIDE {
  width: 95%;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
}

.MOBILE #it213 .GUIDE li.TEXT {
  width: 100%;
}

.MOBILE #it213 .GUIDE li.PH {
  display: none;
}

.MOBILE #it213 .GUIDE li.PH img,
.MOBILE #it213 .GUIDE li.TEXT .BLANK {
  display: none;
}

/*個人資料*/

.MOBILE #it213 .INFOR {
  height: auto;
  overflow: hidden;
  margin: 0 auto;
  text-align: center;
  padding: 10px 0px;
}

.MOBILE #it213 .INFOR .T03 {
  font-size: 1em;
  line-height: 1.6em;
  color: #333;
}

.MOBILE #it213 .INFOR .GENDER {
  display: inline-block;
  width: 20px;
  height: 20px;
  margin: 0 auto;
  margin-bottom: -5px;
}

.MOBILE #it213 .INFOR .GENDER img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0 auto;
}

/*個人資料尾*/

/*結果頁內容區框架*/

.MOBILE #it213 .RE_TOP_FOOT {
  /*標題圖*/
  border-bottom: 2px solid #59710e;
}

.MOBILE #it213 .RE_TOP_FOOT img {
  clear: both;
  display: block;
  width: 100%;
  margin: 0 auto;
}

.MOBILE #it213 .RE_BG {
  /*框線*/
  width: 100%;
  height: auto;
  overflow: hidden;
  border: 2px solid #59710e;
  margin: 0 auto;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.MOBILE #it213 .RE_NOSTYLE_COM {
  /*無樣式內容框*/
  width: 95%;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
  padding: 10px 0 10px 0;
}

/*內容欄位樣式用尾*/

.MOBILE #it213 .BAR {
  clear: both;
  width: 100%;
  height: 45px;
  margin: 0 auto;
  background-color: #ef808b;
  font-size: 1.4em;
  line-height: 45px;
  color: #fff;
  text-align: center;
}

/*姓名五行內容*/

.MOBILE #it213 .NAME_FIVE {
  width: 100%;
  height: auto;
  overflow: hidden;
}

.MOBILE #it213 .NAME_FIVE_BG {
  width: 100%;
  height: 0;
  padding-bottom: 78.644578313253%;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

.MOBILE #it213 .NAME_TEXT01 ul {
  width: 28%;
  height: 100px;
  margin: 0 auto;
  text-align: center;
  position: absolute;
  top: 20vw;
  left: 15%;
}

.MOBILE #it213 .NAME_TEXT01 li {
  float: left;
  width: 50%;
}

.MOBILE #it213 .NAME_TEXT02 ul {
  width: 45%;
  height: 100px;
  margin: 0 auto;
  text-align: center;
  position: absolute;
  top: 20vw;
  right: 0%;
}

.MOBILE #it213 .NAME_TEXT02 li {
  float: left;
  width: 33.3333333%;
}

.MOBILE #it213 .NAME_TEXT03 {
  width: 50%;
  height: 10vw;
  margin: 0 auto;
  text-align: center;
  position: absolute;
  top: 8vw;
  left: 25%;
}

.MOBILE #it213 .NAME_TEXT04 ul {
  width: 60%;
  height: 5vw;
  margin: 0 auto;
  text-align: center;
  position: absolute;
  bottom: 25vw;
  left: 20%;
}

.MOBILE #it213 .NAME_TEXT04 li {
  float: left;
  width: 33.3333333334%;
  height: 5vw;
  margin: 0 auto;
  text-align: center;
}

.MOBILE #it213 .NAME_TEXT05 {
  width: 50%;
  height: 8vw;
  margin: 0 auto;
  text-align: center;
  position: absolute;
  bottom: 13%;
  left: 25%;
  background-color: #c77c6e;
  -moz-border-radius: 50px;
  -webkit-border-radius: 50px;
  border-radius: 50px;
  color: #fff;
  font-weight: bold;
  font-size: 6vw;
  /* line-height: 8vw; */
}

.MOBILE #it213 .NAME_TEXT05>p {
  width: 100%;
  position: absolute;
  left: 50%;
  top: 53%;
  transform: translate(-50%, -50%);
}

.MOBILE #it213 .NAME_TEXT06 {
  width: 100%;
  height: 3vw;
  margin: 0 auto;
  text-align: center;
  position: absolute;
  bottom: 5vw;
  color: #460000;
  font-size: 3vw;
  line-height: 3vw;
}

/*姓名五行字型*/

.MOBILE #it213 .NAME_FIVE .NAM {
  width: 100%;
  height: 13vw;
  font-size: 12vw;
  line-height: 12vw;
  color: #000;
}

.MOBILE #it213 .NAME_FIVE .NAM_S {
  width: 100%;
  height: 6vw;
  font-size: 3vw;
  line-height: 3vw;
  color: #000;
}

.MOBILE #it213 .NAME_FIVE .NAM_S02 {
  font-size: 3vw;
  color: #999;
}

.MOBILE #it213 .NAME_FIVE .NAM_S03 {
  font-size: 5vw;
  line-height: 6vw;
  color: #762200;
  font-weight: bold;
}

.MOBILE #it213 .NAME_FIVE .NAM_RED {
  color: #cc0000;
}

.MOBILE #it213 .NAME_FIVE .NAM_YELLOW {
  color: #ffea00;
}

/*姓名五行內容尾*/

/*五行陣-龍*/

.MOBILE #it213 .FIVE {
  width: 100%;
  height: auto;
  overflow: hidden;
  margin-top: 10px;
}

.MOBILE #it213 .FIVE_BG {
  width: 100%;
  height: 0;
  padding-bottom: 69%;
  position: relative;
  background-repeat: no-repeat;
  background-position: top center;
  background-size: 100% auto;
}

.MOBILE #it213 .FIVE_BG .BALL01 {
  width: 30%;
  height: 0;
  padding-bottom: 30%;
  position: absolute;
  left: 18%;
  top: 26%;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

.MOBILE #it213 .FIVE_BG .BALL02 {
  width: 30%;
  height: 0;
  padding-bottom: 30%;
  position: absolute;
  right: 18%;
  top: 26%;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

.MOBILE #it213 .FIVE_BG .BA_TEXT {
  /*球中字型*/
  font-size: 4vw;
  line-height: 3vw;
  color: #000;
  text-align: center;
  margin-top: 26%;
  text-shadow: 0px 0px 15px #fff;
}

.MOBILE #it213 .FIVE_BG .BA_TEXT02 {
  /*球中字型*/
  font-size: 11vw;
  line-height: 13vw;
  color: #000;
  text-align: center;
  font-weight: bold;
  text-shadow: 2px 2px 15px #fff;
}

.MOBILE #it213 .FIVE_BG .CENTER_TEXT {
  width: 80vw;
  height: 20vw;
  position: absolute;
  left: 6%;
  top: 69%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

.MOBILE #it213 .FIVE_BG .CENTER_TEXT ul {
  display: block;
  margin: 3% auto;
  width: 82%;
  height: 15vw;
  background-color: #fffde2;
}

.MOBILE #it213 .FIVE_BG .CENTER_TEXT ul li:nth-child(1) {
  width: 100%;
  height: auto;
  font-size: 4vw;
  line-height: 1.6em;
  color: #fff;
  text-align: center;
}

.MOBILE #it213 .FIVE_BG .CENTER_TEXT ul li:nth-child(2) {
  width: 100%;
  height: auto;
  overflow: hidden;
  font-size: 6vw;
  line-height: 1.6em;
  color: #000;
  font-weight: bold;
  text-align: center;
}

.MOBILE #it213 .FIVE_BG .CENTER_TEXT ul li img {
  width: 80%;
  height: auto;
}

/*五行陣end*/

.MOBILE #it213 .FRAME_TITLE {
  width: 100%;
  height: 0;
  padding-bottom: 18.6%;
  background-size: cover;
  margin: 5px auto;
  font-size: 5.5vw;
  line-height: 16vw;
  color: #000;
  text-align: center;
  font-weight: bold;
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/frame_title.jpg);
}

.MOBILE #it213 .FRAME_WORD {
  width: 100%;
  height: 0;
  padding-bottom: 23%;
  margin: 10px auto;
  font-size: 8vw;
  line-height: 19vw;
  color: #000;
  text-align: center;
  font-weight: bold;
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/frame.jpg);
  background-size: cover;
  background-position: center;
}

.MOBILE #it213 .FRAME_WORD img {
  width: 70%;
  height: auto;
  padding-top: 3vw;
}

/*歲數運勢*/

.MOBILE #it213 .L_CALENDAR {
  width: 100%;
  height: auto;
  overflow: hidden;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.MOBILE #it213 .L_CALENDAR ul {
  width: 100%;
  height: auto;
  overflow: hidden;
  clear: both;
  border-bottom: 1px solid #f3ca98;
}

.MOBILE #it213 .L_CALENDAR ul:last-child {
  border: none;
}

.MOBILE #it213 .L_CALENDAR li {
  float: none;
  height: auto;
  overflow: hidden;
  font-weight: normal;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.MOBILE #it213 .L_CALENDAR li:nth-child(odd) {
  width: 100%;
  height: auto;
  overflow: hidden;
}

.MOBILE #it213 .L_CALENDAR li:nth-child(even) {
  width: 100%;
  padding: 10px;
  overflow: hidden;
  font-size: 1.1em;
  line-height: 1.6em;
  text-align: left;
  color: #333;
}

.MOBILE #it213 .L_CALENDAR .SEAL {
  width: 152px;
  height: 82px;
  margin: 10px auto;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

/*歲數尾*/

/*開運配圖內容*/

.MOBILE #it213 .MAP_COM {
  width: 100%;
  height: auto;
  overflow: hidden;
}

.MOBILE #it213 .MAP_COM .MAP_PH {
  width: 60%;
  height: auto;
  overflow: hidden;
  margin: 5px auto;
}

.MOBILE #it213 .MAP_COM .MAP_PH img {
  width: 100%;
  height: auto;
}

.MOBILE #it213 .MAP_COM .MAP_TEXT {
  width: 100%;
  height: auto;
  overflow: hidden;
  margin: 5px 0;
}

/*叮嚀*/

.MOBILE #it213 .EXHORT {
  width: 100%;
  height: auto;
  overflow: hidden;
  clear: both;
}

.MOBILE #it213 .EXHORT li:nth-child(1) {
  width: 60%;
  height: auto;
  overflow: hidden;
  margin: 5px auto;
}

.MOBILE #it213 .EXHORT li:nth-child(2) {
  width: 100%;
  height: auto;
  overflow: hidden;
}

/*叮嚀*/

.MOBILE #it213 .PRINT {
  display: none;
}

/*========================結果頁面尾區================*/

/*=========================試算頁面頭區================*/

.MOBILE #it213-wrapper .NEW_BT_F {
  /*浮水按鈕*/
  width: 100%;
  height: 60px;
  position: fixed;
  bottom: 0;
  z-index: 1000;
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/bt_bg.png);
  background-repeat: repeat;
  padding-top: 8px;
  background-size: 15px 15px;
}

.MOBILE #it213-wrapper .NEW_BT_F a {
  /*浮水按鈕*/
  display: block;
  width: 95%;
  margin: 0 auto;
  height: 50px;
  font-size: 1.5em;
  color: #fff;
  font-weight: bold;
  text-align: center;
  line-height: 47px;
  text-decoration: none;
  background-color: #b34fa8;
  background: -moz-linear-gradient(top, #b34fa8 0%, #760b6a);
  background: -webkit-gradient( linear, left top, left bottom, from(#b34fa8), to(#760b6a));
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  border: 1px solid #760b6a;
  -moz-box-shadow: inset 0px 0px 2px rgba(255, 255, 255, 1);
  -webkit-box-shadow: inset 0px 0px 2px rgba(255, 255, 255, 1);
  box-shadow: inset 0px 0px 2px rgba(255, 255, 255, 1);
}

.MOBILE #it213 .SAMPLE {
  width: 100%;
  height: 150px;
  position: relative;
  background-position: -5px top;
  margin: 3px auto;
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/fuzzy.png);
}

.MOBILE #it213 .SAMPLE02 {
  height: 50px;
}

.MOBILE#it213 .SAMPLE03 {
  height: 80px;
}

.MOBILE #it213 .FREE_PH {
  width: 100%;
  height: 0;
  padding-bottom: 26.44%;
  background-size: cover;
  background-repeat: no-repeat;
  background-image: url(https://imgs.click108.com.tw/unit001/item00213/images/rem_ph.jpg);
  margin: 15px auto 10px auto;
  clear: both;
}

/*免費頁 動畫*/

.MOBILE #it213 .ANI {
  width: 100%;
  height: 0;
  padding-bottom: 68%;
  position: relative;
  -webkit-animation: fpage 5s infinite ease-out;
  -moz-animation: fpage 5s infinite ease-out;
  animation: fpage 5s infinite ease-out;
}

@-webkit-keyframes fpage {
  10% {
    background-color: rgba(255, 255, 255, 0.8);
  }
  40% {
    background-color: rgba(255, 255, 255, 0);
  }
  50% {
    background-color: rgba(255, 255, 255, 0);
  }
  60% {
    background-color: rgba(255, 255, 255, 0);
  }
  70% {
    background-color: rgba(255, 255, 255, 0);
  }
  80% {
    background-color: rgba(255, 255, 255, 0);
  }
  90% {
    background-color: rgba(255, 255, 255, 0);
  }
  100% {
    background-color: rgba(255, 255, 255, 0);
  }
}

@-moz-keyframes fpage {
  10% {
    background-color: rgba(255, 255, 255, 0.8);
  }
  40% {
    background-color: rgba(255, 255, 255, 0);
  }
  50% {
    background-color: rgba(255, 255, 255, 0);
  }
  60% {
    background-color: rgba(255, 255, 255, 0);
  }
  70% {
    background-color: rgba(255, 255, 255, 0);
  }
  80% {
    background-color: rgba(255, 255, 255, 0);
  }
  90% {
    background-color: rgba(255, 255, 255, 0);
  }
  100% {
    background-color: rgba(255, 255, 255, 0);
  }
}

@keyframes fpage {
  10% {
    background-color: rgba(255, 255, 255, 0.8);
  }
  40% {
    background-color: rgba(255, 255, 255, 0);
  }
  50% {
    background-color: rgba(255, 255, 255, 0);
  }
  60% {
    background-color: rgba(255, 255, 255, 0);
  }
  70% {
    background-color: rgba(255, 255, 255, 0);
  }
  80% {
    background-color: rgba(255, 255, 255, 0);
  }
  90% {
    background-color: rgba(255, 255, 255, 0);
  }
  100% {
    background-color: rgba(255, 255, 255, 0);
  }
}

/*免費頁 動畫尾*/

/*=========================試算頁面尾區================*/