@import url("reset.css");
body{
	-webkit-text-size-adjust:none;
	text-decoration:none;
	font-family: "微軟正黑體", "新細明體", "細明體",Arial, Helvetica, sans-serif;
	background-color:#e95c44;
	}
/*共用字型*/
#it218 .T01{
	font-size:1.1em;
	line-height:1.7em;
	color:#333;
}

#it218 .T02_B{/*使用者暱稱*/
	font-size: 2.3em;
	color:#ef3a91;
	line-height: 1.6em;
	font-weight:bold;}
#it218 .T02_WO{/*使用者暱稱*/
	color:#0053c5;
	font-weight:bold;}
	
#it218 .T03{
	font-size:1.2em;
	line-height:1.6em;
	color:#333;}

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

#it218 .T05{
	font-size:1.4em;
	line-height:1.8em;
	color:#333;}

#it218 .T06{
	font-size:1.2em;
	line-height:1.6em;
	color:#4e0101;}

/*文字顏色*/	
#it218 .PINK{
	color:#ef3a91;
	}

#it218 .RED{
	color:#CC0000;
	}
#it218 .GREEN{
	color:#4f8700;
	}
#it218 .RED{
	color:#b50000;
	}
#it218 .ORANG{
	color:#ff5400;
	}
/*斷行*/	
#it218 .TBLANK{
	margin-bottom: 10px;
	}	


/*共用間距*/
#it218 .BLANK{ width:100%; height:20px;}	
#it218 .BLANK02{ width:100%; height:20px; background:url(https://imgs.click108.com.tw/unit001/item00218/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 #it218{
	width:100%;
	height:auto;
	overflow:hidden;
	background-image:url(https://imgs.click108.com.tw/unit001/item00218/images/bg.jpg);
	background-repeat:repeat-x;
	background-position:top center;
    background-attachment: fixed;
	-webkit-box-sizing:border-box;
	}
.PC #it218 .FRAME{width:100%; height:auto; overflow:hidden; margin:0 auto;}
/*框架區尾*/

/*表頭區*/	
.PC #it218 .e_TOP{
	width:100%;
	height:300px;
	background:url(https://imgs.click108.com.tw/unit001/item00218/images/top_bg.png) no-repeat top center;
	margin:0 auto;
	}
.PC #it218 h1{
	width:400px;
	height:300px;
	margin:0 auto;
	background-image:url(https://imgs.click108.com.tw/unit001/item00218/images/top_title.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	text-indent:-9999px;
	}
/*表頭區尾*/

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


/*共用按鈕*/
.PC #it218 .e_BT{
	clear: both;
	width:90%;
	margin:0 auto;
    }	
	
.PC #it218 .e_BT ul.ONE{
	width:100%;
	height:50px;}
	
.PC #it218 .e_BT ul.ONE li{
	width:50%;
	margin:0 auto;
	height:50px;
	}
		
.PC #it218 .e_BT ul.TOW{
	width:100%;
	height:50px;}
	
.PC #it218 .e_BT ul.TOW li{
	float:left;
	width:50%;}
	
.PC #it218 .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 #it218 .e_BT li a.ALINE{
	font-size: 1.5em;
	font-weight:bold;
	text-align:center;
	line-height:47px;}
.PC #it218 .e_BT li a.BLINE{
	font-size: 1.5em;
	font-weight:bold;
	text-align:center;
	line-height:47px;}
		
		
.PC #it218 .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 #it218 a.COLOR{
	background-color:#ff0000;
	background: -moz-linear-gradient(
		top,
		#ff0000 0%,
		#b90000);
	background: -webkit-gradient(
		linear, left top, left bottom,
		from(#ff0000),
		to(#b90000));
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	border:1px solid #a30000;
	-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 #it218 a.COLOR:hover{
	background-color:#b90000;
	color:#fee300;
	background: -moz-linear-gradient(
		top,
		#b90000 0%,
		#ff0000);
	background: -webkit-gradient(
		linear, left top, left bottom,
		from(#b90000),
		to(#ff0000));}

#it218 a.FREE_BT{ 
	display:block;
	width:280px;
	height:67px;
    margin:5px auto;
    background-image: url(https://imgs.click108.com.tw/unit001/item00218/images/free_bt.png);
    background-position: top;
    background-repeat: no-repeat;
    position: absolute;
    left: 25%;
    text-indent: -999999px;
}

.MOBILE #it218 a.FREE_BT{ 
	display:block;
	width: 70%; 
    height: 0; 
    padding-bottom: 17%;
    margin:5px auto;
    background-image: url(https://imgs.click108.com.tw/unit001/item00218/images/free_bt_m.png);
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
    position: absolute;
    left: 15%;
    text-indent: -999999px;
}

@media screen and (max-width:414px){/*for i5*/
    .MOBILE #it218 a.FREE_BT{ left: 15%;  background-size: cover;}
    
}
.PC #it218 a.FREE_BT:hover{ 
    background-position: bottom;
}

/*=========================輸入頁面頭區================*/
.PC #it218 .CON_BOX{ 
	width:670px;
	height:auto;
	overflow:hidden;
	margin:0 auto;}

.PC #it218 .WHAT_BOX02_BAR{
	width:100%;
	height:66px;
	background-image:url(https://imgs.click108.com.tw/unit001/item00218/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 #it218 .WHAT_BOX02_BAR .DR_DOWN a{display:none;}

.PC #it218 .WHAT_BOX_BG{
	width:100%;
	height:auto;
	overflow:hidden;
	clear:both;
	margin:0 auto 15px auto;
	padding:15px 0;
	background-color: #fafff5;
	box-shadow: inset 0px 0px 50px rgba(137,187,58,0.5);
	-webkit-box-shadow: inset 0px 0px 50px rgba(137,187,58,0.5);
	-moz-box-shadow: inset 0px 0px 50px rgba(137,187,58,0.5);
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;}

.PC #it218 .WHAT_BOX_BG .LISTBOX{
	width:82%;
	margin: 0 auto;
	height:auto;
	overflow:hidden;
	}
.PC #it218 .WHAT_BOX_BG .LISTBOX li{
	background-image:url(https://imgs.click108.com.tw/unit001/item00218/images/input_icon.png);
	background-repeat:no-repeat;
	background-position-x:5px;
	background-position-y:0;
	padding-left:40px;
	width:90%;
	margin-bottom:5px;
	font-size:1.2em;
	color:#333;
	line-height:1.8em;}
.PC #it218 .WHAT_BOX_BG .LISTBOX li.TITLES{
	background-image:none;
	width:100%;
    padding-left:8px;
    font-weight: bold;
	margin-top:15px;
	font-size:1.3em;
    color: #567800;
	line-height:1.6em;
    box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
    }
.PC #it218 .WHAT_BOX_BG .LISTBOX li.TITLES-02{
	background-image:none;
	width:100%;
    padding-left:8px;
    font-weight: bold;
	margin-top:15px;
	font-size:1.3em;
    color: #E80000;
	line-height:1.6em;
    box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
    }
.PC #it218 .WHAT_BOX_BG .LISTBOX .LINE{
    width: 100%;
    height: 5px;
    margin-top: 5px;
    border-bottom: 1px dashed #a1b867;}
.PC #it218 .WHAT_BOX_BG .LISTBOX ul li>ul li{
	width:90%;
	background-image:url(https://imgs.click108.com.tw/unit001/item00218/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 #it218 .CON_BOX_BAR02{/*NEW*/
	width:100%;
	height:60px;
	margin:0 auto;
	background-color: #f6e3ff;
	-webkit-box-sizing:border-box;}

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

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

.PC #it218 .CON_BOX img{display:block; width:100%;margin:0 auto;}
.PC #it218 .CON_BOX_BG02 .BOX_INSET{/*內縮*/
	width: 90%; 
	height: auto;
	clear:both;
	overflow: hidden;
	margin: 0 auto; 
	margin:10px auto;}
.PC #it218 .CON_BOX_BG02 .LISTIMG{/*九星宿緣配圖*/
	float:left;
	width:200px;
	margin-right: 30px;}

.PC #it218 .CON_BOX_BG02 .LISTBOX{
	width:auto;
	height:auto;
	overflow:hidden;
	}
