
/* ================================
Imports
================================= */
@import url('font-awesome.min.css');
@import url('simpletextrotator.css');
@import url('overwrite.css');
@import url('animate.css');
@import url('component.css');
/* ================================
General
================================= */

.lead{
	font-weight: 400;
}

/* ==========================
Parallax
============================= */

#parallax1{
	background-image: url(../img/parallax/1.jpg);
}
#parallax2{
	background-image: url(../img/parallax/2.jpg);
}


/* ================================
Banner
================================= */

#banner {
	position: relative;
	margin: 0 auto;
	width: 100%;
	overflow-x: hidden;
	height:43vw;
	z-index:2;
	background-size:cover;
	background-color:black;
}
@media (max-width:768px) {
	#banner {
	}
}

#banner h1, #banner h2{
font-family:'Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
margin:0;
padding:0;
}
#banner h1{font-weight:600;line-height:10px;}
#banner h2{font-weight:400;line-height:10px;}

.tspeast_top_text_1 {
color:white;
font-size:2.5vw;
padding:0 10px 0 10px;
line-hight:0;

text-shadow:2px 2px 3px #000;
background-color: rgba(0,0,0,0.15);
border: 0.0vw solid rgba(0,0,0,0.02);
border-radius: 4.0vw; 
-webkit-border-radius: 4.0vw;  
-moz-border-radius: 4.0vw; 
}
.tspeast_top_text_2 {
color:white;
font-size:2.0vw;
padding:0 20px 0 20px;

text-shadow:2px 2px 3px #000;
background-color: rgba(0,0,0,0.15);
border: 0.0vw solid rgba(0,0,0,0.02);
border-radius: 4.0vw; 
-webkit-border-radius: 4.0vw;  
-moz-border-radius: 4.0vw; 
}
.intro-text {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  text-align: center;
  position: absolute;
  bottom: 0;
  top: 0;
  left: 0;
  right: 0;
	z-index:999;
}

.line-spacer {
	width: 20%;
	margin:0 auto;
	margin-top: 20px;
	margin-bottom: 25px;
	border-bottom:1px solid #fff;
}

/* ================================
Company
================================= */


/* ================================
Rental
================================= */
.og-grid {
	list-style: none;
	padding: 20px 0;
	margin: 0 auto;
	text-align: center;
	width: 100%;
}

.og-grid li {
	display: inline-block;
	margin: 10px 5px 0 5px;
	vertical-align: top;
	height: 250px;
}

.og-grid li > a,
.og-grid li > a img {
	border: none;
	outline: none;
	display: block;
	position: relative;
}

.og-grid li.og-expanded > a::after {
	top: auto;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-bottom-color: none;
	border-width: 15px;
	left: 50%;
	margin: -20px 0 0 -15px;
}

.og-expander {
	position: absolute;
	background: #FFF;
	top: auto;
	left: 0;
	width: 100%;
	margin-top: 10px;
	text-align: left;
	height: 0;
	overflow: hidden;
}

.og-expander-inner {
	padding: 50px 0;
	height: 100%;
}

.og-close {
	position: absolute;
	width: 40px;
	height: 40px;
	top: 20px;
	right: 20px;
	cursor: pointer;
}

.og-close::before,
.og-close::after {
	content: '';
	position: absolute;
	width: 100%;
	top: 50%;
	height: 1px;
	background: #888;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	transform: rotate(45deg);
}

