/* Spotlight */


.accessbase{
  position:relative;
  margin: 0 auto;
  margin-top:-19px;
  width:100%; max-width:100%;
  background: url(../wall/island.jpg) no-repeat center center;
  background-size:cover;
  padding:20px 30px 30px 50px;
}


.inquirybase {
  position:relative;
  margin: 0 auto;
  margin-top:-19px;
  width:100%; max-width:100%;
  background: url(../wall/illust.png) no-repeat center bottom;
  background-size:40%;
  padding:20px 30px 30px 50px;
}


.formarea{
  padding:20px 4px 20px 4px;
  background:#f5f5f5;
  border-top:1px dotted #ccc;
  border-bottom:2px dotted #ccc;
}


.baseinner{
	margin:0 auto;
	width:70%;
}
@media only screen and (max-width: 768px){
.baseinner{
	width:98%;
}}


@media only screen and (max-width: 768px){
.accessbase{
  	padding:10px 20px 10px 20px;
	background: url(../wall/islands.jpg) no-repeat center center;
	background-size:auto;
	-moz-object-fit: cover;
	-webkit-object-fit: cover;
	-ms-object-fit: cover;
	object-fit: cover;
	display: block;
	border-radius: 0;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	aspect-ratio: 16 / 9;

}}




.gmainbanner{
  position:relative;
  width:50%;
  background-color: #c39143;
  background: linear-gradient(45deg, #757575 0%, #9E9E9E 45%, #E8E8E8 70%, #9E9E9E 85%, #757575 90% 100%);
  background: linear-gradient(45deg, #B67B03 0%, #DAAF08 45%, #FEE9A0 70%, #DAAF08 85%, #B67B03 90% 100%);
  padding: 0 0 0 0;
  margin: 0 auto;
  color:#fff;
  text-align:center;
}


.gmainbanner img{
	display:block;
	width:100%;
	max-width:100%;
	height:auto;
}

@media only screen and (max-width: 768px){
.gmainbanner{
  width:100%;
  font-size:.8em;
}}






.spotlight.style1 {
		background:#f8f8f8;
		width:100%;
		max-width:100%;

		-moz-align-items: stretch;
		-webkit-align-items: stretch;
		-ms-align-items: stretch;
		align-items: stretch;

		display: -moz-flex;
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-moz-flex-direction: row;
		-webkit-flex-direction: row;
		-ms-flex-direction: row;
		flex-direction: row;
		-moz-justify-content: -moz-flex-end;
		-webkit-justify-content: -webkit-flex-end;
		-ms-justify-content: -ms-flex-end;
		justify-content: flex-end;
		position: relative;
		overflow: hidden;
		text-align: left;
	}

.spotlight.style1 .content {
			-moz-align-self: start;
			-webkit-align-self: start;
			-ms-align-self: start;
			align-self: start;
			-moz-flex-grow: 1;
			-webkit-flex-grow: 1;
			-ms-flex-grow: 1;
			flex-grow: 1;
			-moz-flex-shrink: 1;
			-webkit-flex-shrink: 1;
			-ms-flex-shrink: 1;
			flex-shrink: 1;
			width: 60%;
			margin: 0 auto;
			padding: 0 30px;

		}

.spotlight.style1 .content p{

			text-align:left;
			font-size:.9em;
			lin-height:1.3;
}

.spotlight.style1 .image {
			-moz-flex-grow: 0;
			-webkit-flex-grow: 0;
			-ms-flex-grow: 0;
			flex-grow: 0;
			-moz-flex-shrink: 0;
			-webkit-flex-shrink: 0;
			-ms-flex-shrink: 0;
			flex-shrink: 0;
			width: 40%;
			border-radius: 0;
		}

.spotlight.style1 .image img {
				-moz-object-fit: cover;
				-webkit-object-fit: cover;
				-ms-object-fit: cover;
				object-fit: cover;
				-moz-object-position: center;
				-webkit-object-position: center;
				-ms-object-position: center;
				object-position: center;
				display: block;

				position: relative;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				border-radius: 0;
		}


a:hover img {
  opacity: 0.8;
  filter: alpha(opacity=80);
  -moz-opacity: 0.8;
  -webkit-transition: 0.7s ease-in-out;
  -moz-transition: 0.7s ease-in-out;
  -o-transition: 0.7s ease-in-out;
  transition: 0.7s ease-in-out;
}

@media screen and (max-width: 768px) {
	.spotlight.style1 .content {
				padding: 0 20px;
				width: 50%;
				min-width: 0;
				text-align:left;
			}

			.spotlight.style1 .image {
				width: 50%;
				min-width: 0;
			}

		}



@media screen and (max-width: 736px) and (orientation: portrait) {

	.spotlight.style1 {
			-moz-flex-direction: column-reverse;
			-webkit-flex-direction: column-reverse;
			-ms-flex-direction: column-reverse;
			flex-direction: column-reverse;
			text-align: center !important;
		}

			.spotlight.style1 .content {
				width: 100%;
			}

			.spotlight.style1 .image {
				width: 100%;
			}

				.spotlight.style1 .image img {
					position: relative;
				}

	}

	.spotlight.style1.orient-right {
			-moz-flex-direction: row-reverse;
			-webkit-flex-direction: row-reverse;
			-ms-flex-direction: row-reverse;
			flex-direction: row-reverse;
		}




@media screen and (max-width: 736px) and (orientation: portrait) {

		.spotlight.style1.orient-right {
			-moz-flex-direction: column-reverse;
			-webkit-flex-direction: column-reverse;
			-ms-flex-direction: column-reverse;
			flex-direction: column-reverse;
		}

	}






.spotlight.style1.content-align-center {
			text-align: center;
		}

		.spotlight.style1.content-align-right {
			text-align: right;
		}

		.spotlight.style1.image-position-left .image img {
			-moz-object-position: left;
			-webkit-object-position: left;
			-ms-object-position: left;
			object-position: left;
		}

		.spotlight.style1.image-position-right .image img {
			-moz-object-position: right;
			-webkit-object-position: right;
			-ms-object-position: right;
			object-position: right;
		}

















.spotlight.style2 {
		background:#f8f8f8;
		width:100%;
		max-width:100%;
		-moz-align-items: stretch;
		-webkit-align-items: stretch;
		-ms-align-items: stretch;
		align-items: stretch;
		display: -moz-flex;
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-moz-flex-direction: row;
		-webkit-flex-direction: row;
		-ms-flex-direction: row;
		flex-direction: row;
		-moz-justify-content: -moz-flex-end;
		-webkit-justify-content: -webkit-flex-end;
		-ms-justify-content: -ms-flex-end;
		justify-content: flex-end;
		position: relative;
		overflow: hidden;
		text-align: left;
	}

.spotlight.style2 .content {
			-moz-align-self: center;
			-webkit-align-self: center;
			-ms-align-self: center;
			align-self: center;
			-moz-flex-grow: 1;
			-webkit-flex-grow: 1;
			-ms-flex-grow: 1;
			flex-grow: 1;
			-moz-flex-shrink: 1;
			-webkit-flex-shrink: 1;
			-ms-flex-shrink: 1;
			flex-shrink: 1;
			width: 55%;
			margin: 0 auto;
			padding: 30px 30px 0 30px;

		}

.spotlight.style2 .content p{

			text-align:left;
			font-size:.9em;
			lin-height:1.3;
}

.spotlight.style2 .image {
			-moz-flex-grow: 0;
			-webkit-flex-grow: 0;
			-ms-flex-grow: 0;
			flex-grow: 0;
			-moz-flex-shrink: 0;
			-webkit-flex-shrink: 0;
			-ms-flex-shrink: 0;
			flex-shrink: 0;
			width: 45%;
			border-radius: 0;
		}

.spotlight.style2 .image img {
				-moz-object-fit: cover;
				-webkit-object-fit: cover;
				-ms-object-fit: cover;
				object-fit: cover;
				-moz-object-position: center;
				-webkit-object-position: center;
				-ms-object-position: center;
				object-position: center;
				display: block;

				position: relative;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				border-radius: 0;
		}


a:hover img {
  opacity: 0.8;
  filter: alpha(opacity=80);
  -moz-opacity: 0.8;
  -webkit-transition: 0.7s ease-in-out;
  -moz-transition: 0.7s ease-in-out;
  -o-transition: 0.7s ease-in-out;
  transition: 0.7s ease-in-out;
}

@media screen and (max-width: 768px) {
	.spotlight.style2 .content {
				padding: 30px 20px 0 20px;
				width: 50%;
				min-width: 0;
				text-align:left;
			}

			.spotlight.style2 .image {
				width: 50%;
				min-width: 0;
			}

		}



@media screen and (max-width: 736px) and (orientation: portrait) {

	.spotlight.style2 {
			-moz-flex-direction: column-reverse;
			-webkit-flex-direction: column-reverse;
			-ms-flex-direction: column-reverse;
			flex-direction: column-reverse;
			text-align: center !important;
		}

			.spotlight.style2 .content {
				width: 100%;
			}

			.spotlight.style2 .image {
				width: 100%;
			}

				.spotlight.style2 .image img {
					position: relative;
				}

	}

	.spotlight.style2.orient-right {
			-moz-flex-direction: row-reverse;
			-webkit-flex-direction: row-reverse;
			-ms-flex-direction: row-reverse;
			flex-direction: row-reverse;
		}




@media screen and (max-width: 736px) and (orientation: portrait) {

		.spotlight.style2.orient-right {
			-moz-flex-direction: column-reverse;
			-webkit-flex-direction: column-reverse;
			-ms-flex-direction: column-reverse;
			flex-direction: column-reverse;
		}

	}






.spotlight.style2.content-align-center {
			text-align: center;
		}

		.spotlight.style2.content-align-right {
			text-align: right;
		}

		.spotlight.style2.image-position-left .image img {
			-moz-object-position: left;
			-webkit-object-position: left;
			-ms-object-position: left;
			object-position: left;
		}

		.spotlight.style2.image-position-right .image img {
			-moz-object-position: right;
			-webkit-object-position: right;
			-ms-object-position: right;
			object-position: right;
		}