.PC #it218 .CON_BOX_BG02 .LISTBOX li{
	width:auto;
	height:auto;
	overflow:hidden;
	margin-bottom: 5px;}
.PC #it218 .CON_BOX_BG02 .LISTBOX li>ul li{
	width:auto;
	height:auto;
	overflow:hidden;
	line-height: 1.6em;
	font-size:1.2em;
	color:#333;}
.PC #it218 .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/item00218/images/input_icon2.png);
	background-position: left bottom ;
	background-repeat: no-repeat;
	margin-top: 3px;
}

/*輸入框*/
.PC #it218 .ENTER_TOP_BAR{
	width:100%;
	height:70px;
	background-image:url(https://imgs.click108.com.tw/unit001/item00218/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 #it218 .ENTER_BG{
	width:100%;
	height:auto;
	overflow:hidden;
	background-image:url(https://imgs.click108.com.tw/unit001/item00218/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 #it218 .ENTER_FOOT{
	width:100%;
	height:36px;
	overflow: hidden;
	clear: both;
	background-image:url(https://imgs.click108.com.tw/unit001/item00218/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 #it218 .CON_BOX img{display:block;width:100%; margin:0 auto;}
/*輸入框*/

/*========歲運球陣區塊======*/
.PC #it218 .MAGIC_BALL{
    width:670px;
    height: 540px;
    margin: 0 auto;
    background:url(https://imgs.click108.com.tw/unit001/item00218/images/input_ph02.jpg) no-repeat center;
    position: relative;}

.PC #it218 .MAGIC_BALL .BALL{
    width:140px;
    height: 140px;
    position: absolute;}

/*==========輸入頁球動畫PC+MB共用=============*/
#it218 .MAGIC_BALL .ANI1 img{
    opacity:0.7;filter:alpha(opacity=70);
    -webkit-filter: brightness(100%); /* Safari */
    filter: brightness(100%);
    -webkit-animation: ANI1 2s infinite linear;}
    @-webkit-keyframes ANI1
	{
        12% {-webkit-transform: translateY(-5px); opacity:1;
            -webkit-filter: brightness(120%); /* Safari */
            filter: brightness(120%);}
        20%{-webkit-transform: translateY(-8px); opacity:1;
            -webkit-filter: brightness(120%); /* Safari */
            filter: brightness(120%);}
        30%{-webkit-transform: translateY(0px); opacity:1;
            -webkit-filter: brightness(100%); /* Safari */
            filter: brightness(100%);}
    }
       
#it218 .MAGIC_BALL .ANI2 img{
     opacity:0.7;filter:alpha(opacity=70);
    -webkit-filter: brightness(100%); /* Safari */
    filter: brightness(100%);
    -webkit-animation: ANI2 2s infinite linear;
    animation-delay:0.5s;-webkit-animation-delay:0.5s;-moz-animation-delay:0.5s; }
    @-webkit-keyframes ANI2
	{
         12% {-webkit-transform: translateY(-5px); opacity:1;
            -webkit-filter: brightness(120%); /* Safari */
            filter: brightness(120%);}
        20%{-webkit-transform: translateY(-8px); opacity:1;
            -webkit-filter: brightness(120%); /* Safari */
            filter: brightness(120%);}
        30%{-webkit-transform: translateY(0px); opacity:1;
            -webkit-filter: brightness(100%); /* Safari */
            filter: brightness(100%);}
    }
#it218 .MAGIC_BALL .ANI3 img{
    opacity:0.7;filter:alpha(opacity=70);
    -webkit-filter: brightness(100%); /* Safari */
    filter: brightness(100%);
    -webkit-animation: ANI3 2s infinite linear;
    animation-delay:0.8s;-webkit-animation-delay:0.8s;-moz-animation-delay:0.8s; }
    @-webkit-keyframes ANI3
	{
       12% {-webkit-transform: translateY(-5px); opacity:1;
            -webkit-filter: brightness(120%); /* Safari */
            filter: brightness(120%);}
        20%{-webkit-transform: translateY(-8px); opacity:1;
            -webkit-filter: brightness(120%); /* Safari */
            filter: brightness(120%);}
        30%{-webkit-transform: translateY(0px); opacity:1;
            -webkit-filter: brightness(100%); /* Safari */
            filter: brightness(100%);}
    }
#it218 .MAGIC_BALL .ANI4 img{
     opacity:0.7;filter:alpha(opacity=70);
    -webkit-filter: brightness(100%); /* Safari */
    filter: brightness(100%);
    -webkit-animation: ANI4 2s infinite linear;
    animation-delay:1.2s;-webkit-animation-delay:1.2s;-moz-animation-delay:1.2s; }
    @-webkit-keyframes ANI4
	{
        12% {-webkit-transform: translateY(-5px); opacity:1;
            -webkit-filter: brightness(120%); /* Safari */
            filter: brightness(120%);}
        20%{-webkit-transform: translateY(-8px); opacity:1;
            -webkit-filter: brightness(120%); /* Safari */
            filter: brightness(120%);}
        30%{-webkit-transform: translateY(0px); opacity:1;
            -webkit-filter: brightness(100%); /* Safari */
            filter: brightness(100%);}
    }

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