.og-close::after {
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.og-close:hover::before,
.og-close:hover::after {
	background: #333;
}

.og-fullimg,
.og-details {
	width: 50%;
	float: left;
	height: 100%;
	overflow: hidden;
	position: relative;
}

.og-details {
	padding: 0 40px 0 0;
}

.og-fullimg {
	text-align: center;
}

.og-fullimg img {
	display: inline-block;
	max-height: 100%;
	max-width: 100%;
}

.og-details h4 {
	font-weight: 300;
	margin-bottom: 10px;
}

.og-details p {
	font-weight: 300;
	font-size: 16px;
	line-height: 1.6em;
	color: #555;
}

.og-details a {
	font-weight: 700;
	display: inline-block;
	margin: 30px 0 0;
	outline: none;
}


.og-details a:hover {
	border-color: #999;
	color: #999;
}

.og-loading {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #ddd;
	box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ccc;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -25px 0 0 -25px;
	-webkit-animation: loader 0.5s infinite ease-in-out both;
	-moz-animation: loader 0.5s infinite ease-in-out both;
	animation: loader 0.5s infinite ease-in-out both;
}

@-webkit-keyframes loader {
	0% { background: #ddd; }
	33% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ddd; }
	66% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ddd, -15px 30px 1px #ccc; }
}

@-moz-keyframes loader {
	0% { background: #ddd; }
	33% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ddd; }
	66% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ddd, -15px 30px 1px #ccc; }
}

@keyframes loader {
	0% { background: #ddd; }
	33% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ddd; }
	66% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ddd, -15px 30px 1px #ccc; }
}

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

	.og-expander h3 { font-size: 32px; }
	.og-expander p { font-size: 13px; }
	.og-expander a { font-size: 12px; }

}

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

	.og-fullimg { display: none; }
	.og-details { float: none; width: 100%; }

}
/* ================================
more media queries
================================= */

@media (max-width:768px) {

	.og-fullimg { display: none; }
	.og-details { float: none; width: 100%; padding: 0 40px; }

}

@media (max-width:992px) {

	.og-expander {
		background: transparent;

	}
	.og-details {
		padding: 0 20px;
	}

}

@media (max-width:480px){

}


/* ================================
Custom Top
================================= */

/**** service ****/
.top_service_bg {
border:1px solid gray;
background-color: #DDD;
}

.top_service_text {
text-align: left;
float: left;
}

.carousel-item{
padding:0px 100px;
}
.div_spacer{
height:10vh;
clear:both;
}
.carousel-indicators{
	position:absolute;
	bottom:10px;
	left:50%;
	z-index:15;
	width:60%;
	padding-left:0;
	margin-left:-30%;
	text-align:center;
	list-style:none;
margin-top:0;
}
.carousel-indicators li{
	display:inline-block;
	width:20px;
	height:20px;
	margin:1px;
	text-indent:-999px;
	cursor:pointer;
	background-color:rgba(0,0,0,0.6);
	border:0px solid #fff;
	border-radius:10px;
}
.carousel-indicators .active{
	width:20px;
	height:20px;
	background-color:rgba(255,0,0,0.6);
	margin:1px;
}
.carousel-caption{
	position:absolute;
	right:15%;
	bottom:20px;
	left:15%;
	z-index:10;
	padding-top:20px;
	padding-bottom:20px;
	color:#fff;
	text-align:center;
	text-shadow:0 1px 2px rgba(0,0,0,.6)
}
.carousel-caption .btn{
	text-shadow:none;
}
.carousel-control-prev-icon,
.carousel-control-next-icon {
 	display: inline-block;
	background-color:rgba(0,0,0,0.0);
  border-top: 20px solid transparent;
  border-bottom: 20px solid transparent;
}
.carousel-control-prev-icon {
  border-right: 30px solid rgba(0,0,0,0.5);
}
.carousel-control-next-icon {
  border-left: 30px solid rgba(0,0,0,0.5);
}
@media screen and (min-width:768px){
	.carousel-control .glyphicon-chevron-left,
	.carousel-control .glyphicon-chevron-right,
	.carousel-control .icon-next,.carousel-control .icon-prev{
		width:30px;
		height:30px;
		margin-top:-10px;
		font-size:30px
	}
	.carousel-control .glyphicon-chevron-left,
	.carousel-control .icon-prev{
		margin-left:-10px
	}
	.carousel-control .glyphicon-chevron-right,
	.carousel-control .icon-next{
		margin-right:-10px;
	}.carousel-caption{
		right:20%;
		left:20%;
		padding-bottom:30px;
	}
	.carousel-indicators{
		bottom:20px;
	}
}
@media screen and (max-width:768px){
	.carousel-item{
		padding:0px 0px;
	}
	.carousel-control-prev-icon,
	.carousel-control-next-icon {
	 	display: inline-block;
		background-color:rgba(0,0,0,0.0);
	  border-top: 10px solid transparent;
	  border-bottom: 10px solid transparent;
		width:15px;
		height:15px;
	}
	.carousel-control-prev-icon {
	  border-right: 15px solid rgba(0,0,0,0.5);
	}
	.carousel-control-next-icon {
	  border-left: 15px solid rgba(0,0,0,0.5);
	}
}
.carousel-inner{
}

