@charset "UTF-8";

.boxMessage2{color:#ff0000; font-style:italic; margin:0 0 100px; text-align:center;}

.gform{margin:0 0 100px; line-height:1.4;}
.gform > p {margin: 0 0 20px;}
.gform > p > span {color: red;}
.gform_fields li:nth-of-type(2), .gform_fields li:nth-of-type(4), .gform_fields li:nth-of-type(6) {width:48%; float:left;}
.gform_fields li:nth-of-type(3), .gform_fields li:nth-of-type(5), .gform_fields li:nth-of-type(7) {width:48%; float:right;}
.gform_fields li:nth-of-type(8) {clear:both;}
  
.gfield{position: relative; margin:0 0 60px 0;}
.gfield:nth-of-type(1){margin:0 0 30px;}
.gfield input[type=text],
.gfield textarea{width: 100%; outline: 0; border: none; border-bottom: 1px solid #000;line-height:1.4; color: #000; border-radius: 0; -webkit-appearance: none; font-family: Helvetica Neue, Helvetica, Roboto, Arial, sans-serif; font-size: 14px;}
.gfield textarea {padding: 0; box-sizing: border-box; overflow-x: hidden; padding:5px 0 0 0;}
.gfield.active .gfield_label{transform: translateY(-85%);}
.gfield.active input,
.gfield.active textarea{border-bottom-color:#af4983;}
.gfield_label {position: absolute; top: -20px; left: 0; color: #000; transition: transform ease 0.15s; transform: translateY(-20%);}
.gfield_label1{display:block; margin:0 0 7px;}
.gfield_label span, .gfield_label1 span, .gfield_label2 span{color:#ff0000; padding:0 0 0 5px;}
.gfield .error{font-size:14px; color:#ff0000;}

/* checkbox */
.gcheck_container input{visibility: hidden;}
.gcheck_container label:hover input[type="radio"] ~ i.fa {color: #af4983;}
.gcheck_container label input[type="checkbox"] ~ i.fa.fa-square-o{color: #000; display: inline; font-size:24px;}
.gcheck_container label input[type="checkbox"] ~ i.fa.fa-check-square-o{display: none;}
.gcheck_container label input[type="checkbox"]:checked ~ i.fa.fa-square-o{display: none;}
.gcheck_container label input[type="checkbox"]:checked ~ i.fa.fa-check-square-o{color: #af4983; display: inline; font-size:22px;}
.gcheck_container label:hover input[type="checkbox"] ~ i.fa {color: #af4983;}
.gcheck_container label.active{color: #af4983;}
.gcheck_container label {position:relative; width:350px; float:left;}
.gcheck_container label:hover{color: #af4983;}
.gcheck_container label:active, .gcheck_container label.active {-webkit-box-shadow: none; box-shadow: none;}
.gcheck_container label span{position:absolute; top:0; left:45px;}

/* select */
.gselect_container li{width:100% !important; float:none !important;}

.timeSelect .cs-select{width:16%; float:left; margin: 0 4% 0 0;}

.timeSelect .cs-select:nth-of-type(1) .cs-options li{width:50% !important; float:left !important; clear:none !important;}
.timeSelect .cs-select:nth-of-type(1) .cs-options li:last-of-type{width:100% !important;}
.timeSelect .cs-select:nth-of-type(3) .cs-options li{width:50% !important; float:left !important; clear:none !important;}
.timeSelect .cs-select:nth-of-type(3) .cs-options li:last-of-type{width:100% !important;}
.timeSelect .cs-select:nth-of-type(4) .cs-options li{width:50% !important; float:left !important; clear:none !important;}
.timeSelect .cs-select:nth-of-type(4) .cs-options li:last-of-type{width:100% !important;}

div.cs-select{display: inline-block; vertical-align: middle; position: relative; text-align: left; z-index: 100; width: 100%; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
div.cs-select:focus {outline: none;}
.cs-select select {display: none;}
.cs-select span {padding:0 0 5px; display: block; position: relative; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-bottom: 1px solid #000;}
.cs-select > span::after,
.cs-select .cs-selected span::after {speak: none; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
.cs-select.cs-active > span::after {-webkit-transform: translateY(-50%) rotate(180deg);	transform: translateY(-50%) rotate(180deg);}
div.cs-active {z-index: 200;}
.cs-select .cs-options {position: absolute;	overflow: hidden; width: 100%; visibility: hidden;}
.cs-select.cs-active .cs-options {visibility: visible;}

.cs-select ul {list-style: none; margin: 0;	padding: 0;	width: 100%;}
.cs-select ul span {padding:10px 20px; border-bottom: 1px solid #fff;}
.cs-select ul li.cs-focus span {background-color: #ddd;}
.cs-select li.cs-optgroup ul {padding-left: 1em;}
.cs-select li.cs-optgroup > span {cursor: default;}
.cs-skin-underline > span::after{font-family: 'FontAwesome'; content: '\f00d'; right: 0.25em; -webkit-transform: translate3d(0,-50%,0) rotate3d(0,0,1,45deg); transform: translate3d(0,-50%,0) rotate3d(0,0,1,45deg); -webkit-transition: -webkit-transform 0.5s; transition: transform 0.5s;}
.cs-skin-underline.cs-active > span::after {-webkit-transform: translate3d(0,-50%,0) rotate3d(0,0,1,270deg); transform: translate3d(0,-50%,0) rotate3d(0,0,1,270deg);}
.cs-skin-underline .cs-options {background: #af4983; color:#fff; opacity: 0; -webkit-transition: opacity 0.3s 0.4s, visibility 0s 0.7s;	transition: opacity 0.3s 0.4s, visibility 0s 0.7s;}
.cs-skin-underline.cs-active .cs-options {opacity: 1; -webkit-transition: opacity 0.3s; transition: opacity 0.3s;}
.cs-skin-underline ul span {position: relative;	opacity: 0; -webkit-transform: translate3d(100%,0,0); transform: translate3d(100%,0,0); -webkit-transition: opacity 0.3s, -webkit-transform 0.3s; transition: opacity 0.3s, transform 0.3s;}
.cs-skin-underline.cs-active ul span,
.cs-skin-underline.cs-active ul span::before {opacity: 1; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0);}

.cs-skin-underline .cs-options li span:hover,
.cs-skin-underline .cs-options li.cs-focus span,
.cs-skin-underline li.cs-selected span {color: #fff; background: transparent;}

/* Confirm */
.boxConfirm{padding:60px 0 0 0; font-size:18px; margin:0 0 100px;}
.boxConfirm table{width:100%;}
.boxConfirm th, .boxConfirm td{border-bottom:2px solid #000; padding:20px 0 5px;}
.boxConfirm th{width:220px;}

@media screen and (max-width: 768px){

	.timeSelect .cs-select{width:30.66%; float:left; margin: 0 4% 15px 0;}
	.timeSelect .cs-select:nth-of-type(3) {clear: both;}
	.timeSelect .cs-select:nth-of-type(5) {margin: 0;}
}

@media screen and (max-width: 736px){
	.boxMessage {margin: 0 0 30px;}
	.boxMessage2{margin: 0 0 20px;}

	.gform_fields li{width:100% !important; float:none !important;}
	.gfield{margin:0 0 40px;}

	
	
}

@media screen and (max-width: 480px){
	.boxMessage2{font-size:14px;}
	.gfield input[type="text"], .gfield textarea{font-size:18px;}
}