/*=========================結果頁面頭區================*/
/*第一塊引導區*/
.PC #it218 .GUIDE{
	width:92%;
	height:auto;
	overflow:hidden;
	margin: 0 auto;}
	
.PC #it218 .GUIDE li.TEXT{
	float:right;
	width:70%;
    font-size: 1.4em;
    line-height: 1.8em;
	}
.PC #it218 .GUIDE li.TEXT span{
    display: block;}
.PC #it218 .GUIDE li.PH {float:left;}
.PC #it218 .GUIDE li.PH img{ width:160px; height:160px;}


/*個人資料*/
.PC #it218 .INFOR{
	width:664px;
	height:157px;
	margin:0 auto;
	background-image: url(https://imgs.click108.com.tw/unit001/item00218/images/name_bg.jpg);
	background-repeat: no-repeat;
	text-align: center;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	padding: 15px 10px 10px 10px;
	border-bottom:3px solid #76380c;
	}
.PC #it218 .INFOR .GENDER{ 
	display:inline-block;
	width:30px;
	height:30px;
	margin:0 auto;
	margin-bottom:-8px;}
.PC #it218 .INFOR .GENDER img{ 
	display:block;
	width:100%;
	height:auto;
	margin:0 auto;}
/*個人資料尾*/
	
	
/*結果頁內容區框架*/
.PC #it218 .RE_TOP_FOOT{/*標題圖*/
	border-bottom:3px solid #d79c1f;	
}
.PC #it218 .RE_TOP_FOOT img{ clear:both;display:block;width:664px; height: 154px; margin:0 auto;}
.PC #it218 .RE_BG{/*框線*/
	width:100%;
	height:auto;
	overflow:hidden;
	border:3px solid #d79c1f;
	margin:0 auto;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	}

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

/*內容欄位樣式用尾*/	
.PC #it218 .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 #it218 .NAME_FIVE_218{
	width:100%;
	height:auto;
	overflow:hidden;}
	
.PC #it218 .NAME_FIVE_BG_218{
	width:664px;
	height:522px;
	position: relative;
	}

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

.PC #it218 .NAME_TEXT01_218 li{
	float: left;
	width: 50%;
}
.PC #it218 .NAME_TEXT02_218 ul{
	width: 45%;
	height: 100px;
	margin: 0 auto;
	text-align: center;
	position: absolute;
	top:31%;
	right:0%;
}

.PC #it218 .NAME_TEXT02_218 li{
	float:left;
	width: 33.3333333%;
}

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

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

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

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

.PC #it218 .NAME_TEXT06_218{
	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 #it218 .NAME_FIVE_218 .NAM{
	width: 100%;
	height: 50px;
	font-family: "標楷體";
	font-size: 5em;
	line-height: 50px;
	color: #000;
}

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

.PC #it218 .NAME_FIVE_218 .NAM_S02{
	font-size: 1em;
	color: #999;
}
.PC #it218 .NAME_FIVE_218 .NAM_S03{
	font-size:1.5em;
	color: #762200;
	font-weight: bold;
}

.PC #it218 .NAME_FIVE_218 .NAM_RED{
	color: #cc0000;
}

.PC #it218 .NAME_FIVE_218 .NAM_YELLOW{
	color: #ffea00;
}
/*姓名五行內容尾*/

/*外內格*/
.PC #it218 .OUTINSIDE{
	width:100%;
	height:auto;
	overflow:hidden;
    background-color: #ffe778;}

.PC #it218 .OUTINSIDE img{
	width:100%;
	height:auto;}

.PC #it218 .OUTINSIDE .CENTER_TEXT{
	width:510px;
	height: 136px;
	margin: 0px auto;
    padding-top: 3px;
	background-repeat: no-repeat;
	background-position: center center;}
.PC #it218 .OUTINSIDE .CENTER_TEXT ul{
	display: block;
	margin: 15px auto;
	width: 430px;
	height: 100px;
	background-color: #fffde2;
	border: 2px solid #fffde2;}
.PC #it218 .OUTINSIDE .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;
    font-weight: bold;
	text-align: center;}
.PC #it218 .OUTINSIDE .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 #it218 .OUTINSIDE .CENTER_TEXT ul li img{ 
    display: inline-block;
    width: 50%;
    height: auto; 
    vertical-align:middle;}

.PC #it218 .OUTINSIDE .TITLE{
    width: 85%;
    height: auto;
    overflow: hidden;
    margin: 5px auto;
    margin-bottom: 10px;
    background-color: #fffed8;
	font-size: 1.9rem;
	line-height: 1.7em;
	color: #000;
	font-weight: bold;
	text-align: center;}
.PC #it218 .OUTINSIDE .TITLE img{
    width: 100%;
    height: auto;
    margin: 2px 0;}

.PC #it218 .OUTINSIDE .BOARD{
    width: 85%;
    height: auto;
    overflow: hidden;
    margin: 5px auto;
    overflow: hidden;}
.PC #it218 .OUTINSIDE .BOARD ul li{
    float: left;
    width: 180px;
    height: 180px;
    margin-right: 8px;}
.PC #it218 .OUTINSIDE .BOARD ul li img{
    width: 100%;
    height: auto;}
.PC #it218 .OUTINSIDE .BOARD ul li.TXT{
    padding-top: 20px;
    font-size: 1.8rem;
    letter-spacing: 2px;
	color: #FFF;
	font-weight: bold;
	text-align: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.PC #it218 ul.WARN_LIST {}

.PC #it218 ul.WARN_LIST li{
	background-image:url(https://imgs.click108.com.tw/unit001/item00218/images/result_icon.png);
    background-size: 28px 28px;
	background-repeat:no-repeat;
	background-position-x:5px;
	background-position-y:1px;
	padding-left:40px;
	width:100%;
	margin-bottom:10px;}
/*內外格end*/

.PC #it218 .FRAME_TITLE{/*各歲框*/
	width: 610px;
	height: 96px;
    margin: 20px auto 0 auto;}

.PC #it218 .FRAME_WORD{
    width: 500px;
	height: 200px;
    padding-left: 200px;
    margin: 15px auto 0 auto;
    font-family: "標楷體";
    font-size: 3rem;
    line-height: 200px;
	color: #333;
	font-weight: bold;
    background-repeat: no-repeat;
    background-size: cover;
}

.PC #it218 .FRAME_WORD img{ 
    display: inline-block;
    width: 75%;
    margin-left: -25px;
    height: auto; 
    vertical-align:middle;}

.PC #it218 .FRAME_BG{
	width: 610px;
	height: auto;
	margin: 0 auto 20px auto;
    border: 2px solid #a70101;
    background-color: #fff2f2;
	}


