@charset "UTF-8";
.mobile-all-container.confirmed.registration{  background:#E7E7E7!important;  }

.mobile-all-container.registration { height:auto; min-height:auto; background-image:url("../img/bg_sky2.jpg"); border-bottom-left-radius:50px; border-bottom-right-radius:50px; background-position:bottom center;  }
.registration-top-session { position:relative; width:80%; margin:3em auto 0 auto;  }
.top-session-title { position:relative; width:60%; padding-bottom:16.1%; margin:auto; background-image:url("../img/register.svg"); background-repeat:no-repeat; background-position:center; background-size:contain }
.top-session-illustration { position:relative; width:35%; padding-bottom:33.9%; margin:1em auto 0 auto; background-image:url("../img/character/guide-people.svg"); background-repeat:no-repeat; background-position:center; background-size:contain }
.top-session-tour-name { position:relative; width:50%; padding-bottom:11.8%; margin:1em auto; background-image:url("../img/tour-guide.svg"); background-repeat:no-repeat; background-position:center; background-size:contain }
.top-session-user-content-container { position:relative; width:60%; margin:0 auto .5em auto }
.top-session-user-label { position:relative; float:left; letter-spacing:1px; text-align:left }
.top-session-user-name  { position:relative; float:right; letter-spacing:1px; text-align:right}

/*form*/
.registration-form-session-container { position:relative; width:100%; height:auto; padding:2em 0 0em 0; margin-top:0px; background:#E7E7E7; }
.form-session-content-container { position:relative; width:100%; margin:auto;  }
.form-session-content-container-inner{ position:relative; width:90%; margin:auto; }

.form-session-ele-title { width:100%; text-align:center; letter-spacing:.2em; margin:0em auto 1em auto;   }
.form-session-dropdown-container { position:relative; width:100%; margin:1em auto;   }
.dropdown-first-inner-container { position:relative;  height:3em;  /*border:solid 2px #646464; border-radius:1em;*/   cursor:pointer;  border-top-left-radius:1em; border-top-right-radius:1em; width:calc(100% - 4px); border:solid 2px rgba(0,0,0,0); border-top:none; border-bottom:none }

.dropdown-first-inner-mask-container{ border-radius:1em; /*border:solid 2px #646464; height:calc(100% - 4px);*/ background: #fff;   }
.dropdown-first-inner-outline-container{ border-radius:1em; border:2px solid #646464; position:absolute; width:calc(100% - 0px); height:calc(100% - 4px); top:0;   background:#fff; left:-2px}




.dropdown-first-inner-container.active{ /*background:#00E6A0;*/  background:#fff; border-color:#646464 }
.dropdown-first-inner-container.active .dropdown-first-inner-mask-container{ background:#fff }

.dropdown-first-inner-content { position:absolute; width:90%; top:50%; left:50%; transform:translate(-50%,-50%);  }
.dropdown-first-ele-txt { position:relative; float:left; width:auto; letter-spacing:2px }
.dropdown-first-ele-arrow { position:relative; float:right; border:solid 1px #646464; border-width: 0 2px 2px 0; display:inline-block; padding:5px; transform:rotate(45deg); margin-top:2px}
.dropdown-two-column-container { position:relative; float:left; width:calc(50% - 1px); height:3em; border-bottom-left-radius:1em; border-top-left-radius:1em;  border-right:solid 2px #646464; background:#fff }
.dropdown-two-column-container.right { float:right; border-bottom-right-radius:1em; border-top-right-radius:1em; border-bottom-left-radius:0px; border-top-left-radius:0px; border-right:none; }

.dropdown-two-column-container.select, .dropdown-two-column-container.hover { background-color:#00E6A0;  } 

.dropdown-first-inner-ele-container { /*border:solid 2px #646464;*/ border-radius:1em; }
.dropdown-two-column-ele-txt { position:absolute; width:100%; top:50%; left:50%; transform:translate(-50%,-50%); letter-spacing:.1em; }

.dropdown-option-container { position:relative; width:calc( 100% - 4px ); height:auto; /*margin-top:-3.3em;*/ border:solid 2px #646464; border-radius:1em; background-color:#fff; display:none; border-top:none; border-top-left-radius:0; border-top-right-radius:0;    }
.option-inner-txt-container { position:relative; width:auto; height:3em; cursor:pointer;  }
.option-inner-txt-container:nth-child(1){ /*padding-top:1em; margin-top: -1em;*/ }
.option-inner-txt-container:last-child{ border-bottom-left-radius:0.9em; border-bottom-right-radius:0.9em }
.option-inner-txt-container.select, .option-inner-txt-container.hover { background:#00E6A0  }

.option-inner-txt-container.inactive{ pointer-events:none; background:#C8C8C8!important; color:rgba(100,100,100,0.5); }
.option-inner-txt-container.inactive .option-ele-txt span{ display:inline; }

.option-ele-txt { text-align:left; letter-spacing:2px }
.option-ele-txt span{ display:none; }
.option-ele-underline { position:absolute; bottom:-1px; left:50%; transform:translate(-50%,-50%); width:90%; height:2px; margin:auto; background-color:#646464;  }
.form-session-title { position:relative; margin:1.5em auto; width:100%; text-align:left; letter-spacing:.1em }

.form-session-contact-row { position:relative; width:100%; height:3em; margin:.8em auto; background:#ffffff; border:solid 2px #646464; border-radius:1em;   }



.contact-row-label { position:relative; float:left; width:calc( 40% - 2px ); height:3em; border-right:solid 2px #646464;}
.contact-row-label-txt { position:absolute; width:80%; top:50%; left:50%; transform:translate(-50%,-50%); letter-spacing:1px; text-align:left }
.contact-row-label-txt.tel { width:85%; }
.contact-row-information { position:relative; float:left; width:60%; height:3em; }
.contact-row-information input { color:#646464; font-size:1em; width:90%; padding:10px 0; }
.contact-form-tnc { position:relative; width:100%; text-align:left; margin:2em 0; letter-spacing:.5px }
.tnc-underline { text-decoration:underline; text-decoration-thickness:2px;  text-underline-offset:5px; }
.button-inner-container.form { background:#00E6A0 }
.button-inner-container.reset, .button-inner-container.reg-back { background:#646464 }


.form-session-contact-row.error, .error .contact-row-label, .error .contact-row-label-txt{ border-color:#ff0000; color:#ff0000  }
.form-session-dropdown-container.error .dropdown-first-inner-outline-container{ border-color:#ff0000; }
.form-session-dropdown-container.error .dropdown-first-ele-txt, .error .dropdown-two-column-ele-txt{  color:#ff0000; }
.form-session-dropdown-container.error .dropdown-first-ele-arrow{ border-color:#ff0000; }
.error .dropdown-two-column-container{ background-color:#fff; border-color:#ff0000 }
/*form*/

/*  with-options */

.with-options .dropdown-option-container{ display:block  }
.with-options .dropdown-first-inner-container{ background:#fff; border-color:#646464 }
.with-options .dropdown-first-inner-container .dropdown-first-inner-mask-container{ background:transparent }
.with-options .dropdown-first-inner-container .dropdown-first-inner-outline-container{ background:transparent; pointer-events:none }

.dropdown-first-inner-container.gogreen{ background:#00E6A0 }
.dropdown-first-inner-container.gogrey{ background:#C8C8C8 }
/*  with-options */

@media only screen and (min-width:0px) and (max-width:1279px) {	
}


@media only screen and (min-width:768px) {	
	.mobile-all-container.registration { border-bottom-left-radius:10px; border-bottom-right-radius:10px;   }
}
@media only screen and (min-width:0px) and (max-width:414px) {	


}


@media only screen and (min-width:0px) and (max-width:375px) {	

}


@media only screen and (min-width:0px) and (max-width:320px) {	
 .txt-tiny { font-size:.6em }
 .top-session-user-content-container { width:80%; }
}







