@import url('https://fonts.googleapis.com/css?family=Noto+Sans+TC:300,400,500|Noto+Serif+TC:500|Concert+One|Barlow');
.page{
	background-image: url(../img/guides/bg.gif);
}
.guidesright a:link ,a:visited{
	color:#069;
	text-decoration:underline;
	transition: 0.2s;
}
.guidesright{
	max-width:1200px;
	margin:0 auto;
}
.bgTOP {
	background-image: url(../img/guides/bg_top.gif);
	background-repeat: repeat-x;
	height: 11px;
	width: 100%;
	position:fixed;
	z-index:100;
}
.bgLEFT{
	position:fixed;
	background-color:#FFF;
	width:35%;
	left:0px;
	height:100%;
	z-index:90;
	transition: .5s ease;
}
#logo1{/*寬扁*/
	transform:skewY(-3deg);
	margin:50px auto;
	display:block;
}
#logo3{/*細長*/
	transform:skewY(-3deg);
	margin:50px auto;
	display:none;
}
.text50f img{/*問題上的圖(編號)*/
	margin-top:80px;
}
.version{/*每一問題的大框*/
	padding-top:0px;
	margin-bottom:20px;
	display: flex; 
}
.version_bg_top{/*跨兩版本(粉紅色)*/
	padding-top:2px;
	position:absolute;
	z-index:-10;
	background-color:#FFCCCC;
	border-radius:40px;
	width:61%;
	right:4.5%;
	text-align:center;
	height:130px;
}
.version_bg{/*小區塊1/3(紫色)*/
	background-color:#C7B4E4;
	border-radius:30px;
	width:30%;
	margin:0 1.5% 0;
	display:inline-block;
	text-align:center;
	vertical-align:top;
	padding:20px ;
	box-sizing: border-box;
	flex: 1;
}
#p1Title{
	vertical-align:top;
}
#p1TitleBox{
	display:inline-block;
	vertical-align:bottom;
	white-space:nowrap;
	vertical-align:top;
}
.versionLeft{/*小區塊1/2(紫色)*/
	width:48%;
	margin:0 1.5% 0;
	display:inline-block;
	vertical-align:top;
}
.versionLeftTable {/*小區塊1/2(表格)*/
	border:#000 3px solid;
	background-color:#B3E6E6;
}
.versionLeftTable #tdn td{
	padding:8px;
	text-align:center;
}
.versionLeftTable #p1{
	width:37%;
}
.versionLeftTable #tdn #p2{
	padding:12px;
	text-align:left;
}
.td_1{
	text-align:center;
	padding:4px;
}
.td_2{
	text-align:center;
	padding:4px;
}
.pBasic{/*各問題框基本*/
	text-align:left;
	padding:20px 25px 30px;
}
.p2{
	-webkit-flex: 1; 
    -ms-flex: 1; 
    flex: 1; 
}
.p2 img{margin-top:10px;}
.p3{
	width:46%;
	-webkit-flex: 1; 
    -ms-flex: 1; 
    flex: 1; 
}
.p4{
	width:100%;
	margin:0;
	padding-top:10px;
}
.p4 img{
	margin-right:0px;
	position:relative;
	left:-8px;
	top:3px;
}
.p5{
	width:85%;
	margin:-40px auto 0;
}
.p6{
	width:95%;
	margin:-10px auto 30px;
	border-top:4px #000 solid;
	border-right:3px #000 solid;
	border-bottom:3px #000 solid;
}
#p6TB{	
	background-color:#B3E6E6;
}
#p6TB td{
	text-align:center;
	padding:8px;
}
#p6TB td img{
	margin-top:7px;
}
#p6TB td:nth-child(1n+1){
	border-right:1px #000 solid;
	border-bottom:1px #000 solid;
}
#p6TB td:first-child {
	border-bottom:1px #000 solid;
	left:0;
	background-color:#66CCCC;
	text-align:left;
	padding:5px 15px;
	border-left:4px #000 solid;
	border-right:2px #000 solid;
	position:sticky;
	position:-webkit-sticky;
}
#p2A:link ,#p2A:visited{
	color:#069;
	text-decoration:blink;
}
#p2A:hover{
	color:#FFC;
	text-decoration:blink;
}
#p6TBD a:link ,#p6TBD a:visited{
	color:#000;
	text-decoration:blink;
}
#p6TBD img{transition: 0.2s;}
#p6TBD img:hover{
	-webkit-filter:saturate(3); transition: 0.2s;	
}
.p6 #p6{
	text-align:center;
	background-color:#66CCCC;
	padding:5px;
	width:17%;
}
.version_icon{
	margin:-10px 5px 0px 0px;
	vertical-align:top;
}
.version_box{/*(p1)上半部*/
	vertical-align:bottom;
	margin-bottom:15px;
	text-align:left;
}
#version_boxT{
	display:inline-block;
}
#date80{
	display:inline-block;
}
.version_date_box{
	margin-top:10px;
	text-align:center;
}
.version_price_box{/*售價區塊*/
	background-color:#EDE7F5;
	border-radius:22px;
	width:100%;
	padding:5px;
	box-sizing: border-box;
}
.version_price{/*售價區塊(半部)*/
	margin:20px 5%;
	display:inline-block;
}
.SearchSectionBOX ,.ruleBox{
	text-align:center;
	margin-bottom: 70px;
}
.ruleBox{display: flex;}
.SearchSectionNEW {
	disabled:disabled;
	width:95%;
    border: 2px solid #66CCCC;
	background-color:#FFF;
	margin-top:10px;
}
.flipx {transform: rotateY(180deg);}
.SectionBOX{
	width:100%;
	max-width:1440px;
	margin:5px auto;
	text-align:center;
}
.SectionBOX table{
	margin:0 auto;
	text-align:center;
}
.icon001{
	margin:-6px 12px;
}
.btn_1{
	width:240px;
	color:#FFFFCC;
	padding:10px 0px 2px;
	background-color:#1691BE;
	border-radius:10px;
	box-shadow:inset 3px 3px 1px rgba(255,255,255,0.3),inset -3px -3px 1px rgba(0,0,0,0.1),4px 4px 0px rgba(255,255,255,0.4),-4px 4px 0px rgba(255,255,255,0.4),4px -4px 0px rgba(255,255,255,0.4),-4px -4px 0px rgba(255,255,255,0.4);
	position:relative;
	margin:-40px auto 0px;
	vertical-align:middle;
	transition: 0.2s;
	/*cursor: pointer;*/
}
.btn_1:hover{-webkit-filter:saturate(2); transition: 0.2s;}
.btn_1txt{
	text-shadow: -1px -1px rgba(0,0,0,0.3);
	display:inline-block;
	top:-10px;
	position:relative;
	margin:0 10px 
}
.triangle{
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 7px 0 7px 10px;
	border-color: transparent transparent transparent #ffffff;
	display:inline-block;
	filter: drop-shadow(-1px -1px rgba(0, 0, 0, 0.3));
	margin:0 0px 12px 0px;
}
.rectangle{
	width:1px;
	height:42px;
	box-shadow:-1px 0px rgba(0, 0, 0, 0.3);
	background-color:rgba(255,255,255, 0.3);
	display:inline-block;
	margin:0 20px;
}
.howBox{
	display:inline-block;
	position:absolute;
	bottom:7px;
	transition: 0.2s;
}
.howBox:hover{-webkit-filter:saturate(2); transform:translateX(10px) ; transition: 0.2s ease;}
.howTriangle{
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 7px 13px 7px 0;
	border-color: transparent #3fbebe transparent transparent;
	display:inline-block;
	position:relative;
	top:8px;
}
.howBoxL{
	width:50px;
	height:80px;
	border-radius:10px 0px 0 10px;
	background-color:#3FBEBE;
	display:inline-block;
	vertical-align:middle;
	text-align:center;
	padding-top:18px;
	border-right:#36A2A2 2px solid;
}
.howBoxR{
	width:80px;
	height:80px;
	border-radius: 0px 10px 10px 0;
	background-color:#3FBEBE;
	display:inline-block;
	vertical-align:middle;
	text-align:center;
	padding-top:15px;
	line-height:26px;
}
#icon01C{
	display:none;
}
.menu ul a{
	color:#000;
}
.menu ul li:hover{
	background-color:#3fbebe;
	color:#FFF;
	transition: 0.1s;
}
.menuUL li div{
	display:inline-block;
}
.menuUL li{
	border:1px #3fbebe solid;
	width:28%;
	margin:5px;
	display:inline-block;
	text-align:left;
	padding:5px 15px;
}
.menu{
	width:90%;
	margin:40px auto 0px;
	text-align:center;
}
@media screen and (max-width: 1280px) {
	.bgLEFT{
		width:6%;
		padding:30px 8px;
	}
	.right{
		width:94%;
	}
	.p6{
		width:98%;
	}
	.menu{
		width:100%;
	}
}
@media screen and (max-width: 1024px) {
	.menuUL li{
		width:40%;
	}
}
@media screen and (max-width: 1000px) {
	.menuUL li{
		width:44%;
	}
	.bgTOP {
		position:absolute;
		width:100%;
	}
	.bgLEFT{
		width:100%;
		height:100%;
		left:-100%;
		top:0px;
		z-index:500;
	}
	.right{
		width:100%;
		padding:0px 12px;
	}
	.version_box{/*(p1)上半部*/
		margin-bottom:10px;
	}
	.version_bg_top{/*跨兩版本(粉紅色)*/
		border-radius:30px;
		width:64.5%;
		right:1.5%;
	}
	.version_bg{/*小區塊1/3(紫色)*/
		display:block;
		border-radius:25px;
		margin:0 1% 0;
	}
	.version_price_box{/*售價區塊*/
		border-radius:18px;
	}
	.versionLeft{/*小區塊1/2(紫色)*/
		margin:0 1% 0;
		display:block;
	}
	.pBasic{/*各問題框基本*/
		padding:20px 15px 20px;
	}
	.p4 img{
		left:-4px;
		top:4px;
	}
	.p5{
		width:95%;
	}
	.p6{
		width:98%;
	}
	#p6TB td:first-child {
		padding:5px 10px;
	}
	.SearchSectionBOX ,.ruleBox{
		margin-bottom: 40px;
	}
	.closeBox{
		display:block;
		border-radius:100px;
		position:absolute;
		width:100%;
		bottom:0px;
		text-align:center;
	}
	.closeBG{
		border-radius:100px;
		background-color:#DDD;
		margin:20px auto;
		width:80px;
		height:80px;
	}
	.closeBG:after{
		position: absolute;
		top: 0;
		bottom: 0;
		left: 2px;
		right: 0;
		content: "\d7"; /* use the hex value here... */
		font-size: 104px; 
		color: #FFF;
		line-height:99px;
		text-align: center;
	}
	@media screen and (max-width: 600px) {
		.menuUL li{
			width:90%;
		}
		.guidesright{
			width:95%;
		}
		.version{/*每一問題的大框*/
			display:inline; 
		}
		.version_bg_top{/*跨兩版本(粉紅色)*/
			display:none;
		}
		.version_bg{/*小區塊1/3(紫色)*/
			border-radius:20px;
			width:100%;
			margin:0 0 25px;
			padding:0 10px 10px;
			box-sizing: border-box;
		}
		#version_p1{
			text-align:left;
		}
	
		.versionLeft{/*小區塊1/2(紫色)*/
			width:100%;
			margin:0 0 20px;
		}
		#p6TB{
			width:750px;
			margin:0px;
			table-layout: fixed;
		}
		#p6TB td:first-child {
			position:sticky;
		}

		#p6TBC{
			display:inline-block;			
		}
		#p6TBD{
			display:inline-block;
			overflow:auto;
			max-width:100%;
			border:4px rgba(255,255,255,0.5) solid;
			margin-bottom:30px;
		}
		.ruleBox{
			display:inline; 
		}
		.pBasic{/*各問題框基本*/
			padding:20px 15px;
		}
		.p3{
			width:100%;
		}
		.p5{
			width:100%;
			padding:20px 10px;
		}
		.version_icon{
			height:100px;
			display:inline-block;
			float:left;
		}
		#p1Title{
			padding-top:10px;
			display:block;
			line-height:40px;
			text-align:left;
		}
		#p1TitleBox{
			display:inline-block;
			vertical-align:bottom;
			white-space:nowrap;
		}
		.text80 ,.text26{
			display:inline-block;
		}
		.version_box{/*(p1)上半部*/
			text-align:left;
			height:140px;
		}
		.S_rotate{
			transform:rotate(0deg);
		}
		.version_price_box{/*售價區塊*/
			text-align:center;
			border-radius:15px;
		}
		.version_price{/*售價區塊(半部)*/
			margin:15px;
			text-align:left;
		}
		#icon01L{
			vertical-align:middle;
			float:left;
			margin:6px 6px 0 0;
			position:relative;		
		}
		#icon01C{
			display:block;	
			vertical-align:middle;
			float:right;
			margin:6px 0 0 6px;
			position:relative;		
		}
		#icon01R{
			display:none;	
		}
		.howBox{
			bottom:55px;
			right:20%;
		}
		.howTriangle{
			top:32px;
			left:30px;
			border-width: 10px 8px 0 8px;
			border-color: #3fbebe transparent transparent transparent;
		}
		.howBoxL{
			display:none;
		}
		.howBoxR{
			width:66px;
			height:66px;
			border-radius: 10px;
			padding-top:12px;
			line-height:22px;
		}
		.closeBG{
			margin:10px auto;
			width:50px;
			height:50px;
		}
		.closeBG:after{
			font-size: 64px;
			line-height:58px;
		}		
	}
}
.text16 ,.p6{
	font-family: 'Noto Sans TC', serif;
	font-size:16px;
}
.text19 ,.p6 #p6 ,.p6 #p7 ,.bot_t{
	font-family: 'Noto Sans TC', serif;
	font-size:19px;
}
.text19ps{/*各銀行*/
	font-family: 'Noto Sans TC', serif;
	font-size:19px;
	padding-left:22px;
}
.text20{
	font-family: Arial, 'Noto Sans TC', serif;
	font-size:20px;
}
.text22{
	font-family: 'Noto Sans TC', serif;
	font-size:22px;
}
.text26{/*基本文字(p1)*/
	font-size:26px;
	font-family: 'Noto Sans TC', serif;
}
.text26Btn{/*按鈕巧連智官網(p1)*/
	font-size:26px;
	font-family: 'Noto Sans TC', serif;
}
.text28 ,.menu ul li{/*Menu主文字*/
	font-size:26px;
	font-family: 'Noto Serif TC', serif;
}
.text30{
	font-family: 'Noto Sans TC', serif;
	font-size:30px;
}
.text30nb ,.menuUL li::after , .menu_nb{/*Menu數字*/
	font-family: 'Barlow', sans-serif;
	font-size:24px;
}
.text36{/*詳細問題的問號*/
	font-family:'Concert One', cursive;
	font-size:36px;
}
.text40{/*在官網首頁輸入生日自動帶去適合版本*/
	font-family: 'Noto Sans TC', serif;
	font-size:40px;
}
.text46{/*售價數字*/
	font-family: 'Noto Sans TC', serif;
	font-size:46px;
	line-height:42px;
}
.text50{/*方式「123」數字*/
	font-family: Arial, 'Noto Sans TC', serif;
	font-size:50px;
	font-style:italic;
	font-weight:bold;
}
.text50f{/*問題標題*/
	font-size:50px;
	font-family: 'Noto Serif TC', serif;
	text-align:center;
	margin-bottom:40px;
	position:relative;
}
.text74{/*版本(p1)*/
	font-family: 'Noto Sans TC', serif;
	font-size:66px;
	font-weight:500;
	line-height:76px;
}
.text80{/*版本大數字(p1)*/
	font-size:70px;
	font-family: Arial, 'Noto Sans TC', serif;
	line-height:64px;
	color:#FFF;
}
.textS,.p6 #p6 ,.p6 #p7{font-weight:300;}
.textM{font-weight:400;}
.textL{font-weight:500;}
.t_FFF{color:#FFF;}
.t_FFC{color:#FFFFCC;}
.t_767{color:#76737A;}
.t_F36{color:#FF3366;}
.t_069{color:#006699}
.t_bg936{
	background-color:#993366;
	color:#FFF;
	padding:4px 10px 4px;
}
.textIndent{
	padding-left:22px;
}
.hL{
	background-color:transparent;
	background-image:-webkit-linear-gradient(transparent 45%,#FFB5DA 45%,#FFB5DA 120%);
}
.menuMark{
	background-color:transparent;
	background-image:-webkit-linear-gradient(transparent 45%,#FFFF33 45%,#FFFF33 120%);
}
.textSP1{/*可以去哪裡查件*/
	position:relative;
	text-indent:-4em;
	left:0em;
	padding-left:4em;
}
.textN_1680{display:none;}/*1680+不斷行*/
.textN_1440{display:none;}/*1440+不斷行*/
.textN_1000{display:none;}/*1440+不斷行*/
@media screen and (min-width: 1441px) and (max-width: 1680px) {
	
	.text74{/*版本(p1)*/
		font-size:60px;
		line-height:66px;
	}
	.textN_1680{display:block;}/*1680斷行*/
}
@media screen and (max-width: 1440px) {
	#t1{
		font-size:36px;
		line-height:46px;
	}
	.text40{/*在官網首頁輸入生日自動帶去適合版本*/
		font-size:38px;
	}
	.text50{/*方式「123」數字*/
		line-height:30px;
	}
	.text74{/*版本(p1)*/
		font-size:60px;
		line-height:56px;
	}
	.text80{/*版本大數字(p1)*/
		font-size:66px;
		line-height:60px;
	}
	.textN_1680{display:block;}/*1680斷行*/
	.textN_1440{display:block;}/*1440斷行*/
}
@media screen and (max-width: 1280px){
	.textN_1680{display:none;}/*1680+不斷行*/
	.textN_1440{display:none;}/*1440+不斷行*/
	.bot_t{
		font-size:24px;
	}
}
@media screen and (max-width: 1024px) {
	#t1{
		font-size:36px;
		line-height:46px;
	}
	.text50{/*方式「123」數字*/
		line-height:30px;
	}
	.text74{/*版本(p1)*/
		font-size:52px;
		line-height:56px;
		margin-top:10px;
	}
	.text80{/*版本大數字(p1)*/
		font-size:56px;
		line-height:64px;
	}
	.textN_1680{display:block;}/*1680斷行*/
	.textN_1440{display:block;}/*1440+不斷行*/
}
@media screen and (max-width: 1000px) {
	.text19 ,.p6 #p6 ,.p6 #p7 ,.bot_t{
		font-size:16px;
	}
	.bot_t{
		font-size:26px;
		line-height:30px;
	}
	.text19ps{/*各銀行*/
		font-size:16px;
	}
	.text22{
		font-size:18px;
	}
	.text26{/*基本文字(p1)*/
		font-size:22px;
	}
	.text28 ,.menu ul li{/*Menu主文字*/
		font-size:22px;
	}
	.text30nb ,.menuUL li::after , .menu_nb{/*Menu數字*/
		font-size:28px;
		position:relative;
		top:1px;
	}
	.text40{/*在官網首頁輸入生日自動帶去適合版本*/
		font-size:31px;
	}
	.text46{/*售價數字*/
		font-size:38px;
	}
	.text50{/*方式「123」數*/
		line-height:30px;
	}
	.text50f{/*問題標題*/
		font-size:36px;
		font-family: 'Noto Serif TC', serif;
		text-align:center;
		margin-bottom:40px;
		position:relative;
	}
	.text74{/*版本(p1)*/
		font-size:36px;
		line-height:44px;
	}
	.text80{/*版本大數字(p1)*/
		font-size:42px;
		line-height:38px;
	}
	.textN_1680{display:block;}/*1680斷行*/
	.textN_1440{display:block;}/*1440+斷行*/
	.textN_1000{display:block;}/*1000-斷行*/
	@media screen and (max-width: 600px) {
		#textP4{
			font-size:30px;
		}
		.bot_t{
			font-size:15px;
			line-height:20px;
		}
		.text28 ,.menu ul li{/*Menu主文字*/
			font-size:22px;
		}
		.text30{
			font-size:26px;
		}
		.text30nb ,.menuUL li::after , .menu_nb{/*Menu數字*/
			font-size:26px;
			top:1px;
		}
		.text40{/*在官網首頁輸入生日自動帶去適合版本*/
			font-size:22px;
			line-height:26px;
		}
		.text46{/*售價數字*/
			font-size:44px;
			margin:10px 5px 10px 0;
			line-height:60px;
		}
		.text50f{/*問題標題*/
			margin-bottom:30px;
		}
		.textN_600{display:none;}/*消失*/
		.t_bg936{
			margin:0 6px 0px 0;
		}
		.textN_1440{display:none;}/*1440+不斷行*/
	}
	@media screen and (max-width: 360px) {
		.bot_t{
			font-size:14px;
		}
		.text28 ,.menu ul li{/*Menu主文字*/
			font-size:20px;
		}
		.text30nb ,.menuUL li::after , .menu_nb{/*Menu數字*/
			font-size:24px;
		}
		.text50f{/*問題標題*/
			font-size:30px;
		}
		#textP4{
			font-size:25px;
		}
		.text74{/*版本(p1)*/
			font-size:38px;
		}
		.text80{/*版本大數字(p1)*/
			font-size:42px;
		}
	}

}