/*大運捲軸*/
.PC #it218 .OLD_CALENDAR{
	width:610px;
	height:280px;
	background-image: url(https://imgs.click108.com.tw/unit001/item00218/images/old_paper.jpg);
    background-repeat: no-repeat;
    position: relative;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	margin:10px auto;}
.PC #it218 .OLD_CALENDAR ul{
    width:20%;
	height:72%;
    position: absolute;}
.PC #it218 .OLD_CALENDAR ul li{
    width: 100%;
    height: 33%;
    font-size: 1.5em;
	line-height: 2.2em;
    color: #000;
	text-align: center;
	font-weight: bold;}
.PC #it218 .OLD_CALENDAR ul li:nth-child(2),.PC #it218 .OLD_CALENDAR ul li:nth-child(3){
    font-size: 1.8rem;
	line-height: 2.1em;}
.PC #it218 .OLD_CALENDAR ul.ON{
    background-color: rgba(255,249,200,0.7);
    border: 2px solid #a70101;
}
.PC #it218 .OLD_CALENDAR .ARROW{
    width:20%;
	height:23%;
    position: absolute;
    z-index: 10;
    font-size: 1.5em;
	line-height: 2em;
    color: #a70101;
	text-align: center;
	font-weight: bold;
    background-image: url(https://imgs.click108.com.tw/unit001/item00218/images/arrow.png);
    background-repeat: no-repeat;
    background-position: center bottom;
}
.PC #it218 .OLD_CALENDAR .SAMPLE03{top:10%;left: 7%;}
/*大運捲軸尾*/

/*很重要區塊*/
.PC #it218 .IMPORTANT_TITLE{
	width: 670px;
	height: auto;
    overflow: hidden;}

.PC #it218 .IMPORTANT_BG{
	width: 670px;
	height: auto;
    overflow: hidden;
    background-image: url(https://imgs.click108.com.tw/unit001/item00218/images/frame_bg.jpg);
    background-repeat: repeat-y;
    padding: 2%;}

.PC #it218 .IMPORTANT_BG .CALENDAR{
    width: 500px;
    height: 240px;
    margin: 5px auto;
    font-size: 3.2em;
    padding-left: 80px;
	line-height: 3.6em;
    text-align: center;
	font-weight: bold;
    color: #333;
    -webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

/*九宮格*/
.PC #it218 .NINEBOARD{
    width: 500px;
    height: 465px;
    margin: 20px auto 10px auto;
    background-image: url(https://imgs.click108.com.tw/unit001/item00218/images/nine_board.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    -webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;}

.PC #it218 .NINEBOARD ul{
    width: 100%;
    height: 100%;
    padding: 5% 8%;}
.PC #it218 .NINEBOARD ul li{
    float: left;
    width: 26.3%;
    height: 27%;
    margin: 3.2% 3.5%;
    opacity: 0.8;}
.PC #it218 .NINEBOARD ul li.ON{
    background-image: url(https://imgs.click108.com.tw/unit001/item00218/images/circle.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.PC #it218 .NINEBOARD .FREE_BT{left: 22%;}


/*開運配圖內容*/
.PC #it218 .MAP_COM{
	width: 100%;
	height: auto;
	overflow: hidden;
	margin: 10px auto;
	}

.PC #it218 .MAP_COM .MAP_PH{
	float: left;
	width:200px;
	height: 150px;
}
.PC #it218 .MAP_COM .MAP_PH img{clear:both; display:block; width:100%; 	height: auto;margin:0 auto;}
.PC #it218 .MAP_COM .MAP_TEXT{
	width: 360px;
	height: auto;
	overflow: hidden;
	padding-top: 10px;
	padding-left: 30px;}
.PC #it218 .MAP_COM .MAP_TEXT .FREE_BT{/*按鈕位置*/
    top: 6%; 
    left: 8%;
}

/*符咒下載區*/
.PC #it218 .D_IMGBOX{
	width: 85%;
	height: auto;
	overflow: hidden;
	clear: both;
	margin: 0px auto 10px auto;
    padding-bottom: 10px;
    margin-bottom: 25px;
    background-color: #fff0f0;
    -moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	border-radius: 15px;
    }
.PC #it218 .D_IMGBOX .TITLE{
    width: 85%;
    color: #a70101;
    padding:15px 0 10px 0;
    border-bottom: 1px solid #fecdcd;
    text-align: center;
	font-weight: bold;
    margin: 0 auto;
    font-size: 1.5em;}
.PC #it218 .D_IMGBOX p.MBD{display: none;}

.PC #it218 .D_IMG{
	width: 250px;
	height: 420px;
	overflow: hidden;
	clear: both;
	margin: 10px auto;
    position: relative;
    background-image: url( https://imgs.click108.com.tw/unit001/item00218/images/d_img/dw_0.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    }

.PC #it218 .FREE_D_IMG{
	width: 80%;
	height: auto;
	overflow: hidden;
	clear: both;
	margin: 0px auto;
    position: relative;
    text-align: center;
    }

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

/*=========================試算頁面頭區================*/
.PC #it218-wrapper .NEW_BT_F{/*浮水按鈕*/
	width:100%;
	height:60px;
	position:fixed;
	bottom:0;
	z-index:1000;
	background-image:url(https://imgs.click108.com.tw/unit001/item00218/images/bt_bg.png);
	background-repeat:repeat;
	padding-top:5px;
	}
	
