@CHARSET "UTF-8";

/* CSS Document */

html{
	width:100%;
	height: 100%;
	filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#33000000,EndColorStr=#33000000);/*IE8以下用*/
}
body{
	position: relative;
	width:100%;
	height: 100%;
    background:#f8f8f8 url(../img/bg_main.png)no-repeat center bottom 50px;
    background-attachment: fixed;
	}
.img.sp-image{
	background-size: contain;
}
.header {
	height: 52px;
    background: #fff;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;}

.header-inner {
	overflow: hidden;
	width: 960px;
	margin: 0 auto;
}

.logo {
  float: left;
  height: 52px;
  line-height: 52px;
}

.logo-img {
  width: 200px;
  height: 25px;
}

.banner {
  float: right;
}

.list-item {
	display: inline-block;
}

.contents {
	overflow: hidden;
	margin: 8% auto 0;
	clear: both;
}

.form {
  width: 610px;
  margin:0 auto;
}

.character {
  float: left;
  width: 490px;
  margin-right: 10px;
}

.character img {
  width: 100%;
}
h1{text-align: center;}
#contents{
	height: 100%;
	min-height: 100%;
	background:#fff;
}

.error_message {
    font-size: 10.5pt;
    color: red;
}
input[type=radio],input[type=checkbox] {
    display: none;
    -webkit-appearance: none;
}
.form label{
    transition: 0.3s ease-out;
    -webkit-transition: 0.3s ease-out;
    -moz-transition: 0.3s ease-out;
}
#footer{
	position: fixed;
	bottom: 0;
	width: 100%;
	padding: 15px 0;
	background: #1d1d1d;
	text-align: center;
	z-index: 100;
}
#footer .innerfooter{
	width: 1000px;
	margin: 0 auto;
}
#footer small{
	color:#ffffff;
}
#footer .footLink {
    margin-top: 0;
    font-size: 12px;
    position: absolute;
    bottom: 0;
    right: 5px;
}
ul.ui-autocomplete{
	font-size: 13px;
	overflow: auto;
	height: 350px;
}

@CHARSET "UTF-8";


#lean_overlay{
  position: fixed; z-index:100;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 100%;
  background: #000;
  display: none;
}

#dialog_form {
  width: 610px;
  display: inherit;
  padding: 0 40px 0px 40px;
  box-sizing: border-box;
  background: #fff;
  border-radius:6px;
  text-align: center;
	box-shadow:0px 0px 8px 0px rgba(0,0,0,0.13);
	-moz-box-shadow:0px 0px 8px 0px rgba(0,0,0,0.13);
	-webkit-box-shadow:0px 0px 8px 0px rgba(0,0,0,0.13);
 }

.modal_close{
  position: absolute;
  top: 12px;
  right: 12px;
  display: block;
  width: 14px;
  height: 14px;
  background: url(../img/modal_close.jpg);
  z-index: 2;
}


#dialog_content {
/*  height: 348px;*/
	border-radius: 0 0 3px 3px;
}


div.partial_form {
	/*height: 265px;*/
	height: 275px;
	text-align: left;
}


div.bx-controls-direction {
	vertical-align: middle;
	text-align: center;
}

