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

.POP, .POP *{-webkit-box-sizing:border-box;
-webkit-text-size-adjust:none;
text-decoration:none;
font-family:Arial, Helvetica, sans-serif;}


.pop_t01{
	font-size:1em;
	line-height:1.6em;
	color:#333;
	font-weight:bold;}

.pop_t02{
	font-size:1.2em;
	line-height:1.6em;
	color:#333;
	font-weight:bold;}
.pop_t03{
	font-size:1em;
	line-height:1.6em;
	color:#6f25a7;
	font-weight:bold;}

.pop_t04{
	font-size:1em;
	line-height:1.6em;
	color:#333;}
.pop_t05{
	font-size:0.8em;
	line-height:1em;
	color:#333;}

.pop_t06{
	color:#cc0000;
	font-weight:bold;}

.old_t01{
	font-size:1.2em;
	line-height:1.5em;
	font-weight:bold;
	color:#6f25a7;}

.old_t02{
	font-size:0.8em;
	line-height:1.2em;
	color:#333;}

.POP{
	width:90%;
	height:auto;
	overflow:hidden;
	margin:0 auto;
	background-color:#FFF;
	border: 1px solid #570a91;
	webkit-border-radius: 5px;
	moz-border-radius: 5px;
    border-radius: 5px;
	box-shadow:0px 0px 8px #333333;}

.POP .COM{
	width:100%;
	height:auto;
	overflow:hidden;
	margin:0 auto;
	padding:10px;}

.POP .RABOX{
	width:100%;
	height:auto;
	padding:8px 5px 2px 5px;}

.POP .TBAR{
	width:100%;
	height:35px;
	background-color:#6f25a7;
	-webkit-border-top-left-radius: 3px;
	-webkit-border-top-right-radius: 3px;
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-topright: 3px;
	border-top-left-radius: 3px;
	border-top-right-radius: 3px;
	}

.POP .TBAR .XX{
	width:35px;
	height:35px;
	float:right;}

.POP .TBAR .XX a{
	display:block;
	width:35px;
	height:35px;
	background-repeat:no-repeat;
	background-size:25px 25px;
	background-position:center center;
	background-image:url(https://imgs.click108.com.tw/unit001/item00201/images/pop_x_icon.png);
	}

.POP .BT01{
	width:100%;
	height:45px;
	margin:0 auto;
	margin-top:10px;
	}


.POP .BT01 li{
	width:100%;
	float:left;
	margin:0 auto;
	margin-bottom:10px;
	}


.POP .BT01 li a{
	display:block;
	width:100%;
	height:45px;
	font-size: 1.2em;
	color: #333333;
	text-align:center;
	line-height:45px;
	background-color:#cfcfcf;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	border:1px solid #969696;
	-moz-box-shadow:
		inset 0px 0px 2px rgba(255,255,255,1);
	-webkit-box-shadow:
		inset 0px 0px 2px rgba(255,255,255,1);}


.POP .BT02{
	width:100%;
	height:45px;
	margin:0 auto;
	margin-top:10px;
	}

.POP .BT02 li{
	width:49.3%;
	float:left;
	}

.POP .BT02 li:first-child{
	margin-right:1px;
	}
.POP .BT02 li:last-child{
	margin-left:2px;
	}


.POP .BT02 li a{
	display:block;
	width:100%;
	height:45px;
	font-size: 1.2em;
	color: #333333;
	text-align:center;
	line-height:45px;
	background-color:#cfcfcf;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	border:1px solid #969696;
	-moz-box-shadow:
		inset 0px 0px 2px rgba(255,255,255,1);
	-webkit-box-shadow:
		inset 0px 0px 2px rgba(255,255,255,1);}


.POP_LINE{
	width:100%;
	height:1px;
	background-color:#CCC;
	margin-top:5px;
	margin-bottom:5px;}


.COM .TUL{
	width:100%;
	}

.COM .TUL ul{
	width:100%;
	padding-left:25px;
	}

.COM .TUL li{
	width:100%;
	list-style-type: decimal;
	font-size:0.8em;
	line-height:1.6em;
	color:#333;
	}




/*圓角選項*/

.radio{
	margin-bottom:10px;
	}

.radio label{
    display: inline-block;
    cursor: pointer;
    position: relative;
    padding-left: 25px;/*文字離框框距離*/
	padding-top:3px;/*文字上方離框框距離*/
	}
.radio input[type=radio] {
    display: none;
	}
.radio label:before {
    content: "";
	display: inline-block;
	width: 20px;
    height:20px;
	margin-right: 10px;
    position: absolute;
    left:0px;
	top: 5px;
  	background-color: #aaa;
    box-shadow: inset 0px 2px 3px 0px rgba(0, 0, 0, .3), 0px 1px 	0px 0px rgba(255, 255, 255, .8);}

.radio label:before {
    border-radius: 20px;}

input[type=radio]:checked + label:before {
    content: "\2022";
    color: #ffffff;
    font-size: 35px;
    text-align: center;
    line-height: 18px;}




/*方形選取方塊*/
.checkbox{
	margin-top:10px;
	margin-bottom:10px;
	}

input[type=checkbox] {
	display: none;
	}
.checkbox label {
	display: inline-block;
	cursor: pointer;
	position: relative;
	padding-left: 25px;/*文字離框框距離*/


	}
.checkbox label:before {
	content: "";
	display: inline-block;
	width: 20px;
	height: 20px;
	margin-right:10px;
	position: absolute;
	left: 0;
	top: 3px;
	background-color: #999;
	box-shadow: inset 0px 2px 3px 0px rgba(0, 0, 0, .3), 0px 1px 0px 0px rgba(255, 255, 255, .8);
	}
.checkbox label {
	margin-bottom: 0px;

}
.checkbox label:before {
	border-radius: 3px;
}

input[type=checkbox]:checked + label:before {
	content: "\2713";
	text-shadow: 2px 2px 2px rgba(0, 0, 0, .2);
	font-size: 20px;
	color: #ffffff;
	text-align: center;
	line-height: 18px;

}

.PC .confirmUpDiv{
  position:fixed;
  width:400px;
  left:50%;
  top:20%;
  z-index:10003;
  margin-left: -200px;
}

.MOBILE .confirmUpDiv{
  position:fixed;
  width:100%;
  left:0px;
  top:20%;
  z-index:10003;
}