.PC #it218-wrapper .NEW_BT_F a{/*浮水按鈕*/
	display:block;
	width:300px;
	margin:0 auto;
	height:48px;
	text-decoration:none;
	background-color:#ff0000;
	background: -moz-linear-gradient(
		top,
		#ff0000 0%,
		#b90000);
	background: -webkit-gradient(
		linear, left top, left bottom,
		from(#ff0000),
		to(#b90000));
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	border:1px solid #a30000;
	-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 #it218-wrapper .NEW_BT_F a:hover{/*浮水按鈕*/
	background-color:#b90000;
	color:#fee300;
	background: -moz-linear-gradient(
		top,
		#b90000 0%,
		#ff0000);
	background: -webkit-gradient(
		linear, left top, left bottom,
		from(#b90000),
		to(#ff0000));}
		
		

.PC #it218 .SAMPLE{
	width:100%;
	height:150px;
	position:relative;
	background-position:-7px top;
	margin:5px auto;
	background-image:url(https://imgs.click108.com.tw/unit001/item00218/images/fuzzy.png);
	}
	
.PC #it218 .SAMPLE02 {
	width:100%;
	height:350px;
	position:relative;
	background-position:-7px top;
	margin:0px auto;
	background-image:url(https://imgs.click108.com.tw/unit001/item00218/images/fuzzy_list.png);
    background-repeat: no-repeat;
	}

.PC #it218 .SAMPLE03 {
	width:88%;
	height:auto;
    overflow: hidden;
	position:absolute;
    padding: 3%;
    color: #333;
    font-size: 1.4em;
	font-weight:bold;
	line-height:1.6em;
    background-color: rgba(255,218,91,0.9);
    -moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
    -moz-box-shadow:
		 2px 8px 15px rgba(0,0,0,0.3);
	-webkit-box-shadow:
		 2px 8px 15px rgba(0,0,0,0.3);
	box-shadow:
		 2px 8px 15px rgba(0,0,0,0.3);}

.PC #it218 .SAMPLE03 img {
    width: 45%;
    height: auto;
    float: left;
    margin-right: 3%;
}
.PC #it218 .FREE_PH{ 
	clear:both;
	width:600px; 
	height:auto;
	overflow: hidden;
	margin:20px auto;}


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

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

.PC #it218-wrapper #INPUT_BOX{
	position: fixed;
	width:255px;
	height:280px;
	right:3%;
	top: 220px;
	z-index: 9999;}

.PC #it218-wrapper #INPUT_BOX .BOX_TOP{
	width:255px;
	height:131px;
	position:relative;
	background-image:url(https://imgs.click108.com.tw/unit001/item00218/images/input_box/in_top2.png);}
.PC #it218-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/item00218/images/input_box/in_top_x.png);
	text-indent:-9999px;}
.PC #it218-wrapper #INPUT_BOX .BOX_FOOT{}
.PC #it218-wrapper #INPUT_BOX .BOX_BG{
	width:255px;
    height: auto;
	overflow:hidden;
	text-align:center;
    background-image:url(https://imgs.click108.com.tw/unit001/item00218/images/input_box/in_bg.png);}
.PC #it218-wrapper #INPUT_BOX .BOX_BG p{
	margin:8px auto;}
.PC #it218-wrapper #INPUT_BOX .BLANK3{
	height:10px;}
	
.PC #it218-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/item00218/images/input_box/bt_input.png);}
.PC #it218-wrapper #INPUT_BOX a.BT_PAY:hover{
	background-position:0px -33px;}
.PC #it218-wrapper #INPUT_BOX .txt01 {FONT-SIZE: 12pt; COLOR: #cc0000; LINE-HEIGHT: 16px; FONT-FAMILY: Arial; TEXT-DECORATION: none;font-weight: bold;}
.PC #it218-wrapper #INPUT_BOX .txt02 {FONT-SIZE: 10pt; COLOR: #333333; LINE-HEIGHT: 16px;  FONT-FAMILY: "Arial"; TEXT-DECORATION: line-through; }

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

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

.PC #it218 .PRINT_TOP{
	width:678px;
	height:200px;
	background-image:url(https://imgs.click108.com.tw/unit001/item00218/images/print.jpg);
    border-left:1px solid #59710e;
    border-right:1px solid #59710e;
    border-top:1px solid #59710e;
	margin:0 auto;}
	
.PC #it218 .PRINT_BG{
	width:678px;
	border:1px solid #59710e;
	background-color:#fff;
	margin:0 auto;}
	

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



/*平板小於內容js縮放*/	
@media screen and (max-width : 750px ){
    .PC #it218{
        width: 750px !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 #it218-wrapper #INPUT_BOX{ display:none;}
/*消失區尾*/


	 
/*框架區*/
.MOBILE #it218{
	width:100%;
	height:auto;
	overflow:hidden;
	margin-top:45px;
	}
.MOBILE #it218 .FRAME{width:100%; height:auto; overflow:hidden; margin:0 auto;}
/*框架區尾*/

/*表頭區*/	
.MOBILE #it218 .e_TOP{
	width:100%;
	height:0;
	padding-bottom:52%;
	background:url(https://imgs.click108.com.tw/unit001/item00218/images/top_bg.png) no-repeat top center;
	background-size:cover;
	margin:0 auto;
	}
.MOBILE #it218 h1{
	width:100%;
	height:0;
	padding-bottom:50%;
	background:url(https://imgs.click108.com.tw/unit001/item00218/images/top_title.png);
	background-repeat:no-repeat;
	background-position: center -8px;
	background-size:75%;
	text-indent:-9999px;
	}
/*表頭區尾*/
	
/*內容區*/
.MOBILE #it218 .CONTENT{
	width:100%;
	height:auto;
	overflow:hidden;
	margin:0 auto;
	background-image: url(https://imgs.click108.com.tw/unit001/item00218/images/con_bg.jpg);
	background-size:100% auto;
	}
/*內容框架*/
.MOBILE #it218 .CONTENT img{display:block; width:100%; height:auto; margin:0 auto;}
.MOBILE #it218 .CONTENT_TOP img, .MOBILE #it218 .CONTENT_FOOT img{display:block; width:100%; height:auto; margin:0 auto;}
/*共用按鈕*/
.MOBILE #it218 .e_BT{
    clear: both;
	width:90%;
	margin:0 auto;}	
	
.MOBILE #it218 .e_BT ul.ONE{
	width:100%;
	height:50px;}
	
.MOBILE #it218 .e_BT ul.ONE li{
	width:100%;
	margin:0 auto;
	height:50px;
	}
	
.MOBILE #it218 .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 #it218 .e_BT ul.TOW{
	width:100%;
	height:50px;}
	
.MOBILE #it218 .e_BT ul.TOW li{
	float:left;
	width:50%;}
.MOBILE #it218 .e_BT li a{
	display:block;
	width:95%;
	margin:0 auto;
	height:50px;
	color: #fff;
	text-decoration:none;
}
		
.MOBILE #it218 .e_BT li a.ALINE{
	font-size: 1.1em;
	font-weight:bold;
	text-align:center;
	line-height:47px;
	}
	
.MOBILE #it218 .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 #it218 .e_BT li a.BLINE span.BR{
	display:block;
	}