.bd {
border:1px solid black;
}

.top_section{
margin-top:-70px;
padding-top:70px;
/*padding-left:3vw;*/
}

@media (max-width:768px) {
	.top_section{
		margin-top:-55px;
		padding-top:55px;
		/*padding-left:5vw;*/
	}
}

.top_section h2 {
/*font-family: "Jun 501";*/
font-size:2vw;
font-weight:200;
padding:0.3vw 0 0.3vw 1.0vw;
display:inline-block;
width:70%;
letter-spacing: 0.3vw;

color:#000;
background: rgba(255,255,255,0.8);
border-left: solid 3vw rgba(255,91,38, 0.9);
border-top: solid 1px #ddd;
border-right: solid 1px #ddd;
border-bottom: solid 1px #ddd;
}
.top_section h2:first-letter{
font-size:2.8vw;
color:#FF5B26;
font-weight:400;
}
@media (max-width:768px) {
	.top_section h2 {
		font-size:5vw;
	}
	.top_section h2:first-letter{
		font-size:6vw;
	}
}



.div_box_center{
width: 90%;
margin: 0 auto;
text-align: center;
}
.og-grid li{height:100px;}


/**** intro ****/

.intro_txt{
max-width:790px;
margin: 0 auto;
}
.intro_txt p{
	font-size:1rem;
	line-height:1.2rem;
}

.intro_imghover {
	margin-left: 0;
	max-width:790px;
	max-height:240px;
	margin: 0 auto;
	overflow: hidden;
	cursor: pointer;
}
.intro_zoomin img {
	-webkit-transition: all 1s ease;
	transition: all 1s ease;
}
.intro_zoomin img:hover {
	-webkit-transform: scale(1.05,1.05);
	transform: scale(1.05,1.05);
	margin-left: -50%;
}
.intro_zoomin .intro_imghover_txt{
	color:white;
 	opacity: 0;
	display:none;
	float:right;
	width:40%;
	padding:0 0 0 0;
	font-size:0.8vw;

background: white;
line-height:4vw;

/*
writing-mode: vertical-rl;
-ms-writing-mode: tb-rl;
-webkit-writing-mode:vertical-rl; 
*/
vertical-align:bottom;

}
.intro_zoomin:hover .intro_imghover_txt{
	font-size:1rem;
	line-height:1.2rem;
	color:#ddd;
  -webkit-transition: 1.0s ease-in-out;
  -moz-transition: 1.0s ease-in-out;
  -o-transition: 1.0s ease-in-out;
  transition: 5.0s ease-in-out;
	display:inline;
 	opacity: 1;
}
@media screen and (max-width:768px){
	.intro_imghover {
		max-height:125px;
	}
}
/**** works ****/

