﻿@import url("reset.css");

body {
  -webkit-text-size-adjust: none;
  text-decoration: none;
  font-family: "微軟正黑體", "Microsoft JhengHei", "新細明體", "細明體", Arial,
    Helvetica;
  background-color: #fffef7;
}
/*共用字型*/
#it212 .T01 {
  font-size: 1.1em;
  line-height: 1.6em;
  color: #333;
}
#it212 .T02 {
  font-size: 1.2em;
  line-height: 1.6em;
  color: #333;
}
#it212 .T03 {
  font-size: 1.2em;
  line-height: 1.6em;
  color: rgb(255, 152, 35);
  font-weight: bold;
  margin-bottom: 10px;
}
#it212 .PURPLE {
  color: #e765d3;
}
#it212 .BLUE {
  color: #0083ba;
}
/*共用*/
#it212 .BLANK {
  width: 100%;
  height: 20px;
}
#it212 .BLANK02 {
  width: 100%;
  height: 10px;
}
#it212 .LINE {
  width: 100%;
  margin: 10px auto;
  height: 36px;
  background: url(https://imgs.click108.com.tw/unit001/item00212/images/line.png) no-repeat;
  background-position: center;
}
#it212 .HIDE {
  display: none;
}
#it212 .BOX_INSET {
  width: 90%;
  margin: 0 auto;
  margin-top: 15px;
  margin-bottom: 15px;
}
#it212 .LISTSTYLE_NONE {
  list-style: none;
}

/*==============桌機版================桌機版==============桌機版=============================================*/
/*PC表頭尾*/
.PC .PC_LOGIN {
  /*PC登入頭*/
  width: 100%;
  text-align: center;
  display: block;
  height: 38px;
  background-image: url(https://imgs.click108.com.tw/unit001/item00212/images/logomenu/bg.jpg);
}

.PC .FOOT_PC {
  width: 100%;
  height: auto;
  overflow: hidden;
  display: block;
}
/*PC表頭尾*/

/*消失區*/
.PC #float_icon,
.PC #header,
.PC .FOOT_MOBILE {
  display: none;
}
/*消失區尾*/

/*框架區*/
.PC #it212 {
  width: 100%;
  height: auto;
  overflow: hidden;
  background-image: url(https://imgs.click108.com.tw/unit001/item00212/images/bg.jpg);
  background-repeat: repeat-x;
  background-position: top center;
}
.PC #it212 .FRAME {
  width: 100%;
  height: auto;
  overflow: hidden;
}
/*框架區尾*/

/*輸入頁表頭區*/
.PC #it212 .IP_FRAME {
  width: 100%;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
  background-image: url(https://imgs.click108.com.tw/unit001/item00212/images/input_bg.jpg);
  background-position: top center;
  background-repeat: no-repeat;
}
.PC #it212 .IP_TOP {
  width: 750px;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
}
.PC #it212 .IP_TOP h1 {
  width: 750px;
  height: 191px;
  margin: 20px auto 0 auto;
  background: url(https://imgs.click108.com.tw/unit001/item00212/images/input_top_title.png) no-repeat;
  text-indent: -9999px;
}
/*輸入頁表頭區尾*/

/*內容區*/
.PC #it212 .CONTENT {
  width: 750px;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
  background-image: url(https://imgs.click108.com.tw/unit001/item00212/images/con_bg.jpg);
  background-size: 100% auto;
}
/*內容框架*/
.PC #it212 .CONTENT_TOP img,
.PC #it212 .CONTENT_FOOT img {
  display: block;
  width: 750px;
  height: 49px;
  margin: auto;
}
/*內容區尾*/

/*共用按鈕*/
.PC #it212 .e_BT {
  clear: both;
  width: 90%;
  margin: 0 auto;
}

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

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

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

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

.PC #it212 .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 #it212 .e_BT li a.ALINE {
  font-size: 1.5em;
  font-weight: bold;
  text-align: center;
  line-height: 47px;
}
.PC #it212 .e_BT li a.BLINE {
  font-size: 1.5em;
  font-weight: bold;
  text-align: center;
  line-height: 47px;
}