.MOBILE #it218 a.COLOR{
	background-color:#ff0000;
	background: -moz-linear-gradient(
		top,
		#ff0000 0%,
		#b90000);
	background: -webkit-gradient(
		linear, left top, left bottom,
		from(#ff0000),
		to(#b90000));
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	border:1px solid #a30000;
	-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 #it218 .CON_BOX{ 
	width:92%;
	height:auto;
	overflow:hidden;
	margin:0 auto;}

.MOBILE #it218 .WHAT_BOX02_BAR{
	width:100%;
	background-color:#5c8800;
	height:50px;
	margin:10px auto 0 auto;
	font-size:1.4em;
	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 #it218 .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 #it218 .WHAT_BOX_BG{
	width:100%;
	height:auto;
	overflow:hidden;
	clear:both;
	margin:0 auto 15px auto;
	padding:10px 0;
	background-color: #fafff5;
	box-shadow: inset 0px 0px 25px rgba(137,187,58,0.5);
	-webkit-box-shadow: inset 0px 0px 25px rgba(137,187,58,0.5);
	-moz-box-shadow: inset 0px 0px 25px rgba(137,187,58,0.5);
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;}

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

.MOBILE #it218 .WHAT_BOX_BG .LISTBOX li.TITLES{
	background-image:none;
	width:100%;
    padding-left:10px;
    font-weight: bold;
	margin-top:15px;
	font-size:1.2em;
    color: #567800;
	line-height:1.6em;
    box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
    }
.MOBILE #it218 .WHAT_BOX_BG .LISTBOX li.TITLES-02{
	background-image:none;
	width:100%;
    padding-left:10px;
    font-weight: bold;
	margin-top:15px;
	font-size:1.2em;
    color: #E80000;
	line-height:1.6em;
    box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
    }
.MOBILE #it218 .WHAT_BOX_BG .LISTBOX .LINE{
    width: 100%;
    height: 5px;
    border-bottom: 1px dashed #a1b867;}

.MOBILE #it218 .WHAT_BOX_BG .LISTBOX ul li>ul li{
	width:100%;
	background-image:url(https://imgs.click108.com.tw/unit001/item00218/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 #it218 .CON_BOX_BAR02{/*NEW*/
	width:100%;
	height:60px;
	margin:0 auto;
	background-color: #f6e3ff;
	-webkit-box-sizing:border-box;}

.MOBILE #it218 .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 #it218 .WHAT_BOX02_BAR{font-size:1.2em;}
}


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

.MOBILE #it218 .CON_BOX img{display:block; width:100%;margin:0 auto;}
.MOBILE #it218 .CON_BOX_BG02 .BOX_INSET{/*內縮*/
	width: 90%; 
	height: auto;
	clear:both;
	overflow: hidden;
	margin: 0 auto; 
	margin:10px auto;}
.MOBILE #it218 .CON_BOX_BG02 .LISTIMG{/*配圖*/
	width:80%;
	margin: 0 auto;}

.MOBILE #it218 .CON_BOX_BG02 .LISTBOX{
	width:auto;
	height:auto;
	overflow:hidden;
	}
.MOBILE #it218 .CON_BOX_BG02 .LISTBOX li{
	width:auto;
	height:auto;
	overflow:hidden;
	margin-bottom: 5px;}
.MOBILE #it218 .CON_BOX_BG02 .LISTBOX li>ul li{
	width:auto;
	height:auto;
	overflow:hidden;
	line-height: 1.6em;
	font-size:1.2em;
	color:#333;}
.MOBILE #it218 .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/item00218/images/input_icon2.png);
	background-position: left bottom ;
	background-repeat: no-repeat;
	margin-top: 3px;
}

/*輸入框*/
.MOBILE #it218 .ENTER_TOP_BAR{
	width:100%;
	height:50px;
	background-color: #5c8800;
	margin:15px auto 0 auto;
	text-align:center;
	font-size:1.4em;
	line-height:50px;
	color:#FFF;
	font-weight:bold;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;}
.MOBILE #it218 .ENTER_BG{
	width:100%;
	height:auto;
	overflow:hidden;
	background-color:#FFF;
	border: 1px solid #5c8800;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	padding: 15px 10px ;}
.MOBILE #it218 .ENTER_BG .e_BT{width: 100%;}
.MOBILE #it218 .ENTER_FOOT{
	margin:0 auto 15px auto;}

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

/*========歲運球陣區塊======*/
.MOBILE #it218 .MAGIC_BALL{
    width:100%;
    height: 0;
    padding-bottom: 80.59%;
    background:url(https://imgs.click108.com.tw/unit001/item00218/images/input_ph02.jpg) no-repeat center;
    background-size: cover;
    position: relative;}

.MOBILE #it218 .MAGIC_BALL .BALL{
    width:20%;
    height: 20%;
    position: absolute;}

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

/*=========================結果頁面頭區================*/
/*第一塊引導區*/
.MOBILE #it218 .GUIDE{
	width:95%;
	height:auto;
	overflow:hidden;
	margin: 0 auto;}
	
.MOBILE #it218 .GUIDE li.TEXT{
	width:100%;
    font-size: 1.1em;
    line-height: 1.6em;
	}
.MOBILE #it218 .GUIDE li.PH {display: none;}
.MOBILE #it218 .GUIDE li.PH img,.MOBILE #it218 .GUIDE li.TEXT .BLANK{display: none;}

/*個人資料*/
.MOBILE #it218 .INFOR{
	width:100%;
	height:0;
	padding-bottom:23.1927710843373%;
	background:url(https://imgs.click108.com.tw/unit001/item00218/images/name_bg.jpg) no-repeat top center;
	background-size:cover;
	margin:0 auto;
	text-align: center;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	border-bottom:2px solid #76380c;
	}

.MOBILE #it218 .INFOR .T02_B{
    padding-top: 2vw;
	font-size:5vw;
    line-height: 1.4em;
	}
.MOBILE #it218 .INFOR .T03{
	font-size:4vw;
    line-height: 1.2em;
	}

.MOBILE #it218 .INFOR .GENDER{ 
	display:inline-block;
	width:4vw;
	height:4vw;
	margin:0 auto;
    vertical-align:baseline;}
.MOBILE #it218 .INFOR .GENDER img{ 
	display:block;
	width:100%;
	height:auto;
	margin:0 auto;}
/*個人資料尾*/
	
	
/*結果頁內容區框架*/
.MOBILE #it218 .RE_TOP_FOOT{/*標題圖*/
	border-bottom:2px solid #d79c1f;	
}
.MOBILE #it218 .RE_TOP_FOOT img{ clear:both;display:block;width:100%; margin:0 auto;}
.MOBILE #it218 .RE_BG{/*框線*/
	width:100%;
	height:auto;
	overflow:hidden;
	border:2px solid #d79c1f;
	margin:0 auto;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	}

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



/*內容欄位樣式用尾*/	
.MOBILE #it218 .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 #it218 .NAME_FIVE_218{
	width:100%;
	height:auto;
	overflow:hidden;}
	
.MOBILE #it218 .NAME_FIVE_BG_218{
	width:100%;
	height:0;
	padding-bottom:78.644578313253%;
	background-repeat: no-repeat;
	background-size:cover;
	position: relative;
	}

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