.view_works figure.works_fig {
  font-family: Arial, sans-serif;
  position: relative;
  overflow: hidden;
  margin: 10px;
  min-width: 200px;
  max-width: 400px;
  max-height: 250px;
  width: 100%;
  color: #ffffff;
  text-align: center;
  font-size: 1.5em;
}
.view_works figure.works_fig * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}
.view_works figure.works_fig img {
  max-width: 100%;
}
.view_works figure.works_fig:after,
.view_works figure.works_fig:before,
.view_works figure.works_fig figcaption:after,
.view_works figure.works_fig figcaption:before {
  background: #0a0a0a;
  height: 25%;
  position: absolute;
  content: '';
  opacity: 0;
  -webkit-transition: all 0.35s steps(4);
  transition: all 0.35s steps(4);
  z-index: 1;
  left: 50%;
  right: 50%;
}
.view_works figure.works_fig:before {
  top: 0;
  -webkit-transition-delay: 0;
  transition-delay: 0;
}
.view_works figure.works_fig:after {
  top: 25%;
  -webkit-transition-delay: 0.1s;
  transition-delay: 0.1s;
}
.view_works figure.works_fig figcaption:before {
  top: 50%;
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
  z-index: -1;
}
.view_works figure.works_fig figcaption:after {
  top: 75%;
  -webkit-transition-delay: 0.3s;
  transition-delay: 0.3s;
  z-index: -1;
}
.view_works figure.works_fig figcaption {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 2;
  padding:30px 0;
}
.view_works figure.works_fig h3,
.view_works figure.works_fig p {
	font-family:'Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
	color:white;
  margin: 0;
  width: 100%;
  opacity: 0;
}
.view_works figure.works_fig h3 {
  font-size: 1em;
  font-weight: 900;
  text-transform: uppercase;
}
.view_works figure.works_fig p {
  font-size: 0.9em;
  font-weight: 300;
}
.view_works figure.works_fig i {
  padding: 0px 10px;
  display: inline-block;
  font-size: 1em;
  color: #ffffff;
  text-align: center;
  opacity: 0.8;
  text-decoration: none;
}
.view_works figure.works_fig i:hover {
  opacity: 1;
}
.view_works figure.works_fig:hover:after,
.view_works figure.works_fig.hover:after,
.view_works figure.works_fig:hover:before,
.view_works figure.works_fig.hover:before,
.view_works figure.works_fig:hover figcaption:after,
.view_works figure.works_fig.hover figcaption:after,
.view_works figure.works_fig:hover figcaption:before,
.view_works figure.works_fig.hover figcaption:before {
  left: 0;
  right: 0;
  opacity: 0.8;
}
.view_works figure.works_fig:hover figcaption h3,
.view_works figure.works_fig.hover figcaption h3,
.view_works figure.works_fig:hover figcaption p,
.view_works figure.works_fig.hover figcaption p {
  -webkit-transition-delay: 0.25s;
  transition-delay: 0.25s;
}
.view_works figure.works_fig:hover figcaption h3,
.view_works figure.works_fig.hover figcaption h3 {
  opacity: 1;
}
.view_works figure.works_fig:hover figcaption p,
.view_works figure.works_fig.hover figcaption p {
  opacity: 0.7;
}
.fig_title {
color:white;
background-color:rgba(0,0,0,0.6);
height:20%;
width:100%;
position: absolute;
bottom: 0;
font-size:0.6em;
text-valign:middle;
}
.view_works figure.works_fig:hover .fig_title,
.view_works figure.works_fig.hover .fig_title {
  opacity: 0;
}

.my_link{margin: 10px;}
.my_link a{
text-decoration: none;
color: white;
opacity: 0;
padding: 10px;
font-size: 1.0em;
font-weight: 400;
background-color: rgba(255,255,255,0.4);
border: 0.0vw solid rgba(0,0,0,0.02);
border-radius: 2.0vw; 
-webkit-border-radius: 2vw;  
-moz-border-radius: 2.0vw; 
}
.my_link a:visited,.my_link a:link{
color: white;
}
.my_link a:hover{
color: white;
opacity: 1;
}
@media screen and (max-width:768px){
	.view_works figure.works_fig {
	}
	.view_works figure.works_fig h3 {
	  font-size: 0.8em;
	}
	.my_link a{
		opacity: 1;
		font-size: 1.0em;
	}
	.fig_title {
		font-size:0.7em;
	}
}

/** rental **/

.og-grid_2 {
	list-style: none;
	padding: 20px 0;
	margin: 0 auto;
	text-align: center;
	width: 100%;
}

.og-grid_2 li {
	display: inline-block;
	margin: 10px 5px 0 5px;
	vertical-align: top;
}

.og-grid_2 li > a,
.og-grid_2 li > a img {
	border: none;
	outline: none;
	display: block;
	position: relative;
}