.PC #it212 .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;
}
.NEW_BT_F a.COLOR {
  background-color: #bf31d9;
  background: -moz-linear-gradient(top, #bf31d9 0%, #3b165e);
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#bf31d9),
    to(#3b165e)
  );
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  border: 1px solid #763493;
  -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);
}
.NEW_BT_F a.COLOR:hover {
  background-color: #3b165e;
  color: #fee300;
  background: -moz-linear-gradient(top, #3b165e 0%, #bf31d9);
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#3b165e),
    to(#bf31d9)
  );
}
.PC #it212 a.COLOR {
  background-color: #bf31d9;
  background: -moz-linear-gradient(top, #bf31d9 0%, #3b165e);
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#bf31d9),
    to(#3b165e)
  );
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  border: 1px solid #763493;
  -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 #it212 a.COLOR:hover {
  background-color: #3b165e;
  color: #fee300;
  background: -moz-linear-gradient(top, #3b165e 0%, #bf31d9);
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#3b165e),
    to(#bf31d9)
  );
}
/* =========================輸入頁面頭區================ */
.PC #it212 .CON_BOX {
  width: 670px;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
  padding-bottom: 20px;
}
.PC #it212 .CON_BOX_BAR {
  /* NEW */
  width: 670px;
  height: 65px;
  margin: 0 auto;
  background-color: #ff761e;
  box-shadow: 0px 0px 20px 0px rgba(255, 218, 189, 0.8) inset;
}
.PC #it212 .CON_BOX_BAR p {
  /*new*/
  font-size: 1.6em;
  line-height: 65px;
  color: #fff;
  font-weight: bold;
  text-align: center;
}
.PC #it212 .CON_BOX_BAR .P_ICON {
  /* NEW */
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  background-color: #fff;
  transform: rotate(45deg);
  margin-right: 10px;
  margin-bottom: 6px;
}
.PC #it212 .CON_BOX_BAR .P_ICON02 {
  /* NEW */
  margin-left: 10px;
}
.PC #it212 .CON_BOX_BG {
  /* NEW */
  width: 670px;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
  border: 1px solid #ffb445;
  box-shadow: 0px 0px 15px 10px rgba(255, 252, 236, 0.7) inset;
}
/* CON_BOX_BAR樣式二 */
.PC #it212 .CON_BOX_BAR02 {
  /* NEW */
  width: 670px;
  height: 60px;
  margin: 0 auto;
  background-color: #ffb445;
}
.PC #it212 .CON_BOX_BAR02 p {
  /* NEW */
  font-size: 1.6em;
  line-height: 60px;
  color: #333;
  font-weight: bold;
  text-align: center;
}
.PC #it212 .CON_BOX_BG02 {
  /* NEW */
  width: 670px;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
  border: 1px solid #ffb445;
}
.PC #it212 .CON_BOX img {
  display: block;
  width: 100%;
  margin: 0 auto;
}
.PC #it212 .LISTIMG {
  /* 紫微合盤配圖 */
  float: left;
  width: 210px;
  margin-right: 15px;
}
.PC #it212 .LISTBOX {
  width: auto;
  height: auto;
  overflow: hidden;
}
.PC #it212 .LISTBOX li {
  width: auto;
  height: auto;
  overflow: hidden;
  margin-bottom: 5px;
}
.PC #it212 .LISTBOX li > ul li {
  width: auto;
  height: auto;
  overflow: hidden;
  line-height: 1.6em;
  font-size: 1.2em;
  color: #333;
}
.PC #it212 .LISTBOX .LIST_ICON {
  float: left;
  width: 18px;
  height: 18px;
  margin-right: 5px;
  background-image: url(https://imgs.click108.com.tw/unit001/item00212/images/input_icon2.png);
  background-position: left bottom;
  background-repeat: no-repeat;
  margin-top: 3px;
}
.PC #it212 .LISTBOX li.LISTWORD {
  /* 次要清單 */
  width: auto;
  height: auto;
  line-height: 1.6em;
  font-size: 1em;
  color: #333;
  text-indent: 0.1em;
}
.PC #it212 .LISTBOX li.LISTWORD::before {
  content: "";
  display: block;
  width: 18px;
  height: 18px;
  float: left;
  background-image: url(https://imgs.click108.com.tw/unit001/item00212/images/input_icon3.png);
  background-repeat: no-repeat;
  background-size: 85%;
  background-position: 0 7px;
}
/* =========================輸入頁面尾區================ */
/* =========================結果頁面頭區================ */
/* 標題 */
.PC #it212 .e_TOP {
  width: 100%;
  height: 230px;
  background: url(https://imgs.click108.com.tw/unit001/item00212/images/retop_bg.jpg) repeat-x top center;
  margin: 0 auto;
}
.PC #it212 h1 {
  width: 750px;
  height: 230px;
  margin: 0 auto;
  background-image: url(https://imgs.click108.com.tw/unit001/item00212/images/input_top_title.png);
  text-indent: -9999px;
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: center center;
}
/* 引言 */
.PC #it212 .INTRO {
  width: 670px;
  height: 231px;
  background: url(https://imgs.click108.com.tw/unit001/item00212/images/intro.jpg) no-repeat;
  padding: 32px 28px 0 240px;
  font-size: 1.1em;
  line-height: 1.5em;
  color: #333;
}
.PC #it212 .INTRO p:nth-of-type(1) {
  line-height: 1.7em;
}
/* 個人資料 */
.PC #it212 .INFOR {
  clear: both;
  width: 90%;
  height: auto;
  overflow: hidden;
  margin: 10px auto 0 auto;
}
.PC #it212 .INFOR img {
  display: inline-block;
  width: 24px;
  height: 24px;
  margin: 0 5px;
}
.PC #it212 .INFOR li {
  float: none;
  text-align: center;
}
.PC #it212 .INFOR_STAR {
  width: 90%;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
}
.PC #it212 .INFOR_STAR ul {
  margin-top: 10px;
}
.PC #it212 .INFOR_STAR li {
  float: left;
  width: 49%;
  height: 166px;
  background: url(https://imgs.click108.com.tw/unit001/item00212/images/re_01.png) no-repeat;
  background-size: 100% auto;
}
.PC #it212 .INFOR_STAR li p {
  color: #333;
  font-size: 2.5em;
  margin-top: 80px;
  text-align: center;
  font-weight: bold;
}
.PC #it212 .INFOR_STAR li:nth-child(2) {
  background-image: url(https://imgs.click108.com.tw/unit001/item00212/images/re_02.png);
  margin-left: 1%;
}
/* 結果頁內容區 */
.PC #it212 .RE_TOP {
  /* 大標頭 */
  clear: both;
  display: block;
  width: 670px;
  margin: 40px auto 0 auto;
}
.PC #it212 .RE_BG,
.PC #it212 .RE_BG2 {
  /* BOX背景 */
  width: 670px;
  height: auto;
  overflow: hidden;
  clear: both;
  margin: 0 auto;
  background-color: #fff;
  border: solid 2px #ff3562;
  padding: 5px 0;
}
.PC #it212 .RE_BG2 {
  border: solid 2px #0fbff0;
}
.PC #it212 .CON_BOX div:nth-of-type(2) {
  margin-top: 0px;
}
.PC #it212 .RE_BG_COM {
  /* 大段落 */
  width: 90%;
  height: auto;
  overflow: hidden;
  clear: both;
  margin: 20px auto;
  color: #333;
  text-align: justify;
}
.PC #it212 .RE_BG_COM ul.pq_CIRITEM {
  /* 實心圓點項目 */
  width: 100%;
  padding-left: 25px;
}
.PC #it212 .RE_BG_COM ul.pq_CIRITEM li {
  list-style: disc;
  margin-bottom: 15px;
}
.PC #it212 .RE_BG_COM ul.pq_SQITEM {
  /* 實心正方形項目 */
  width: 100%;
  padding-left: 25px;
}
.PC #it212 .RE_BG_COM ul.pq_SQITEM li {
  list-style: square;
  margin-bottom: 15px;
}
.PC #it212 .RE_BG_COM ul.SUPEI {
  /* 速配指數-兩欄位 */
  display: block;
  width: 100%;
  height: auto;
  overflow: hidden;
  padding: 3%;
  background-color: rgba(255, 252, 236, 0.7);
  border-radius: 10px;
  margin-top: 15px;
  box-shadow: 0px 0px 15px 10px rgb(255, 248, 207) inset;
}
.PC #it212 .RE_BG_COM ul.SUPEI li.TXT {
  /* 文字 */
  padding-top: 3px;
  height: auto;
  overflow: hidden;
  text-align: justify;
}
.PC #it212 .RE_BG_COM ul.SUPEI li.PIC_L {
  /* 指數底圖 */
  float: left;
  width: 49%;
  height: 0;
  padding-bottom: 26.9%;
  overflow: hidden;
  margin-right: 15px;
  background: url(https://imgs.click108.com.tw/unit001/item00212/images/re_03.png) no-repeat;
  background-size: cover;
}
.PC #it212 .RE_BG_COM ul.SUPEI li.PIC_L p {
  color: #ff0707;
  font-size: 3.8em;
  margin-top: 65px;
  text-align: center;
  font-weight: bold;
}
.PC #it212 .RE_BG_COM ul.SUPEI li.PIC_L span {
  font-size: 0.7em;
}
.PC #it212 .RE_BG_COM ul.FOREVER {
  /* 兩欄位 */
  display: block;
  width: 100%;
  height: auto;
  overflow: hidden;
}
.PC #it212 .RE_BG_COM ul.FOREVER li.TXT {
  /* 文字 */
  padding-top: 3px;
  height: auto;
  overflow: hidden;
  text-align: justify;
  font-weight: normal;
}
.PC #it212 .RE_BG_COM ul.FOREVER li.PIC_L {
  /* 配圖 */
  float: left;
  width: 35%;
  height: auto;
  margin-right: 2%;
}
.PC #it212 .RE_BG_COM ul.FOREVER li.PIC_R {
  /* 大師訊息 */
  float: right;
  width: 45%;
  height: auto;
  margin-left: 2%;
}
.PC #it212 .RE_BG_COM .HOUNYUN {
  /* 婚緣指數 */
  width: 100%;
  height: 0;
  padding-bottom: 38.65%;
  margin: 0 auto;
  background: url(https://imgs.click108.com.tw/unit001/item00212/images/re_04.png) no-repeat;
  background-size: contain;
  overflow: hidden;
}
.PC #it212 .RE_BG_COM .HOUNYUN p {
  color: #ff0707;
  font-size: 3.8em;
  line-height: 230px;
  text-align: center;
  font-weight: bold;
  padding-top: 20px;
  padding-left: 20px;
}
.PC #it212 .RE_BG_COM .HOUNYUN span {
  font-size: 0.7em;
}
.PC #it212 .RE_BG_COM .HOUNYUN_NAME {
  width: 589px;
  height: 90px;
  margin: 0 auto;
  background: url(https://imgs.click108.com.tw/unit001/item00212/images/re_05.jpg) no-repeat;
  background-size: cover;
}
.PC #it212 .RE_BG_COM .HOUNYUN_NAME img {
  display: inline-block;
  width: 25px;
  height: 25px;
  margin: 0 5px;
}
.PC #it212 .RE_BG_COM .HOUNYUN_NAME p {
  text-align: center;
  font-size: 2em;
  line-height: 90px;
}
/* ========================結果頁面尾區================ */
/* =========================試算頁面頭區================ */
.PC #it212-wrapper .NEW_BT_F {
  /* 浮水按鈕 */
  width: 100%;
  height: 60px;
  position: fixed;
  bottom: 0;
  z-index: 1000;
  background-image: url(https://imgs.click108.com.tw/unit001/item00212/images/bt_bg.png);
  background-repeat: repeat;
  padding-top: 5px;
  font: 15px/55px "微軟正黑體", Helvetica, Arial;
}
.PC #it212-wrapper .NEW_BT_F a {
  /* 浮水按鈕 */
  display: block;
  width: 300px;
  margin: 0 auto;
  height: 50px;
  font-size: 1.5em;
  color: #fff;
  font-weight: bold;
  text-align: center;
  line-height: 47px;
  text-decoration: none;
}
.PC #it212 .SAMPLE {
  width: 99%;
  height: 150px;
  position: relative;
  background-position: -5px top;
  margin: 3px auto;
  background-image: url(https://imgs.click108.com.tw/unit001/item00212/images/fuzzy.png);
}
.PC #it212 .SAMPLE2 {
  /* LIST模糊試算用 */
  width: 100%;
  margin: -19px 0 10px -6px;
  background-image: url(https://imgs.click108.com.tw/unit001/item00212/images/fuzzy.png);
}
.PC #it212 .FREE_PH {
  width: 100%;
  height: auto;
  overflow: hidden;
  margin: 30px auto 10px auto;
  clear: both;
}
.PC #it212 .FREE_PH img {
  clear: both;
  display: block;
  height: auto;
  margin: 0 auto;
}
/* =========================試算頁面尾區================ */
/* =========================浮水購買區塊================ */
#INPUT_BOX {
  position: fixed;
  width: 255px;
  height: 280px; /* right:5%;
	top: 420px; */
  top: 50%;
  right: 1%;
  transform: translate(1%, -50%);
  z-index: 99999;
}
#INPUT_BOX .BOX_TOP {
  width: 255px;
  height: 128px;
  position: relative;
  background-image: url(https://imgs.click108.com.tw/unit001/item00212/images/input_box/in_top2.png);
}
#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/item00212/images/input_box/in_top_x.png);
  text-indent: -9999px;
}
#INPUT_BOX .BOX_BG {
  background-image: url(https://imgs.click108.com.tw/unit001/item00212/images/input_box/in_bg.png);
  width: 255px;
  overflow: hidden;
  text-align: center;
}
#INPUT_BOX .BOX_BG p {
  margin: 8px auto;
}
#INPUT_BOX .BLANK3 {
  height: 10px;
}
#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/item00212/images/input_box/bt_input.png);
}
#INPUT_BOX a.BT_PAY:hover {
  background-position: 0px -33px;
}
#INPUT_BOX .txt01 {
  font-size: 15pt;
  color: #cc0000;
  line-height: 22px;
  font-family: Arial;
  text-decoration: none;
  font-weight: bold;
}
#INPUT_BOX .txt02 {
  font-size: 10pt;
  color: #333333;
  line-height: 16px;
  font-family: "Arial";
  text-decoration: line-through;
}
/* =========================浮水購買區塊尾================ */
/* =========================列印頁面區================ */
.PC #it212 .PRINT_TOP {
  width: 678px;
  height: 200px;
  background-image: url(https://imgs.click108.com.tw/unit001/item00212/images/print_top.jpg);
  background-position: center;
  margin: 0 auto 5px auto;
}
.PC #it212 .PRINT_BG {
  width: 680px;
  border: 1px solid #b8e6dd;
  background-color: #fff;
  margin: 0 auto;
}
/* =========================列印頁面尾區================ */
/* 平板小於內容js縮放 */
@media screen and (max-width: 1000px) {
  .PC #it212 {
    width: 1000px !important;
    transform-origin: 0 0;
  }
}
/* ===========================手機版============================ */
body.MOBILE {
  background-color: #fffef7;
  -webkit-box-sizing: border-box;
}