.MOBILE #it218 .NAME_TEXT01_218 li{
	float: left;
	width: 50%;
}
.MOBILE #it218 .NAME_TEXT02_218 ul{
	width: 45%;
	height: 100px;
	margin: 0 auto;
	text-align: center;
	position: absolute;
	top:20vw;
	right:0%;
}

.MOBILE #it218 .NAME_TEXT02_218 li{
	float:left;
	width: 33.3333333%;
}

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

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

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

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

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

/*姓名五行字型*/

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

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

.MOBILE #it218 .NAME_FIVE_218 .NAM_S02{
	font-size: 3vw;
	color: #999;
}
.MOBILE #it218 .NAME_FIVE_218 .NAM_S03{
	font-size:5vw;
	line-height:6vw;
	color: #762200;
	font-weight: bold;
}

.MOBILE #it218 .NAME_FIVE_218 .NAM_RED{
	color: #cc0000;
}

.MOBILE #it218 .NAME_FIVE_218 .NAM_YELLOW{
	color: #ffea00;
}
/*姓名五行內容尾*/

/*外內格*/
.MOBILE #it218 .OUTINSIDE{
	width:100%;
	height:auto;
	overflow:hidden;
    background-color: #ffe778;}

.MOBILE #it218 .OUTINSIDE img{
	width:100%;
	height:auto;}

.MOBILE #it218 .OUTINSIDE .CENTER_TEXT{
	width:100%;
	height:0;
    padding-bottom: 26.666%;
	background-repeat: no-repeat;
	background-size: cover;
    margin: 0 auto;
    position: relative;
	background-position: center center;}

.MOBILE #it218 .OUTINSIDE .CENTER_TEXT ul{
	display: block;
    position: absolute;
    top: 11%;
    left: 9%;
	width: 82%;
	height: 19vw;
	background-color: #fffde2;
    border: 1px solid #fffde2;}

.MOBILE #it218 .OUTINSIDE .CENTER_TEXT ul li:nth-child(1){
	width: 100%;
	height: auto;
	font-size: 5vw;
	line-height: 1.6em;
	color: #fff;
    font-weight: bold;
	text-align: center;}
.MOBILE #it218 .OUTINSIDE .CENTER_TEXT ul li:nth-child(2){
	width: 100%;
	height: auto;
	overflow: hidden;
	font-size: 7vw;
	line-height: 1.6em;
	color: #000;
	font-weight: bold;
	text-align: center;}
.MOBILE #it218 .OUTINSIDE .CENTER_TEXT ul li img{ 
    display: inline-block;
    width: 50%;
    height: auto; 
    vertical-align:middle;}

.MOBILE #it218 .OUTINSIDE .TITLE{
    width: 95%;
    height: auto;
    overflow: hidden;
    margin: 5px auto;
    margin-bottom: 10px;
    background-color: #fffed8;
	font-size: 1.5rem;
	line-height: 1.6em;
	color: #000;
	font-weight: bold;
	text-align: center;}
.MOBILE #it218 .OUTINSIDE .TITLE img{
    width: 100%;
    height: auto;
    margin: 2px 0;}

.MOBILE #it218 .OUTINSIDE .BOARD{
    width: 99%;
    height: auto;
    overflow: hidden;
    margin: 5px auto;
    overflow: hidden;}
.MOBILE #it218 .OUTINSIDE .BOARD ul li{
    float: left;
    width: 33%;
    height: auto;
    overflow: hidden;}
.MOBILE #it218 .OUTINSIDE .BOARD ul li img{
    width: 100%;
    height: auto;}
.MOBILE #it218 .OUTINSIDE .BOARD ul li.TXT{
    width: 33%;
    height: 0;
    padding-bottom: 33%;
    font-size: 5vw;
    line-height: 14vw;
	color: #FFF;
	font-weight: bold;
	text-align: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.MOBILE #it218 ul.WARN_LIST {}

.MOBILE #it218 ul.WARN_LIST li{
	background-image:url(https://imgs.click108.com.tw/unit001/item00218/images/result_icon.png);
    background-size: 28px 28px;
	background-repeat:no-repeat;
	background-position-x:5px;
	background-position-y:1px;
	padding-left:40px;
	width:100%;
	margin-bottom:10px;}
/*內外格end*/

.MOBILE #it218 .FRAME_TITLE{/*各歲框*/
	width: 100%;
	height: auto;
    margin: 20px auto 0 auto;}
.MOBILE #it218 .FRAME_TITLE img{width: 100%; height: auto;}


.MOBILE #it218 .FRAME_WORD{
    width: 100%;
	height: 0;
    padding-bottom: 40%;
    padding-left: 36vw;
    font-size: 8.6vw;
    line-height: 36vw;
	color: #333;
	font-weight: bold;
    background-repeat: no-repeat;
    background-size: cover;
}

.MOBILE #it218 .FRAME_WORD img{ 
    display: inline-block;
    width: 75%;
    margin-left: -16px;
    height: auto; 
    vertical-align:middle;}

.MOBILE #it218 .FRAME_BG{
	width: 100%;
	height: auto;
	margin: 0 auto;
    background-color: #fff2f2;
	}


/*大運捲軸*/
.MOBILE #it218 .OLD_CALENDAR{
	width: 98%;
    height: 0;
    padding-bottom: 45%;
    background-size: cover;
	background-image: url(https://imgs.click108.com.tw/unit001/item00218/images/old_paper.jpg);
    background-repeat: no-repeat;
    position: relative;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	margin:10px auto;}

.MOBILE #it218 .OLD_CALENDAR ul{
    width:20%;
	height:72%;
    position: absolute;}
.MOBILE #it218 .OLD_CALENDAR ul li{
    width: 100%;
    height: 33%;
    font-size: 4vw;
	line-height: 2.2em;
    color: #000;
	text-align: center;
	font-weight: bold;}
.MOBILE #it218 .OLD_CALENDAR ul li:nth-child(2),.MOBILE #it218 .OLD_CALENDAR ul li:nth-child(3){
    font-size: 5.5vw;
	line-height: 1.6em;}
.MOBILE #it218 .OLD_CALENDAR ul.ON{
    background-color: rgba(255,249,200,0.7);
    border: 2px solid #a70101;
}
.MOBILE #it218 .OLD_CALENDAR .ARROW{
    width:20%;
	height:23%;
    position: absolute;
    z-index: 10;
    font-size: 4vw;
	line-height: 1.8em;
    color: #a70101;
	text-align: center;
	font-weight: bold;
    background-image: url(https://imgs.click108.com.tw/unit001/item00218/images/arrow.png);
    background-size: 25%;
    background-repeat: no-repeat;
    background-position: center bottom;
}
.MOBILE #it218 .OLD_CALENDAR .SAMPLE03{
    width:100%;
    font-size: 5vw;
}