img { vertical-align: middle;}
form {margin: 20px auto;font-size: 16px;}
.formHeader {
    background-color: #eee;
    margin: 0 -40px 10px;
    padding: 10px 0;
    border-radius:6px 6px 0 0;
    filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#99000000,EndColorStr=#99000000);
}
.formFooter{ border-radius: 3px 3px 0 0; padding:10px;}
.formBody { padding: 5px 10px 0 5px; box-sizing: border-box;}/*FAVOR-1444 微調整*/
.formFooter,
/*.bx-controls { border-radius: 0 0 3px 3px; padding:20px 50px 7px; }*/
.bx-controls.bx-has-pager.bx-has-controls-direction{
	background:#f8f8f8;
	position: relative;
	margin: 0 -40px;
	padding: 15px 0 15px ;
}
.rowTable { display: table; width: 100%;}
.rowTable .col { float: none; width: auto; vertical-align: middle;}
h3.formTitle{
    margin:  0 0 1em;
    text-align: center;
    color: #2bb2ff;
    font-weight: normal;
    font-size: 18px;
}
#Step1 h3.formTitle{
    margin: 1.5em 0 0 0;
    text-align: center;
    color: #2bb2ff;
    font-weight: normal;
    font-size: 18px;
}
#Step4 h3.formTitle{
    margin: .5em 0 1em;
}
.formTitle small { font-size:13px; color: #333333;}
.row { clear: both;display: block;overflow: auto;}
#Step3 .row{margin-top:10px;display: flex}
.col { width: 50%;float: left;}
.col02 { margin-top: -25px;margin-bottom: 15px;position: relative;clear: both;}
.row3col{text-align: center;}
.row3col .col { width: 150px;display:inline-block;}
#Step3 .row3col .col { width: inherit;}
.s3Col .col01{width: 160px;}

.inlineList li { display: inline-block; margin-right: 1em;}

.errorBox02 { background: #fcebeb; border-radius: 3px; position: relative ;top: -73px;left: 55px; display: inline-block; padding: 1px 1em; font-size: 13px; visibility: hidden;}
.errorBox02:before { content: ''; display: block; position:absolute; bottom:-10px; left:3px; width:0; height: 0; border-style: solid; border-width: 5px; border-color: #fcebeb transparent transparent transparent;}
.errorBox { background: #fcebeb; border-radius: 3px; position: relative;top: -73px;left: 55px; display: inline-block; padding: 1px 1em; font-size: 13px;visibility: hidden;}
.col02 .errorBox03 { background: #fcebeb; border-radius: 3px; position: relative; display: inline-block; padding: 1px 1em; font-size: 13px; visibility: hidden;position: absolute;top: -5px;left: 57px;}
.errorBox:before { content: ''; display: block; position:absolute; bottom:-10px; left:3px; width:0; height: 0; border-style: solid; border-width: 5px; border-color: #fcebeb transparent transparent transparent;}
.errorBox03:before { content: ''; display: block; position:absolute; bottom:-10px; left:3px; width:0; height: 0; border-style: solid; border-width: 5px; border-color: #fcebeb transparent transparent transparent;}
.err_pos02{margin-left: 0;}
.err_pos03{}
#addr1or2_error_msgs{left: 250px;}


.formItem {
    display: block;
    clear: both;
    min-height: 3em;
}
.formItem.box_pos { margin: 0 0 0;clear: both;}
.formItem.addr { margin: 0 0 5px;}
.itemTitle {
    float: left;
    display: inline-block;
    font-size: 10px;
    vertical-align: bottom;
    height: 3em;
    padding-top: 1em;
}

input[type="text"],
select { width: 100%;height: 44px;font-size: 17px; border: 1px solid #2bb2ff; box-sizing: border-box; padding: 9px; border-radius: 3px;}
input[type="text"].err,
select.err { border-color: #e60000;}
label{color:#fff;}

.error { border-color: #e60000;}

.bx-next,
.bx-prev { text-decoration: none;}
.bx-prev { 
	opacity: 0.7; 
	visibility: hidden;
	position: absolute;
	bottom: 5px;
	left: 10px;
}
.bx-prev img{width: 60px;}
.bx-prev:hover { opacity: 1;}

.bx-nextArea{display:inline-block;}

.col295 { 
	width: 295px !important;
    display: inline-block;
	float: right;
}
.col255 {
    width: 430px !important;
    display: inline-block;
	float: right;
    margin-left: 10px;
}
.col215 { width: 355px !important;}
.col150 { width: 150px !important;}
.col130 { width: 130px !important;}
.col44 { width: 44% !important;}
.row .offset42 > .col { margin-top: 10px;}
.row .offset42 > .col + .col { margin-top: 10px;margin-left: 10px;}
.offset50 > .col + .col { margin-left: 50px;}
.offset42 > .col + .col { margin-left: 10px;}
.offset42 > .col + .col +.col {margin-left: 0;margin-top: 10px;}
.offset42 > .col + .col +.col +.col{margin-left: 10px;}
div#zip_area {margin-top: 15px;}
.offset42 > .col + .col.btn_area{margin: 1.5em 0 0 10px;}
.col .add_btn,
.col .add_btn01{
	display: inline-block;
	margin: 0 7px 0 0;
	vertical-align: bottom;
}
#zip_area #zip2{
  display:block;
  line-height: 1.2;
  font-size: 14px;
	margin:15px 0 0;
}

#zip_area #zip2 small{
	font-weight: bold;
	font-size:12px;
	color:#555;
}

p.addTxt{margin-top: 1em;padding:.3em;text-align: left;color: #555;font-size: 10px;display:inline-block;margin-left:10px;}
.acoArea{margin-top: 5px;}

#license_container { padding: 50px 5px 0;}
.radio{
	position: relative;
	display: inline-block;
	width: 100%;
	padding: 10px 0;
	text-align: center;
	background:#eee;
	border-radius:8px;
	vertical-align: middle;
	cursor: pointer;
	color: #333333;
	z-index: 0;
}
#step1 #license_container{
	margin-top: 50px;
}
.checkbox {
	position: relative;
	display: inline-block;
	width: 100%;
	padding:16px 0;
	text-align: center;
	background:#eee;
	border-radius:8px;
	vertical-align: middle;
	cursor: pointer;
	color: #333333;
	z-index: 0;
	line-height: 17px;
}
.radio.row01{
    line-height: 16px;
    padding: 17px 0 16px;
}
.radio.row02{
    line-height: 16px;
    padding: 9px 0 8px;
}
.radio.row02 span{
    font-size: 80%;
}
.checked input[type=checkbox] + .checkbox{
	background: #ff7c7c;
	border-radius:8px;
	color: #ffffff;
	cursor: pointer;
}
.checked input[type=radio] + .radio,
.checked input[checked=checked] + .radio{
	background: #ff7c7c;
	border-radius:8px;
	color: #ffffff;
	cursor: pointer;
}
.checkboxCol {
    position: absolute;
    top: 17px;
    left: 10px;
    margin: auto;
    z-index: 10;
}
.radioCol {
    position: absolute;
    top: 0;
    bottom: 3px;
    left: 10px;
    margin: auto;
    z-index: 10;
}
#Step1 .col,#Step2 .col {
	position: relative;
	margin-right: 10px;
	margin-bottom: 10px;
	float: none;
}
#Step1 .col:nth-child(3n),
#Step2 .col:nth-child(3n){
	margin-right: 0 !important;
}


.footLink { margin: 7px 0 0;
  font-size: 12px;
}
.footLink a { display: inline-block;
	background:url(../img/arrow.gif) no-repeat scroll left center;
	margin: 0 10px;
	padding:0 0 0 10px;
  color: #fefefe;
  text-decoration: none;
}
.footLink a:hover { text-decoration: underline;}

/**/
.tableLabel {
    display: table;
    vertical-align: bottom;
}
span.required,span.required2{
    display: inline-block;
    margin-right: 10px;
    padding: 4px 10px;
    -webkit-box-sizing: content-box;
    -ms-box-sizing: content-box;
    box-sizing: border-box;
    line-height: 1;
    vertical-align: middle;
    border: 1px solid #ff6699;
    color: #ff6699;
    font-size: 14px;
}
span.required2{
    border: 1px solid #66a9ff;
    color: #66a9ff;

}

span.any + span.infoTxt {
	color: #000000;
	vertical-align: bottom;
	font-size: 13px;
}


[data-bubble] {
    display: block;
    font-size: 1.0rem;
    height: 0;
    position: relative;
    z-index: 2;
}
[data-bubble*="right"] {
}
[data-bubble] > span {
    display: inline-block;
    text-align: center;
    color:#fff;
    background:#FF6600;
    padding:0.3em 0.8em;
    position: absolute;
    right:8%;
    bottom:-6px;
    -webkit-transform: rotate(10deg);
    transform: rotate(10deg);
    border: solid 1px #fff;
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation: bubbleShow 0.5s ease-out 0s 1, bubbleAnime 3s linear 1.5s infinite alternate;
    animation: bubbleShow 0.5s ease-out 0s 1, bubbleAnime 3s linear 1.5s infinite alternate;
}
[data-bubble] > span:before, [data-bubble] > span:after {
    border-style: solid;
    border-width: 10px;
    content: "";
    display: block;
    height: 0;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    width: 0;
}
[data-bubble] > span:before {
    border-color: #FF6600 transparent transparent;
    top: 96%;
    z-index: 2;
}
[data-bubble] > span:after {
    border-color: #fff transparent transparent;
    top: 100%;
    z-index: 1;
}
input#mail:focus + .mailCheckBtn > [data-bubble] {
    display: none;
}


.bx-controls-direction {
    margin: 0 auto;
    overflow: hidden;
    position: relative;
    text-align: center;
}

.nextBtn{
    position: relative;
    display: table-cell;
    margin: 0 0 0 20px;
    color: #fff;
    font-size: 24px;
    font-weight: bold;
    text-decoration: none;
    vertical-align: middle;
    width: 100%;
    text-align: center;
    width: 314px;
    height: 55px;
    background-color: #4ec443;
    border: 1px solid #33b929;
    border-radius: 4px;
    box-sizing: border-box;
    transition: 0.3s ease-out;
    -webkit-transition: 0.3s ease-out;
    -moz-transition: 0.3s ease-out;
}
.index1 .bx-next{
	margin-left: 0px;
}
.nextBtn:hover{
	background: #3ea734;
	border: 1px solid #3ea734;
}
.lastBtn{
    position: relative;
    z-index: 1;
    width: 314px;
    height: 60px;
    margin: 0 auto;
    box-sizing: border-box;
    border-radius: 8px;
    border: 1px solid #eb8003;
    background: #f0b706;
    background: -webkit-gradient(linear, left top, left bottom, from(#ffaa06), color-stop(0.5, #ffaa06), color-stop(0.5, #f79e04), to(#f79e04));
    background: -moz-linear-gradient(to top, #f79e04 0%,#f79e04 50%,#ffaa06 50%,#ffaa06);
    background: linear-gradient(to top, #f79e04 0%,#f79e04 50%,#ffaa06 50%,#ffaa06);
    vertical-align: middle;
    text-align: center;
    text-decoration: none;
    line-height: 1.3;
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    display: table-cell;
    transition: 0.3s ease-out;
    -webkit-transition: 0.3s ease-out;
    -moz-transition: 0.3s ease-out;
}
.lastBtn:hover{
	background: #f79e04;
	border: 1px solid #f79e04;
}
.lastBtn small{
	font-size: 13px;
}
/* modal
 ----------------------------------------------------- */
 .modal{display:none;text-align:left;}.modalBody{position: fixed; z-index: 999999; background: #fff; width:80%; height:80%;top:0;right:0;bottom: 0;left:0;margin: auto;}
.modalBK{position: fixed; top: 0;left: 0;z-index:999; height:100%; width:100%;background:#000; opacity: 0.5;filter: alpha(opacity=50);-moz-opacity:0.50;}
.modalBody{padding:13px;line-height:1.6;border-radius:4px;}.btns{cursor: pointer; text-decoration:underline;}
.window_close, .close{cursor: pointer; text-align:center; margin:10px 0;text-decoration:underline; color:#fff; background-color:#999;border-radius:4px;line-height:32px; font-size:1.2rem;}
.scroll_box{overflow-y: auto;height:90%; padding:2px;}.scroll_box::-webkit-scrollbar{width: 5px;background: #d7d7d7;}.scroll_box::-webkit-scrollbar-thumb{background: #bbb;border-radius: 2px;}
  
.toslink{display: none}
.step5 .toslink{display: block; margin:0 auto;z-index:1000;width:605px;margin:0 auto;text-align: right;}
.step5 .toslink a{color:#2bb2ff}
.step5 .toslink a:visited{color:#2bb2ff}
