﻿@charset "utf-8";
/* CSS Document */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
	padding: 0;
	margin: 0;
	list-style-type:none;
	}
a,img {
	outline: none;/* for Firefox */
    hlbr:expression(this.onFocus=this.blur()); /* for IE */	
	}
img, div {border:0px;}
a:link {
	color: #ff8400;
	text-decoration:none;
}
a:visited {
	text-decoration:none;
	color: #ff5500;
}
a:hover {
	text-decoration: none;
	color: #ff5500;
}
a:active {
	text-decoration: none;
	color: #ff5500;
}
html {font-size:75%;}
body{
	font-size:1rem;
	word-wrap:break-word;
	font-family: Arial,"微軟正黑體", Helvetica, sans-serif;
	}
/*box*/
#lightbox2{
	position: fixed;
	width:100%;
	height:100%;
	/*padding:5px;*/
	top:0;
	z-index:6;
	background-image: url(../images/mbg.png);
	overflow:auto;
	box-sizing:border-box;
	-moz-box-sizing:border-box; /* Firefox */
	-webkit-box-sizing:border-box; /* Safari */
	display:none;/**/
}
.gb{
	position:relative;
	width:100%;
    max-width:600px;
	margin:0 auto;
	display:none;
	}
.gb img{width:100%;
}

#lightbox{
	position: fixed;
	width:100%;
	height:100%;
	/*padding:5px;*/
	top:0;
	z-index:6;
	background-image: url(../images/mbg.png);
	overflow:auto;
	box-sizing:border-box;
	-moz-box-sizing:border-box; /* Firefox */
	-webkit-box-sizing:border-box; /* Safari */
	display:none;/**/
}
.cobox,.cobox2{
	position: relative;
	width:550px;
	font-size:1.3rem;
	line-height:22px;
	color:#40392e;
	margin: 0 auto;
	border-radius:10px;
	border: 8px solid #ff0092;
	padding:20px 15px 10px 15px;
	background-color:#fff;
	overflow:hidden;
	display:none;/**/
	}
.txt1{
	font-size: 1.6rem;
	line-height: 35px;
	color: #2d271f;
	margin-bottom:5px;
	font-weight: 600;
	}
.txt2{
	font-size: 1.4rem;
	line-height:28px;
	color:#2d271f;
	margin-bottom:5px;
	text-align:center;
	padding:0 18px 0 0px;
	}
.txt2a{
	font-size: 1.8rem;
	line-height:30px;
	font-weight:600;
	color:#ff0092;
	text-align:center;
	padding:0 18px 10px 0px;
	}
.txt3{	
	position:relative;
	width:100%;
	display:block;
	font-size: 1.6rem;
	line-height:30px;
	color: #fff;
	margin-bottom:5px;
	font-weight: 600;
	text-align:left;
	padding:10px 15px 10px 15px;
	background-color:#ff0092;
	left:-15px;
	}
.txt4{color:#F03; margin:10px 0 10px 0;}
.txt5{font-size:1.25rem;margin:10px 0 10px 0;text-align:center;}
.txtbox{
	width:80%;
	font-size: 1.6rem;
	line-height:30px;
	border: 1px solid #d0cdce;
	padding:5px;
	text-align:center;
	margin:0 auto;
	margin-top:5px;
	margin-bottom:5px;
	}
.but2{
	/*width:100%;*/
	display:inline-block;
	text-align:center;
	margin:0 auto;
	margin-top:10px;
	}
#step2,#step3{ display:none;}

.cobox > ul{ padding-left:20px;}
.cobox > ul li {list-style-type:decimal;}
.clo{
	position:absolute;
	padding:3px;
	width:32px;
	display:block;
	top:-3px;
	right:-3px;
	}
.clo img{width:100%;display:block;}
/**/
.tt6{ text-align:center;} 
.fillbox{	
	font-family:Arial,"微軟正黑體",Helvetica,sans-serif;
	font-size:1.6rem;
	line-height:37px;
	color:#251f1f;
	text-align:center;
	padding:8px 5px 6px 5px;	
	border:0;
	/*border-radius:5px;*/
	border: 1px solid #d0cdce;
	transition:all .5s;
	-moz-transition:all .5s;
	-webkit-transition:all .5s;
	-o-transition:all .5s;
	display:inline-block;
	}
.fillbox:focus {background-color:#ffe2e2;}
.fi1a{width:65%;height:37px;margin:2.5px 0 5px 0; text-align:left;}
.fi1b{width:23%;height:53px;margin:2.5px 0 5px 0; text-align:left;}
.fi1c{width:88.5%;height:37px;margin:2.5px 0 5px 0; text-align:center;}
.switch{display:flex;align-items:center;width: auto;float:left;}
.switch span{display:inline-block;font-size:1.3rem;margin:5px 0 0 0;line-height:38px;text-align:left;}
.areabox{ width:88.5%; margin:0 auto;margin-bottom:20px;}
.areabox .radio-beauty {
            width: 25px;
            height: 25px;
            box-sizing:border-box;
            display: inline-block;
            border: 1px solid #a8a8a8;
			background-color:#FFF;
            margin: 0 13px 0 0;
            border-radius:50%;/*50*/
            transition: 0.2s;
        }
.areabox input[type="radio"]:checked+.radio-beauty {
            border: solid 1px #e84995;
            padding: 3px;
            background-color:#e84995;
            background-clip:content-box;
        }
.checkbox-beauty {
            width:30px;
            height: 30px;
            box-sizing:border-box;
            display: inline-block;
            border: 1px solid #a8a8a8;
			background-color:#FFF;
            margin: 0 13px 0 0;
            border-radius: 10%;/*50*/
            transition: 0.2s;
        	}
input[type="checkbox"]:checked+.checkbox-beauty {
            border: solid 2px #e84995;
            padding: 3px;
            /*background-color:#fdcd00;*/
            background-repeat:no-repeat;
            background-position:50% 50%;
			background-image: url(../images/ok.png);
			background-size:100% auto;
            background-clip:content-box;
        	}	
@media only screen and (max-width:1000px){
/**/

}
@media only screen and (max-width:750px){
/**/

}
@media only screen and (max-width:560px){
/**/
.cobox{width:auto;}
}
@media only screen and (max-width:450px){
/**/
.but2 img{width:auto;height:60px;display:inline-block;}
.txtbox{width:98%;}
.switch span{margin:5px 0 0 0;line-height:20px;text-align:left;padding:9px 0 9px 0;}
.areabox{width:auto;}
.fi1a{width:93%;height:37px;margin:2.5px 0 5px 0; text-align:center;}
.fi1b{width:96%;height:53px;margin:2.5px 0 5px 0; text-align:center;}
.fi1c{width:93%;height:37px;margin:2.5px 0 5px 0; text-align:center;}
}
@media only screen and (max-width:350px){

}