.MOBILE #it218 .OLD_CALENDAR .FREE_BT{clear: both;}
/*大運捲軸尾*/

/*很重要區塊*/
.MOBILE #it218 .IMPORTANT_TITLE{
	width: 100%;
	height: auto;
    overflow: hidden;}
.MOBILE #it218 .IMPORTANT_TITLE img{
    width: 100%;
    height: auto;
}

.MOBILE #it218 .IMPORTANT_BG{
	width: 100%;
	height: auto;
    overflow: hidden;
    background-image: url(https://imgs.click108.com.tw/unit001/item00218/images/frame_bg.jpg);
    background-repeat: repeat-y;
    background-size: 100% auto;
    padding: 2%;}

.MOBILE #it218 .IMPORTANT_BG .CALENDAR{
    width: 90%;
    height: 0;
    padding-bottom: 43%;
    background-size: cover;
    margin: 10px auto;
    font-size: 8vw;
    padding-left: 15vw;
	line-height: 3.6em;
    text-align: center;
	font-weight: bold;
    color: #333;
    -webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

/*九宮格*/
.MOBILE #it218 .NINEBOARD{
    width: 96%;
    height: 0;
    padding-bottom: 89%;
   
    background-size: cover;
    margin: 10px auto;
    background-image: url(https://imgs.click108.com.tw/unit001/item00218/images/nine_board.jpg);
    background-repeat: no-repeat;
    position: relative;
    -webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;}

.MOBILE #it218 .NINEBOARD ul{
    width: 100%;
    height: 0;
    padding-bottom: 88%;
    padding-left: 8%;
    padding-right: 8%;
    padding-top: 5%;
    -webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;}
.MOBILE #it218 .NINEBOARD ul li{
    float: left;
    width: 26.3%;
    height: 0;
    padding-bottom: 27%;
    margin: 3% 3.5%;
    opacity: 0.8;}
.MOBILE #it218 .NINEBOARD ul li.ON{
    background-image: url(https://imgs.click108.com.tw/unit001/item00218/images/circle.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}


/*開運配圖內容*/
.MOBILE #it218 .MAP_COM{
	width: 100%;
	height: auto;
	overflow: hidden;}

.MOBILE #it218 .MAP_COM .MAP_PH{
	width: 60%;
	height: auto;
	overflow: hidden;
	margin: 5px auto;}
.MOBILE #it218 .MAP_COM .MAP_PH img{width: 100%;height: auto;}
.MOBILE #it218 .MAP_COM .MAP_TEXT{
	width: 100%;
	height: auto;
	overflow: hidden;
	margin: 5px 0;}
.MOBILE #it218 .MAP_COM .MAP_TEXT p.T03{text-align: center;}
.MOBILE #it218 .MAP_COM .MAP_TEXT .FREE_BT{/*按鈕位置*/
    top: 8%; 
}

/*符咒下載區*/
.MOBILE #it218 .D_IMGBOX{
	width: 96%;
	height: auto;
	overflow: hidden;
	clear: both;
	margin: 0px auto 10px auto;
    padding-bottom: 10px;
    margin-bottom: 10px;
    background-color: #fff0f0;
    -moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
    }
.MOBILE #it218 .D_IMGBOX .TITLE{
    width: 88%;
    color: #a70101;
    padding:15px 0 10px 0;
    border-bottom: 1px solid #fecdcd;
    text-align: center;
	font-weight: bold;
    margin: 0 auto;
    font-size: 1.5em;}
.MOBILE #it218 .D_IMGBOX p.MBD{display: none;}

.MOBILE #it218 .D_IMG{
	width: 78%;
	height: 0;
    padding-bottom: 130%;
	overflow: hidden;
	clear: both;
	margin: 10px auto;
    position: relative;
    background-image: url( https://imgs.click108.com.tw/unit001/item00218/images/d_img/dw_0.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    }

.MOBILE #it218 .D_IMGBOX p.PCD{display: none;}
.MOBILE #it218 .D_IMGBOX p.MBD{display: block;}

.MOBILE #it218 .FREE_D_IMG{
	width: 100%;
	height: auto;
	overflow: hidden;
	clear: both;
	margin: 0px auto;
    position: relative;
    text-align: center;
    }
.MOBILE #it218 .FREE_D_IMG .SAMPLE03{font-size: 4vw;}	
.MOBILE #it218 .PRINT{ display:none;}	

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


/*=========================試算頁面頭區================*/
	
.MOBILE #it218-wrapper .NEW_BT_F{/*浮水按鈕*/
	width:100%;
	height:60px;
	position:fixed;
	bottom:0;
	z-index:1000;
	background-image:url(https://imgs.click108.com.tw/unit001/item00218/images/bt_bg.png);
	background-repeat:repeat;
	padding-top:4px;
	background-size:15px 15px;
	}
	
.MOBILE #it218-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:#ff0000;
	background: -moz-linear-gradient(
		top,
		#ff0000 0%,
		#b90000);
	background: -webkit-gradient(
		linear, left top, left bottom,
		from(#ff0000),
		to(#b90000));
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	border:1px solid #a30000;
	-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 #it218 .SAMPLE{
	width:100%;
	height:150px;
	position:relative;
	background-position:-7px top;
	margin:5px auto;
	background-image:url(https://imgs.click108.com.tw/unit001/item00218/images/fuzzy.png);
	}
	
.MOBILE #it218 .SAMPLE02 {
	width:100%;
	height:350px;
	position:relative;
	background-position:-7px top;
	margin:0px auto;
	background-image:url(https://imgs.click108.com.tw/unit001/item00218/images/fuzzy_list.png);
    background-repeat: no-repeat;
	}

.MOBILE #it218 .SAMPLE03 {
	width:88%;
	height:auto;
    overflow: hidden;
	position:absolute;
    padding: 3% 1%;
    color: #333;
    font-size: 1.2em;
	font-weight:bold;
	line-height:1.4em;
    background-color: rgba(255,218,91,0.9);
    -moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
    -moz-box-shadow:
		 2px 8px 15px rgba(0,0,0,0.3);
	-webkit-box-shadow:
		 2px 8px 15px rgba(0,0,0,0.3);
	box-shadow:
		 2px 8px 15px rgba(0,0,0,0.3);}

.MOBILE #it218 .SAMPLE03 img {
    float: left;
    width: 38%;
    padding-right: 2%;
    padding-top: 2%;
    height: auto;
    margin: 5px auto;
}



.MOBILE #it218 .FREE_PH{ 
	width:100%;
	height:auto;
    overflow: hidden;
	margin:15px auto 20px auto; 
	clear:both;}

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