.view_rental{}
.view_rental figure.rental_fig {
  position: relative;
  overflow: hidden;
  margin: 10px;
  min-width: 230px;
  max-width: 315px;
  max-height: 220px;
  width: 100%;
  color: #000000;
  text-align: right;
  font-size: 16px;
  background-color: #000000;
}
.view_rental figure.rental_fig * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}
.view_rental figure.rental_fig img {
  max-width: 100%;
  backface-visibility: hidden;
}
.view_rental figure.rental_fig figcaption {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  z-index: 1;
  opacity: 1;
  padding: 30px 0 30px 10px;
  background-color: #ffffff;
  width: 40%;
  -webkit-transform: translateX(150%);
  transform: translateX(150%);
}
.view_rental figure.rental_fig figcaption:before {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 100%;
  content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 120px 120px 120px 0;
  border-color: transparent #ffffff transparent transparent;
}
.view_rental figure.rental_fig:after {
  position: absolute;
  top: 50%;
  right: 40%;
  content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 120px 120px 120px;
  border-color: transparent transparent rgba(255, 255, 255, 0.5) transparent;
  -webkit-transform: translateY(50%);
  transform: translateY(50%);
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}
.view_rental figure.rental_fig h3,
.view_rental figure.rental_fig p {
  line-height: 1.5em;
  -webkit-transform: translateX(-30px);
  transform: translateX(-30px);
  margin: 0;
}
.view_rental figure.rental_fig h3 {
  margin: 0 0 5px;
  line-height: 1.1em;
  font-weight: 900;
  font-size: 1.4em;
  opacity: 0.75;
}
.view_rental figure.rental_fig p {
  font-size: 0.8em;
}
.view_rental figure.rental_fig i {
  position: absolute;
  top: 0;
  left: 0;
  padding: 20px 30px;
  font-size: 44px;
  color: #ffffff;
  opacity: 0;
}
.view_rental figure.rental_fig a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
}
.view_rental figure.rental_fig:hover img,
.view_rental figure.rental_fig.hover img {
  zoom: 1;
  filter: alpha(opacity=50);
  -webkit-opacity: 0.5;
  opacity: 0.5;
}
.view_rental figure.rental_fig:hover:after,
.view_rental figure.rental_fig.hover:after,
.view_rental figure.rental_fig:hover figcaption,
.view_rental figure.rental_fig.hover figcaption,
.view_rental figure.rental_fig:hover i,
.view_rental figure.rental_fig.hover i {
  -webkit-transform: translateX(0);
  transform: translateX(0);
  opacity: 1;
}
.view_rental figure a{
content: "";
font-size:16px;
font-weight: 400;
color:rgba(255,255,255,1.00);
text-decoration: none;
background:linear-gradient(to top left, rgba(255,255,255,0) 50%, #f00 50.5%) no-repeat top left/50% 100%;
width:80px;
height:40px;
padding:5px;
margin:0; 
text-align: left;
}
.view_rental figure a:hover{
text-decoration: none;
}
.view_rental figure a:visited{
color:rgba(255,255,255,1.00);
}
.view_rental figure a:after{
content: "More";
}
/**** network ****/
.box-team {
}

/**** common ****/

#content {
margin:0;
padding:0;
}

.content-area{
}
.site-content {
}

.container_2{
margin:0 auto;
padding:0;
width:90%;
}

/**** copy ****/