.MOBILE .PC_LOGIN,
.MOBILE .FOOT_PC {
  display: none;
}
/* MOBILE表頭尾 */
.MOBILE #float_icon,
.MOBILE #header,
.MOBILE .CHANG,
.MOBILE .FOOT_MOBILE {
  display: block;
}
/* MOBILE表頭尾 */
/* 消失區 */
.MOBILE #it212-wrapper #INPUT_BOX {
  display: none;
}
/* 消失區尾 */
/* 框架區 */
.MOBILE #it212 {
  width: 100%;
  height: auto;
  overflow: hidden;
  margin-top: 45px;
}
.MOBILE #it212 .FRAME {
  width: 100%;
  height: auto;
  overflow: hidden;
}
/* 框架區尾 */
/* 輸入頁表頭區 */
.MOBILE #it212 .IP_FRAME {
  width: 100%;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
  background-image: url(https://imgs.click108.com.tw/unit001/item00212/images/input_bg.jpg);
  background-position: top center;
  background-size: 250% auto;
  background-repeat: no-repeat;
}
.MOBILE #it212 .IP_TOP {
  width: 100%;
  margin: 0 auto;
}
.MOBILE #it212 .IP_TOP h1 {
  width: 100%;
  height: 0px;
  overflow: hidden;
  padding-bottom: 25.46%;
  margin-top: 10px;
  background-image: url(https://imgs.click108.com.tw/unit001/item00212/images/input_top_title.png);
  background-position: top center;
  background-size: cover;
  background-repeat: no-repeat;
  text-indent: -9999px;
}
.MOBILE #it212 .IP_TOP .TARO_W {
  width: 100%;
  margin: 0 auto;
}
.MOBILE #it212 .IP_TOP .TARO_W img {
  width: 100%;
  height: auto;
}
/* 輸入頁表頭區尾 */
/* 內容區 */
.MOBILE #it212 .CONTENT {
  width: 100%;
  height: auto;

  overflow: hidden;
  margin: 0 auto;
  background-color: #fafffd;
  padding: 0 5px;
}
/* 內容框架 */
.MOBILE #it212 .CONTENT img,
.MOBILE #it212 .CONTENT_FOOT img {
  display: none;
}
/* 共用按鈕 */
.MOBILE #it212 .e_BT {
  width: 100%;
  height: 50px;
  margin: 0 auto;
}
.MOBILE #it212 .e_BT ul.ONE {
  width: 100%;
  height: 50px;
}
.MOBILE #it212 .e_BT ul.ONE li {
  width: 100%;
  margin: 0 auto;
  height: 50px;
}
.MOBILE #it212 .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 #it212 .e_BT ul.TOW {
  width: 100%;
  height: 50px;
}
.MOBILE #it212 .e_BT ul.TOW li {
  float: left;
  width: 50%;
}
.MOBILE #it212 .e_BT li a {
  display: block;

  width: 95%;
  margin: 0 auto;
  height: 50px;
  color: #fff;
  text-decoration: none;
}
.MOBILE #it212 .e_BT li a.ALINE {
  font-size: 1.1em;
  font-weight: bold;
  text-align: center;
  line-height: 47px;
}
.MOBILE #it212 .e_BT li a.BLINE {
  font-size: 1.1em;
  height: 50px;
  font-weight: bold;
  text-align: center;
  padding-top: 5px;
  line-height: 1.2em;
}
.MOBILE #it212 .e_BT li a.BLINE span.BR {
  display: block;
}
.MOBILE #it212 a.COLOR {
  background-color: #bf31d9;
  background: -moz-linear-gradient(top, #bf31d9 0%, #3b165e);
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#bf31d9),
    to(#3b165e)
  );
  border: 1px solid #763493;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -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);
}
/* =========================輸入頁面頭區================ */
/* BOX01頭 */
.MOBILE #it212 .CON_BOX {
  width: 99%;
  height: auto;
  overflow: hidden;
  margin: 0 auto 20px auto;
}
.MOBILE #it212 .CON_BOX_BAR {
  /* NEW */
  width: 100%;
  height: 60px;
  margin: 0 auto;
  background-color: #ff761e;
  box-shadow: 0px 0px 20px 0px rgba(255, 218, 189, 0.8) inset;
}
.MOBILE #it212 .CON_BOX_BAR p {
  /* NEW */
  font-size: 1.6em;
  line-height: 65px;
  color: #fff;
  font-weight: bold;
  text-align: center;
}
.MOBILE #it212 .CON_BOX_BAR .P_ICON {
  /* NEW */
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  background-color: #fff;
  transform: rotate(45deg);
  margin-right: 10px;
  margin-bottom: 6px;
}
.MOBILE #it212 .CON_BOX_BAR .P_ICON02 {
  /*new*/
  margin-left: 10px;
}
.MOBILE #it212 .CON_BOX_BG {
  /* NEW */
  width: 100%;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
  border: 1px solid #ffb445;
  box-shadow: 0px 0px 15px 10px rgba(255, 252, 236, 0.7) inset;
  padding-bottom: 20px;
}
/* CON_BOX_BAR樣式二 */
.MOBILE #it212 .CON_BOX_BAR02 {
  /* NEW */
  width: 100%;
  height: 50px;
  margin: 0 auto;
  background-color: #ffb445;
}
.MOBILE #it212 .CON_BOX_BAR02 p {
  /* NEW */
  font-size: 1.6em;
  line-height: 50px;
  color: #333;
  font-weight: bold;
  text-align: center;
}
.MOBILE #it212 .CON_BOX_BG02 {
  /* NEW */
  width: 100%;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
  border: 1px solid #ffb445;
}
.MOBILE #it212 .CON_BOX img {
  display: block;
  width: 100%;
  margin: 0 auto;
}
.MOBILE #it212 .LISTIMG {
  /* 紫微合盤配圖 */
  width: 80%;
  margin: 0 auto;
}
.MOBILE #it212 .LISTIMG img {
  display: inline-block;
  width: 100%;
  height: auto;
}
.MOBILE #it212 .INSET_TOP {
  /* 上內縮 */
  padding-top: 0;
}
.MOBILE #it212 .LISTBOX {
  width: auto;
  height: auto;
  overflow: hidden;
}
.MOBILE #it212 .LISTBOX li {
  width: auto;
  height: auto;
  overflow: hidden;
  margin-bottom: 5px;
}
.MOBILE #it212 .LISTBOX li > ul li {
  width: auto;
  height: auto;
  overflow: hidden;
  line-height: 1.6em;
  font-size: 1.2em;
  color: #333;
}
.MOBILE #it212 .LISTBOX .LIST_ICON {
  float: left;
  width: 18px;
  height: 18px;
  margin-right: 5px;
  background-image: url(https://imgs.click108.com.tw/unit001/item00212/images/input_icon2.png);
  background-position: left bottom;
  background-repeat: no-repeat;
  margin-top: 3px;
}
.MOBILE #it212 .LISTBOX li.LISTWORD {
  /* 次要清單 */
  width: auto;
  height: auto;
  line-height: 1.6em;
  font-size: 1em;
  color: #333;
  text-indent: 0.1em;
}
.MOBILE #it212 .LISTBOX li.LISTWORD::before {
  content: "";
  display: block;
  width: 18px;
  height: 18px;
  float: left;
  background-image: url(https://imgs.click108.com.tw/unit001/item00212/images/input_icon3.png);
  background-repeat: no-repeat;
  background-size: 85%;
  background-position: 0 7px;
}
/* =========================輸入頁面尾區================ */
/* =========================結果頁面頭區================ */
/* 標題 */
.MOBILE #it212 .e_TOP {
  width: 100%;
  height: 0;
  overflow: hidden;
  padding-bottom: 30%;
  background-size: cover;
  background-image: url(https://imgs.click108.com.tw/unit001/item00212/images/retop_bg.jpg);
  background-position: center;
}
.MOBILE #it212 .e_TOP h1 {
  width: 100%;
  height: 0;
  margin-top: 15px;
  overflow: hidden;
  padding-bottom: 30%;
  background-image: url(https://imgs.click108.com.tw/unit001/item00212/images/input_top_title.png);
  background-repeat: no-repeat;
  background-position: center 0;
  background-size: 100% auto;
  text-indent: -9999px;
}
/* 引言 */
.MOBILE #it212 .INTRO {
  width: 100%;
  font-size: 1.1em;
  line-height: 1.5em;
  color: #333;
  margin: 5px auto;
  background-color: #fffbda;
  padding: 2% 1.3% 2% 1.7%;
}
.MOBILE #it212 .INTRO p:nth-of-type(1) {
  line-height: 1.7em;
}
/* 個人資料 */
.MOBILE #it212 .INFOR {
  width: 100%;
  height: auto;
  overflow: hidden;
  margin: 10px auto 5px auto;
}
.MOBILE #it212 .INFOR img {
  display: inline-block;
  width: 24px;
  height: 24px;
  margin: 0 5px;
}
.MOBILE #it212 .INFOR li {
  float: none;
  text-align: center;
}
.MOBILE #it212 .INFOR_STAR {
  width: 100%;
  height: auto;
  overflow: hidden;
  margin: 10px auto;
}
.MOBILE #it212 .INFOR_STAR li {
  float: left;
  width: 49%;
  height: 0;
  padding-bottom: 27%;
  background: url(https://imgs.click108.com.tw/unit001/item00212/images/re_01.png) no-repeat;
  background-size: cover;
}
.MOBILE #it212 .INFOR_STAR li p {
  color: #333;
  font-size: 8vw;
  line-height: 33vw;
  text-align: center;
  font-weight: bold;
}
.MOBILE #it212 .INFOR_STAR li:nth-child(2) {
  background-image: url(https://imgs.click108.com.tw/unit001/item00212/images/re_02.png);
  margin-left: 1%;
}
/* 結果頁內容區 */
.MOBILE #it212 .RE_TOP {
  /* 大標頭 */
  clear: both;
  width: 100%;
  height: 0;
  padding-bottom: 21.34%;
  margin: 20px auto 0 auto;
}
.MOBILE #it212 .RE_TOP img {
  width: 100%;
  height: auto;
}
.MOBILE #it212 .RE_BG,
.MOBILE #it212 .RE_BG2 {
  /* BOX背景 */
  width: 100%;
  height: auto;
  overflow: hidden;
  clear: both;
  margin: 0 auto;
  background-color: #fff;
  border: solid 2px #ff3562;
  padding: 5px 3%;
}
.MOBILE #it212 .RE_BG2 {
  border: solid 2px #0fbff0;
}
.MOBILE #it212 .CON_BOX div:nth-of-type(2) {
  margin-top: 0px;
}
.MOBILE #it212 .RE_BG_COM {
  /* 大段落 */
  width: 100%;
  height: auto;
  overflow: hidden;
  clear: both;
  margin: 10px auto;
  color: #333;
  text-align: justify;
}
.MOBILE #it212 .RE_BG_COM ul.pq_CIRITEM {
  /* 實心圓點項目 */
  width: 100%;
  padding-left: 20px;
}
.MOBILE #it212 .RE_BG_COM ul.pq_CIRITEM li {
  list-style: disc;
  margin-bottom: 15px;
}
.MOBILE #it212 .RE_BG_COM ul.pq_SQITEM {
  /* 實心正方形項目 */
  width: 100%;
  padding-left: 20px;
}
.MOBILE #it212 .RE_BG_COM ul.pq_SQITEM li {
  list-style: square;
  margin-bottom: 15px;
}
.MOBILE #it212 .RE_BG_COM ul.SUPEI {
  /* 速配指數-兩欄位 */
  display: block;
  width: 100%;
  height: auto;
  overflow: hidden;
  padding: 3%;
  margin-top: 10px;
  background-color: rgba(255, 252, 236, 0.7);
  border-radius: 10px;
  box-shadow: 0px 0px 15px 10px rgb(255, 248, 207) inset;
}
.MOBILE #it212 .RE_BG_COM ul.SUPEI li.TXT {
  /* 文字 */
  padding-top: 3px;
  height: auto;
  overflow: hidden;
  text-align: justify;
}
.MOBILE #it212 .RE_BG_COM ul.SUPEI li.PIC_L {
  /* 指數底圖 */
  width: 260px;
  height: 142px;
  margin: 0 auto;
  background: url(https://imgs.click108.com.tw/unit001/item00212/images/re_03.png) no-repeat;
  background-size: 100% auto;
  background-position: center;
}
.MOBILE #it212 .RE_BG_COM ul.SUPEI li.PIC_L p {
  color: #ff0707;
  font-size: 3.8em;
  line-height: 190px;
  text-align: center;
  font-weight: bold;
}
.MOBILE #it212 .RE_BG_COM ul.SUPEI li.PIC_L span {
  font-size: 0.7em;
}
.MOBILE #it212 .RE_BG_COM ul.FOREVER {
  /* 兩欄位 */
  display: block;
  width: 100%;
  height: auto;
  overflow: hidden;
}
.MOBILE #it212 .RE_BG_COM ul.FOREVER li.TXT {
  /* 文字 */
  padding-top: 3px;
  height: auto;
  overflow: hidden;
  text-align: justify;
  font-weight: normal;
}
.MOBILE #it212 .RE_BG_COM ul.FOREVER li.PIC_L {
  /* 配圖 */
  display: none;
}
.MOBILE #it212 .RE_BG_COM ul.FOREVER li.PIC_R {
  /* 大師訊息 */
  width: 90%;
  max-width: 296px;
  height: auto;
  margin: 0 auto;
}
.MOBILE #it212 .RE_BG_COM .HOUNYUN {
  /* 婚緣指數 */
  width: 100%;
  height: 0;
  padding-bottom: 40.76%;
  margin: 0 auto;
  background: url(https://imgs.click108.com.tw/unit001/item00212/images/re_04mb.png) no-repeat;
  background-size: contain;
  overflow: hidden;
}
.MOBILE #it212 .RE_BG_COM .HOUNYUN p {
  color: #ff0707;
  font-size: 10vw;
  text-align: center;
  font-weight: bold;
  padding-top: 15vw;
  margin-left: 5vw;
}
.MOBILE #it212 .RE_BG_COM .HOUNYUN span {
  font-size: 0.7em;
}
.MOBILE #it212 .RE_BG_COM .HOUNYUN_NAME {
  width: 290px;
  margin: 0 auto;
}
.MOBILE #it212 .RE_BG_COM .HOUNYUN_NAME img {
  display: inline-block;
  width: 22px;
  height: 22px;
  margin: 0 3px;
}
.MOBILE #it212 .RE_BG_COM .HOUNYUN_NAME p {
  text-align: center;
  font-size: 1.4em;
  line-height: 25px;
}
.MOBILE #it212 .PRINT {
  display: none;
}
/* ========================結果頁面尾區================ */
/* =========================試算頁面頭區================ */
.MOBILE #it212-wrapper .NEW_BT_F {
  /* 浮水按鈕 */
  width: 100%;
  height: 60px;
  position: fixed;
  bottom: 0;
  z-index: 1000;
  background-image: url(https://imgs.click108.com.tw/unit001/item00212/images/bt_bg.png);
  background-repeat: repeat;
  padding-top: 5px;
  background-size: 15px 15px;
}
.MOBILE #it212-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;
}
.MOBILE #it212 .SAMPLE {
  width: 100%;
  height: 150px;
  position: relative;
  background-position: -5px top;
  margin: 3px auto;
  background-image: url(https://imgs.click108.com.tw/unit001/item00212/images/fuzzy.png);
}

.MOBILE #it212 .SAMPLE2 {
  /* LIST模糊試算用 */
  width: 100%;
  margin: 3px 0 0 20px;
  background-image: url(https://imgs.click108.com.tw/unit001/item00212/images/fuzzy.png);
}
.MOBILE #it212 .FREE_PH {
  width: 100%;
  height: auto;
  overflow: hidden;

  margin: 10px auto;
  clear: both;
}
.MOBILE #it212 .FREE_PH img {
  clear: both;
  display: block;
  width: 100%;
  height: auto;
  margin: 0 auto;
}
#it212 .MOBILE .BLANK {
  width: 100%;
  height: 10px;
}
/* =========================試算頁面尾區================ */