._copy_area{
	font-size:3vw;
	position:relative;
	left:-20vw;
	width:115vw;
	background-color:#EEE;
	margin:0 auto;
	text-align:center;
	color:white;
}
#copy_00{
/*
    background:-webkit-gradient(linear, left top, right top, from(#f00), to(#00f));
    background:-webkit-linear-gradient(left, #f00, #00f);
    background:-moz-linear-gradient(left, #f00, #00f);
    background:-o-linear-gradient(left, #f00, #00f);
    background:linear-gradient(to bottom,  rgba(255,103,15, 1.0) 0, rgba(255,103,15, 1.0) 48%, #fff 48%, #fff 50%, rgba(255,103,15, 1.0) 50%, rgba(255,103,15, 1.0) 100%);
*/
  background:linear-gradient(to bottom,  rgba(0,90,255,0.6) 0, rgba(0,90,255,0.6) 49%, rgba(255,255,255, 1.0) 49%, rgba(255,255,255, 1.0) 50%, rgba(0,90,255,0.3) 50%, rgba(0,90,255,0.3) 100%);


}
#copy_01{
    background:-webkit-linear-gradient(15deg, #f00, #00f);
    background:-moz-linear-gradient(15deg, #f00, #00f);
    background:-o-linear-gradient(15deg, #f00, #00f);
    background:linear-gradient(-15deg, #666 0, #999 25%, #009 25%, #006 75%, #d00 75%, #f00 100%);
}
#copy_02{
    background:-webkit-linear-gradient(15deg, #f00, #00f);
    background:-moz-linear-gradient(15deg, #f00, #00f);
    background:-o-linear-gradient(15deg, #f00, #00f);
    background:linear-gradient(15deg, #f00 0, #d00 25%, #009 25%, #006 75%, #999 75%, #666 100%);
}
._copy_area img {
	position:relative;
	left:0;
	width:115vw;
}
@media (max-width:768px) {
	._copy_area{
		left:-15vw;
		width:115vw;
		background-color:blue;
	}
	._copy_area img {
		width:120vw;
	}
}
@media (min-width:1600px) {
	._copy_area{
		left:-23vw;
		width:103vw;
	}
	._copy_area img {
		width:100vw;
	}
}
.copy_area {
	font-size:3vw;
	width:100%
	background-color:#EEE;
	margin:0 auto;
	text-align:center;
	color:white;
}

/** tmp **/
.top_section .top-img-box{
text-align:center;
margin-top:30px;
margin-bottom:20px;
background-color:rgba(255,255,255, 0.6);
padding:20px;
}
@media (max-width:768px) {
margin-top:20px;
margin-bottom:10px;
}

.banner_area {
background-image:url('../images/top/banner.jpg');
/*
background:linear-gradient(-135deg, #FF8000, #FFB973);
line-height:80vh;
font-size:2em;
color:white;
*/
}
@media (max-width:768px) {
	.banner_area {
	}
}

.whatsnew h4{
font-weight:normal;
color:black;
background-color:white;
padding:5px 20px;
display:inline-block;
border-width:1px 1px;
border-color:black;
border-style: solid;
display:none;
}
.whatsnew {
padding-left:30px;
}
.whatsnew dl{
}
.container{
max-width: 100%;
padding:0;
}
.entry-content{
/*background-image:url('../bg/bg_00.png');*/
}

#contact p {
padding-left:100px;
}
@media (max-width:768px) {
#contact p {
padding-left:30px;
}
}

.top_bg_01{
/*
background-image:url('../images/top/bg_01.png');
background-position: center top;
background-clip: border-box;
*/
}
.top_bg_02{
/*
background-image:url('../images/top/bg_02.png');
background-clip: border-box;
*/
}
body {
background-color:#fff;
}
.btn-outline-secondary{
background-color:white;
margin:0 auto;
margin-top:10px;
width:100px;
}
.more_space{
margin-bottom:70px;

}
body {
/*
  background-image:url("../bg/bg_x.png"),repeating-linear-gradient(60deg, rgba(0,0,0,0.3) 0, rgba(0,0,0,0.3) 500px, transparent 500px, transparent 1500px),repeating-linear-gradient(-60deg, rgba(0,0,0,0.3) 0, rgba(0,0,0,0.3) 1px, transparent 1px, transparent 500px);
  background-repeat:repeat-y,repeat,repeat;
  background-position:left 10%,top,top;
	background-size:auto,auto,auto;
	opacity: 0.4,1.0;

  background-image:url("../bg/bg1.png"), url("../bg/bg2.png"),linear-gradient(-180deg, #000 50%, #ccc 48%, #eee 99%);;
  background-repeat:no-repeat,no-repeat,repeat;
  background-position:left 200px,center bottom,bottom;
	background-size: 80% auto,100% auto,auto;
*/
background:url("../bg/bg_xx.png"),linear-gradient(to bottom,  rgba(0,0,0,1.0) 0, rgba(255,255,255,0.8) 800px, rgba(255,255,255, 1.0) 40%, rgba(0,0,0, 0.1) 50%, rgba(0,0,0,0.25) 60%, rgba(255,255,255,1.0) 100%);

}
@media (max-width:768px) {
body {
/*
  background-position:left 100px,center bottom,bottom;
	background-size: 80% auto,100% 50%,auto;
*/
}
}
#page-sub-header {
background-color:transparent;
}

.img_ef_base {
overflow: hidden;
width: 100%;
text-align:center;
cursor: pointer;
}
.ef_00 img{
opacity: 1.5;
-webkit-transition: all 2.5s ease-in-out;
transition: all 2.5s ease-in-out;
}
.ef_00 img:hover {
opacity: 1.0;
-webkit-transform: rotateY(360deg);
transform: rotateY(360deg);
}
.ef_01 img{
opacity: 1.5;
-webkit-transition: all 2.5s ease-in-out;
transition: all 2.5s ease-in-out;
}
.ef_01 img:hover {
opacity: 1.0;
-webkit-transform: rotateX(360deg);
transform: rotateX(360deg);
}
.ef_02 img{
opacity: 0.5;
-webkit-transition: 0.6s ease-in-out;
transition: 0.6s ease-in-out;
}
.ef_02 img:hover {
transform: scale(1.1,1.1);
opacity: 1.0;
}
