/**/
body {
	
	background-color:#1a1a1a;
	font-size:13px;
	color:#000;
	margin:0;
	padding:0;
	width:100%;
	-webkit-text-size-adjust: 100%;
}

#wrapper{
	/*display:none;*/
}

#loading {
	position:fixed;
	z-index:99999;
	width:100%;
	height:110%;
}
#loading .bg img{
}

#loading .loading_anime{
	position:fixed;
	top:30%;
	width:100%;
	text-align:center;
}
#loading .logo{
	width:300px;
	margin-bottom:30px;
	
}
#loading .icon{
	width:40px;
	z-index:999999999999999999;
}

p {
	font-size:14px;
	line-height:1.8;
	margin:0;
	padding:0;
}

img{
	width:100%;
	margin:0;
	padding:0;
	border:none;
}

a {
	text-decoration:none;
	color:#660;
	outline:none;
}
a:hover {
	text-decoration:none !important;
	color: #330;
}
a:hover img {
	opacity:0.80;
	filter:alpha(opacity=80);/*IE*/
}
#ja , #ja input{
	font-family:  "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ", Meiryo, sans-serif;
}
#en , #en input {
	font-family: Helvetica, Arial, sans-serif;
}

span.br {
    display: block;
}

li{
	list-style:none;
	margin:0;
	padding:0;
	line-height:0;
}

.clearfix_:after {
    visibility: hidden;
    display: block;
    content: " ";
    clear: both;
    height: 0;
    }
* html .clearfix_             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix_ { zoom: 1; } /* IE7 */

#yebis_wrapper{	
	background-color:#000;
	width:100%;
	min-width:1050px;
}

/*head*/
.mean-bar{
	display:none;
}
#top_menu {
	background-color:rgba(0,0,0,0.2);
	position:fixed;
	z-index:50;
	width:100%;
	height:70px;
	padding-top:50px;
	transition: all 0.4s ease-in-out 0s;
	min-width:1000px;
}
#top_menu.fixed {
	background-color:#000;
	padding-top:10px;
	height:55px;
	transition: all 0.4s ease-in-out 0s;
	border-bottom:#555 solid 1px;
}

#top_menu h1 img{
	width:100%;
	transition: all 0.4s ease-in-out 0s;
}


.menuhead {
	max-width:1500px;
	width:95%;
	margin:0 auto;
}
	.menuhead .headlang {/*言語選択リンク*/
		display:block;
		float:left;
		color:#999;
		text-align:right;
		margin:0;
		padding:0;
		width:100%;
		max-width:1500px;
		height:20px;
		line-height:20px;
	}
		.menuhead .headlang a {
			color:#CCC;
			font-family: Helvetica, Arial, sans-serif;
		}
		.menuhead .headlang a:hover {
			color:#FFF;
			text-decoration:none;
		}
		.menuhead .headlang strong {
			color:#FFF;
		}
	.menuhead .headlogo {
		display:block;
		float:left;
		margin:0;
		width:300px;
		height:50px;
		transition: all 0.3s ease-in-out;
	}
	#en .menuhead .headlogo {
		display:block;
		float:left;
		margin:0;
		padding:0;
		height:50px;
	}
	#en #top_menu.fixed .menuhead .headlogo {
		width:240px;
		transition: all 0.3s ease-in-out;
	}
	.menuhead ul {
		list-style:none;
		padding:0;
		margin:0;
		max-width:900px;
	}
	.menuhead ul li {
		float:left;
		padding:0 0 0 1px;
	}
	
	
	.menuhead ul li a img:hover {
		/*opacity:0;
		filter:alpha(opacity=0);/*IE*/
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
	}
	#en .menuhead ul li a img:hover {
		opacity:1;
		filter:alpha(opacity=1);/*IE*/
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
	}
	.menuhead ul li.trial {
		padding:0 0 0 37px;
	}
	#en .menuhead ul li.trial {
		padding:0 0 0 0;
	}



ul{
    list-style-type: none;
    margin: 0;
    padding: 0;
    color: #fff;
}
ul#menu li{
	margin:0 10px;
}
ul#menu li img{
	height: 50px;
}
/*
ul#menu li:nth-child(1){
	width:91px;
}
ul#menu li:nth-child(2){
	width:102px;
}
ul#menu li:nth-child(3){
	width:65px;
}
ul#menu li:nth-child(4){
	width:51px;
}
ul#menu li:nth-child(5){
	padding-right:0;
	margin-right:0;
}
*/


ul#menu li img{
	height:50px;
	width:auto;
}
ul#menu li a:hover img{
	opacity:1;
}
ul#menu li a:hover img{
	opacity:0.8;
}
ul.child{
    display: none;
    position: absolute;
	margin-left:-50px;
}
ul.child ul{
    padding: 10px 15px 10px 25px;
}

ul#menu ul.child li {
	float:none;
	width:280px;
}

ul.child li a{
    background: #999933 none repeat scroll 0 0;
    border-bottom: 1px solid #4f4f1b;
    color: #fff;
    display: block;
    padding: 10px;
}

ul.child li a:hover {
	display:block;
	background:#4f4f1b;
	text-decoration:none;
	color:#FFF;
}
ul.child li a span{
	color:#C00;
}

ul.child li:first-child a p,
ul.child li:nth-child(2) a p{
	padding-left:10px;
}

ul.child li a p{
	padding-left:20px;
}

li a:hover{
    /*background: #ff0000;*/
}

#myslide div{
	z-index:0 !important;	
}

/*page top link*/

#why_yebis{
}

.title_why_yebis{
	z-index:1;
	position:absolute;
	width:100%;
	text-align:center;
	margin-top:400px;
	min-width:1000px;
}
.title_why_yebis .title_text img{
	width:50%;
	max-width:638px;
	opacity:0;
	margin-top:-20px;
}
.title_why_yebis .title_text2 img{
	width:50%;
	max-width:638px;
	opacity:0;
	margin-top:-20px;
}
.title_why_yebis .title_arrow{
	margin-top:30px;
	cursor:pointer;
}
.title_why_yebis .title_arrow img{
	width:30%;
	max-width:60px;
	margin-top:-30px;
	opacity:0;
}

/* why_yebis_text */

#why_yebis_text{
    width: 95%;
    max-width: 1500px;
    text-align: center;
    margin: 0px auto;
	padding-top:100px;
}
#why_yebis_text p{
	color:#CCC;
	font-size:16px;
	line-height: 34px;
	letter-spacing: 2pt;
}

/**/

#video_qc{
	width:100%;
	text-align:center;
	margin-top:100px;
	margin-bottom:100px;
}

#video_qc .title_text{
	padding-top:100px;
	margin-bottom:100px;
}

#video_qc .title_text img{
	width:40%;
	max-width:492px;
}

.qc_content{
	width:95%;
	max-width:1500px;
	text-align:center;
	margin:0 auto;
	background-color:#989b33; 
}

.qc_content .qc_content1{
	width:100%;
	margin:0 auto;
}
.qc_content .qc_content1 .qc_content1_l{
	float:left;
	width:34%;
}

.qc_content .qc_content1 .qc_content1_l img{
}
.qc_content .qc_content1 .qc_content1_l .qc_content1_l_content{
	padding:10%;
}
.qc_content .title{
	color:#FFF;
	margin-bottom:25px;
}

.qc_content1_l_content .title{
	margin-top:50px;
}
.qc_content2_r_content .title{
	margin-top:20px;
}

.qc_content .title span{
	font-size:20px;
	text-align:left;
}

.qc_content .content{
	color:#FFF;
	text-align:left;
	font-size:16px;
	line-height:38px;
	padding:0 2% 0 3%;
	letter-spacing: 1.5pt;
}

.qc_content .qc_content1 .qc_content1_r{
	float:left;
	width:66%;
	background-color:#000;
}
.qc_content .qc_content2{
}
.qc_content .qc_content2 .qc_content2_l{
	float:left;
	width:66%;
	background-color:#000;
}
.qc_content .qc_content2 .qc_content2_r{
	float:right;
	width:34%;
}
.qc_content .qc_content2 .qc_content2_r .qc_content2_r_content{
	padding:9%;
}

#production_process{
	width:100%;
	text-align:center;
	margin-top:200px;
	margin-bottom:100px;
}

#production_process .title_text{
	margin-bottom:100px;
}

#production_process .title_text img{
	width:30%;
	max-width:390px;
}

.process_content{
	width:95%;
	max-width:1500px;
	text-align:center;
	margin:0 auto;
	background-color:#1e1e1e;
}
.process_content .title{
	color:#FFF;
	margin-bottom:50px;
}
.process_content1_l .title{
	margin-top:30px;
}

.process_content2_r .title{
	margin-top:30px;
}

.process_content .title span{
	font-size:20px;
	text-align:left;
}

.process_content .content{
	color:#FFF;
	text-align:left;
	font-size:16px;
	line-height:38px;
	padding:0 2% 0 3%;
	letter-spacing: 2pt;
}

.process_content .process_content1{
	width:100%;
	margin:0 auto;
}
.process_content .process_content1 .process_content1_l{
	float:left;
	width:34%;
}
.process_content .process_content1 .process_content1_r{
	float:left;
	width:66%;
}

.process_content .process_content2{
}
.process_content .process_content2 .process_content2_l{
	float:left;
	width:50%;
}
.process_content .process_content2 .process_content2_r{
	float:right;
	width:50%;
}

.process_content .process_content1 .process_content1_l .process_content1_l_content{
	padding:9%;
}
.process_content .process_content2 .process_content2_r .process_content2_r_content{
	padding:9%;
}

#featured_projects{
	width:100%;
	text-align:center;
	margin-top:240px;
	margin-bottom:100px;
}

.projects_content{
	width:95%;
	max-width:1500px;
	text-align:center;
	margin:0 auto; 
}

.projects_content li:first-child{
	float:left;
	width:24.96%;
}
.projects_content li{
	float:left;
	width:25%;
}


#plus_yebis{
	width:100%;
	text-align:center;
	margin-top:240px;
	padding-bottom:100px;
}

#plus_yebis .title_text{
	margin-bottom:80px;
	text-align:center;
}

#plus_yebis .title_text img{
	width:65%;
	max-width:750px;
}
#plus_yebis ul{
	width:80%;
	max-width:800px;
	margin:0 auto;
}
#plus_yebis li{
	float:left;
	width:33.33%;
	text-align:center;
}

#plus_yebis li div{
	display: block; 
	position: relative;
	margin:0 auto; 
	width: 50%; 
	height: 150px;
}

#plus_yebis li .pc img.on{
	display: inline; 
	position: absolute; 
	left: 0px; 
	top: 0px; 
	margin-top:-20%;
	opacity: 0;
}
#plus_yebis li .sp img.on{
	display: inline; 
	position: absolute; 
	left: 0px; 
	top: 0px; 
	margin-top:-20%;
	opacity:1 !important;
}

#plus_yebis li .pc img.off{
	position: absolute; 
	left: 0px; 
	top: 0px; 
	opacity: 1;
	margin-left:10%;
	width:80%;
	
}
#plus_yebis a{
	color:#CCC;
	transition: all 0.4s ease-in-out 0s;
}
#plus_yebis a:hover{
	color:#999;
	text-decoration:none;
	transition: all 0.4s ease-in-out 0s;
}

#plus_yebis div p{
	font-size:18px;
}
#plus_yebis a p span{
	color:#989b33;
	font-size:14px;
	text-decoration:underline;
}

/* NEWS */
#news{
	width:100%;
	text-align:center;
	margin-top:150px;
	padding-bottom:120px;
}
#news .title_text{
	margin-bottom:100px;
}
#news .title_text img{
	width:30%;
	max-width:390px;
}

.news_content{
    width: 95%;
    max-width: 1500px;
    text-align: center;
    margin: 0px auto;
}

.news_content ul li{
	float:left;
	width:32%;
	background-color:#1E1E1E;
}
.news_content ul li .mask{
	overflow:hidden;	
}
.news_content ul li:nth-child(2){
	margin:0 2%;
}
.news_content ul li a p.info{
	float:left;
	text-align:left;
	width:60%;
	color:#AFB344;
	margin:0 auto;
	padding-top:10px;
	margin-left:5%;
	padding-bottom:10px;
}
.news_content ul li a p.day{
	float:right;
	text-align:right;
	width:30%;
	color:#AFB344;
	margin:0 auto;
	padding-top:10px;
	margin-right:5%;
	padding-bottom:10px;
}
.news_content ul li a p.content{
	width:90%;
	text-align:left;
	margin:0 auto;
	color:#999;
	padding-bottom:15px;
	font-size:14px;
}
.news_content ul li a:hover p.content{
	color:#ccc;

}

a .kuwashiku{
	position:absolute;
	margin-top:120px;
	z-index:5;
	opacity:0;
}
a:hover .kuwashiku{
	opacity:1;
}
.kuwashiku img{
	width:50%;
	max-width:140px;
	opacity:1;
	border:1px #FFFFFF solid;	
}
.news_content ul li a:hover img.top_news{
	opacity:0.6;
}


/*foot*/
#yebis_footer{
	width:100%;
	background-color:#1a1a1a;
	min-width:1000px;
}

.foottopbox {
	background:#000;
	width:90%;
	max-width:1400px;
	margin:0 auto;
}
.foottop {	
	background-color:#1a1a1a;
	color:#777;
	font-size:11px;
	padding: 30px 0 20px 0;
}
.foottop ul {
	margin:0 auto 20px;
	padding:10px 0 0 0;
	float:left;
	width:100%;
	height:30px;
	list-style:none;
	font-size:12px;
}
body#en .foottop ul {
	margin:0 auto 20px;
	padding:10px 0 0 0;
	float:left;
	width:100%;
	height:30px;
	list-style:none;
	font-size:13px;
}
.foottop ul li {
	float:left;
	margin:0 0 0 0;
	padding:0 30px 0 10px;
}
.foottop ul li:first-child {
	padding:0 30px 0 0;
}	
.foottop ul li.last {
	border:none;
}

@media screen and (max-width: 750px){
	.foottop ul li.last.language {
		width: 100%;
	}
}
@media screen and (min-width: 751px){
	.foottop ul li.last.language {
		display: none;
	}
}
.foottop ul li p{
	font-size:13px;
}
.foottop ul li a {
	color:#CCC;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.foottop ul li a:hover {
	color:#d5c936;
	text-decoration:none;
}
.foottop p, body#en .foottop p {
	margin:0;
	padding:10px 10px 10px 0;
	line-height: 1.8;
	font-size:11px;
}

#en #yebis_footer,
body#en .foottop ul p{
	font-family:  "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ", Meiryo, sans-serif;
	font-size: 13px;
}

.footbottom {
	background:#000;
	width:90%;
	max-width:1400px;
	margin:0 auto;
	color:#999;
}
.footbottom img {
	vertical-align:middle;
	/*margin:15px 0 30px 0;*/
}
.footbottom .copyright {
	width:300px;
	text-align:right;
	font-size:11px;
	font-family: Helvetica, Arial, sans-serif;
	color:#666;
	padding:30px 0 0 0;
	float: right;
}

.footbottom .sskkLogo img{
	width: 230px;
	height: 64.4px;
}
.corp_sns{
	float: left;
}

.corp_sns img{
	-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}

.corp_sns ul li{
	float:left;
	margin-top: 12px;
}
.corp_sns ul li:first-child{
	margin-bottom:30px;
	margin-top: 0;
}
.corp_sns ul li:nth-child(5){
	padding-top:6px;	
}

.corp_sns ul li p{
	padding-top:15px;
	padding-left:50px;
	padding-right:10px;
	font-size:12px;
}

a.side-twitter {
margin: 5px 9px 0 0;
padding: 0;
display: block;
background: url(../image/social_new/btn_social_twitter@2x.png) 0 0 no-repeat;
	-webkit-background-size: 32px 32px;
       -moz-background-size: 32px 32px;
         -o-background-size: 32px 32px;
            background-size: 32px 32px;
width: 32px;
height: 32px;
border-bottom: none;
float: right;
-webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}


a.side-twitter span {
display: none;
}


a.side-twitter:hover{
background: url(../image/social_new/btn_social_twitter_ov@2x.png) 0 0 no-repeat;
	-webkit-background-size: 32px 32px;
       -moz-background-size: 32px 32px;
         -o-background-size: 32px 32px;
            background-size: 32px 32px;
}



a.side-facebook {
margin: 5px 9px 0 0;
padding: 0;
display: block;
background: url(../image/social_new/btn_social_fb@2x.png) 0 0 no-repeat;
	-webkit-background-size: 32px 32px;
       -moz-background-size: 32px 32px;
         -o-background-size: 32px 32px;
            background-size: 32px 32px;
width: 32px;
height: 32px;
border-bottom: none;
float: right;
-webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}


a.side-facebook span {
display: none;
}

a.side-facebook:hover{
background: url(../image/social_new/btn_social_fb_ov@2x.png) 0 0 no-repeat;
	-webkit-background-size: 32px 32px;
       -moz-background-size: 32px 32px;
         -o-background-size: 32px 32px;
            background-size: 32px 32px;
}


a.side-gplus {
margin: 5px 9px 0 0;
padding: 0;
display: block;
background: url(../image/social_new/btn_social_g@2x.png) 0 0 no-repeat;
	-webkit-background-size: 32px 32px;
       -moz-background-size: 32px 32px;
         -o-background-size: 32px 32px;
            background-size: 32px 32px;
width: 32px;
height: 32px;
border-bottom: none;
float: right;
-webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}


a.side-gplus span {
display: none;
}

a.side-gplus:hover{
background: url(../image/social_new/btn_social_g_ov@2x.png) 0 0 no-repeat;
	-webkit-background-size: 32px 32px;
       -moz-background-size: 32px 32px;
         -o-background-size: 32px 32px;
            background-size: 32px 32px;
}

#toPageTop {
    position: fixed;
    bottom: 100px;
    right: 40px;
    float: none;
    width: 50px;
    z-index: 50;
}

#toPageTop a img{
	opacity:0.8;
	transition: all 0.3s ease-in-out 0s;
}
#toPageTop a:hover img{
	opacity:1;
	transition: all 0.3s ease-in-out 0s;
}


/************** MAYA *********************/
#yebis-for-Switch{
	width:95%;
	max-width:1500px;
	margin:0 auto;
	margin-top:240px;
	color:#FFF;
	text-align: center;
}
#yebis-for-Switch .title{
	margin-top:7%;
	font-size:20px;
}
#yebis-for-Switch .title span{
	border-bottom:#FFF 1px solid;
	padding-bottom:10px;
}

#yebis-for-Switch .cl,
#yebis-for-Switch .cr{
	float:left;
	width:50%;
	text-align:center;
}

#yebis-for-Switch .main-title{
	margin:0 auto;
	margin-top:10%;
	font-size: 40px;
}
#yebis-for-Switch p{
	margin-top:20px;
	font-size:16px;
}
#yebis-for-Switch .cl .goto-maya:hover{
	opacity:1;
	background-color:#989b33;
	border:#989b33 1px solid;
	transition: all 0.3s ease-in-out 0s;
}


#yebis-for-Switch .goto-maya{
	border:#FFFFFF 1px solid;
	width:160px;
	height:46px;
	margin:0 auto;
	margin-top:30px;
	transition: all 0.3s ease-in-out 0s;
}
#yebis-for-Switch .goto-maya a:hover img{
	opacity:1;
}


/*-------------------- TOP BTN MAYA 20160205----------------------------------*/

#maya_btn{
	position:fixed;
	right:30px;
	bottom:70px;
	color:#FFF;
	z-index:99;
	opacity:0;
}
#maya_btn .close_btn{
	text-align:right;
	font-size:26px;
}
#maya_btn .close_btn img{
	cursor:pointer;
}
#maya_btn .close_btn img{
	width:25px;
}
#maya_btn .close_btn img:hover{
	opacity:0.8;
}
#maya_btn .maya_box{
	background-color:#989b33;
	color:#FFF;
	padding:25px 35px;
	width:400px;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.4)
}
#maya_btn .maya_box .maya_l{
	float:left;
}
#maya_btn .maya_box a .maya_r{
	position:relative;
	float:right;
	width:234px;
	height:131px;
	overflow: hidden;
    text-align: center;
	background-color:#000;
}
#maya_btn .maya_box a .maya_r img{
    -webkit-transition: all 0.5s ease 0s;
	transition: all 0.5s ease 0s;
}
#maya_btn .maya_box a:hover .maya_r img{
        -webkit-transform:scale(1.15,1.15);
		-moz-transform:scale(1.15,1.15);
        -ms-transform:scale(1.15,1.15);
        -o-transform:scale(1.15,1.15);
		transform: scale(1.15,1.15);
}
#maya_btn .maya_box a .maya_r .maya_movie_btn{
	width:234px;
	height:131px;
	background-image:url(/middleware/yebis3/image/new_top/btn_movie_off.png);
	background-size:40px 40px;
	background-position:50% 50%;
	background-repeat:no-repeat;
	position:absolute;
	top:0;
	left:0;
	-webkit-transition:all 0.25s ease 0s;
    transition:all 0.25s ease 0s;
}
#maya_btn .maya_box a:hover .maya_r .maya_movie_btn{
	background-image:url(/middleware/yebis3/image/new_top/btn_movie_on.png);
	background-size:40px 40px;
	background-position:50% 50%;
}
#maya_btn .maya_box span{
	font-size:26px;
}
#maya_btn .maya_box p{
	line-height:1.5;
}
#maya_btn a .goto-maya{
	border:#FFF 1px solid;
	width:150px;
	text-align:center;
	padding:10px 0;
	font-size:18px;
	transition: all 0.3s ease-in-out 0s;
	margin-top:10px;
	color:#FFF;
}
#maya_btn a:hover .goto-maya{
	opacity:1;
	color:#989b33;
	background-color:#FFF;
	transition: all 0.3s ease-in-out 0s;
}

/* middleware-link ------------------------------------:*/
#middleware-link{
	color:#FFF;
	text-align:center;
	padding:110px 0;
	padding-bottom:200px;
}
#middleware-link .middleware_content{
	width:90%;
	margin:0 auto;
	max-width:1200px;
}
.middleware_title{
	width:100%;
	margin-bottom:40px;
}
.title {
    font-size: 24px;
    text-align: center;
}
#middleware-link li{
	overflow:hidden;
	cursor:pointer;
}
#middleware-link li:first-child{
	float:left;
	width:48%;
}
#middleware-link li:last-child{
	float:right;
	width:48%;
}
#middleware-link li img{
	width:100%;
}
#middleware-link .view-first .logo{
	position:absolute;
	margin:0 auto;	
	margin-top:100px;
	z-index:1;

   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
   
   -webkit-transition: all 0.2s ease-in 0.0s;
   -moz-transition: all 0.2s ease-in 0.0s;
   -o-transition: all 0.2s ease-in 0.0s;
   -ms-transition: all 0.2s ease-in 0.0s;
   transition: all 0.2s ease-in 0.0s;
   
}
#middleware-link .view-first .logo.enlighten{
	margin-top: 80px;
}
#middleware-link .view-first:hover .logo{
	/*margin-top:70px;*/

   -webkit-transform: translateY(-30px);
   -moz-transform: translateY(-30px);
   -o-transform: translateY(-30px);
   -ms-transform: translateY(-30px);
   transform: translateY(-30px); 
   
   -webkit-transition: all 0.2s ease-in 0.0s;
   -moz-transition: all 0.2s ease-in 0.0s;
   -o-transition: all 0.2s ease-in 0.0s;
   -ms-transition: all 0.2s ease-in 0.0s;
   transition: all 0.2s ease-in 0.0s;
}
#middleware-link .view-first:hover .logo.enlighten{
   -webkit-transform: translateY(-40px);
   -moz-transform: translateY(-40px);
   -o-transform: translateY(-40px);
   -ms-transform: translateY(-40px);
   transform: translateY(-40px); 
   
   -webkit-transition: all 0.2s ease-in 0.0s;
   -moz-transition: all 0.2s ease-in 0.0s;
   -o-transition: all 0.2s ease-in 0.0s;
   -ms-transition: all 0.2s ease-in 0.0s;
   transition: all 0.2s ease-in 0.0s;
}
#middleware-link .logo img{
	max-width:250px;
	margin:0 auto;
}
#middleware-link .logo.enlighten img{
	max-width: 80px;
	margin:0 auto;
}
#middleware-link .message{
	position:absolute;
	color:#FFF;
	text-align:left;
	overflow:hidden;
}
#middleware-link .message_detail{
	background-color:rgba(0,0,0,0.5);
	padding:15px;
	font-size:1.3rem;
	font-size:13px;
	line-height:21px;
}

.view-first{
	line-height:0;
}

#middleware-link .message_detail p{
	margin-bottom:15px;
}
#middleware-link .view span{
	padding:5px 10px;
	padding-left:25px;
	background-image:url(/middleware/yebis3/image/new_top/arrow_.png);
	background-position:10px center;
	background-repeat:no-repeat;
	background-size:6px 12px;
}
#middleware-link .view .enlighten span{
	background-color:#f05a21;
}
#middleware-link .view .enlighten span.br{
	background-color:transparent;
	padding:0;
	background:none;
}
#middleware-link .view .mizuchi span{
	background-color:#004484;
}
#middleware-link .mask p{
	line-height:24px;
	background-color:rgba(0,0,0,0.7);
	height:120px;
	font-size: 14px;
}
.view {
    float: left;
    overflow-x: hidden;
    overflow-y: hidden;
    position: relative;
    text-align: center;
}
.view .mask, .view .content {
    left: 0;
    overflow-x: hidden;
    overflow-y: hidden;
    position: absolute;
    top: 0;
}

.view-first img {
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}
.view-first .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;
   
   height:130px;
   text-align:left;
}
.view-first h2 {
   -webkit-transform: translateY(-100px);
   -moz-transform: translateY(-100px);
   -o-transform: translateY(-100px);
   -ms-transform: translateY(-100px);
   transform: translateY(-100px);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.view-first p {
   -webkit-transform: translateY(100px);
   -moz-transform: translateY(100px);
   -o-transform: translateY(100px);
   -ms-transform: translateY(100px);
   transform: translateY(100px);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
   text-align:left;
}
.view-first:hover img {
  /* -webkit-transform: scale(1.1,1.1);
   -moz-transform: scale(1.1,1.1);
   -o-transform: scale(1.1,1.1);
   -ms-transform: scale(1.1,1.1);
   transform: scale(1.1,1.1);*/
}
.view-first a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.view-first:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}
.view-first:hover h2,
.view-first:hover p,
.view-first:hover a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
   
}
.view-first:hover p {
   -webkit-transition-delay: 0.1s;
   -moz-transition-delay: 0.1s;
   -o-transition-delay: 0.1s;
   -ms-transition-delay: 0.1s;
   transition-delay: 0.1s;
   
   
   -webkit-transition: all 0.2s ease-in 0.0s;
   -moz-transition: all 0.2s ease-in 0.0s;
   -o-transition: all 0.2s ease-in 0.0s;
   -ms-transition: all 0.2s ease-in 0.0s;
   transition: all 0.2s ease-in 0.0s;
}
.view-first:hover a.info {
   -webkit-transition-delay: 0.2s;
   -moz-transition-delay: 0.2s;
   -o-transition-delay: 0.2s;
   -ms-transition-delay: 0.2s;
   transition-delay: 0.2s;
}
.view p {
    color: #fff;
    font-size: 12px;
    padding-bottom: 20px;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 10px;
    position: relative;
}			

#share-sns {
	color: #FFF;
    text-align: center;
    padding-bottom: 50px;
}
#share-sns p {
    margin-bottom: 20px;
}
#share-sns li {
    line-height: 40px;
    display: inline;
    margin-right: 20px;
}
#share-sns li img {
    height: 45px;
    width: 45px;
	vertical-align: bottom;
}
#share-sns li a:hover img{
    transform: rotateX(360deg);
    transition: .8s ease-in-out;
}
/*#share-sns li a:hover img {
    height: 55px;
    width: 55px;
}*/
#share-sns li span {
	color: #FFF;
    margin-left: 10px;
    font-size: 14px;
}

@media only screen and (max-width: 1600px) {
.title_why_yebis{
	margin-top:350px;
}
}
@media only screen and (max-width: 1570px) {
.process_content .process_content1 .process_content1_l .process_content1_l_content,
.qc_content .qc_content1 .qc_content1_l .qc_content1_l_content{
	padding:8%;
}
.process_content .content,
.qc_content .content{
	padding:0 5%;
	line-height:28px;
}
.qc_content1_l_content .title{
	margin-top:50px;
}
.qc_content2_r_content .title{
	margin-top:40px;
}
.process_content1_l .title{
	margin-top:40px;
}
}

@media only screen and (max-width: 1520px) {
	.qc_content .content{
		letter-spacing:1.2pt;
	}
}


@media only screen and (max-width: 1500px) {
	.title_why_yebis{
		margin-top:300px;
	}
	.qc_content2_r_content .title{
		margin-top:25px;
	}
	.process_content1_l .title{
		margin-top:30px;
	}
	a .kuwashiku{
		margin-top:110px;
	}
}

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

.qc_content .qc_content1 .qc_content1_l .qc_content1_l_content{
	padding:7% 7%;
}
.qc_content .qc_content2 .qc_content2_r .qc_content2_r_content{
	padding:7% 7%;
}
	.title_why_yebis{
		margin-top:270px;
	}
	.qc_content .title{
		margin-bottom:30px;
	}
	.process_content .title{
		margin-bottom:30px;
	}
	.process_content .content,
	.qc_content .content{
		padding:0;
		line-height:28px;
	}

	.qc_content1_l_content .title{
		margin-top:50px;
	}
	.qc_content2_r_content .title{
		margin-top: 10px;
		margin-bottom: 20px;
	}
	.process_content1_l .title{
		margin-top:40px;
	}
	a .kuwashiku{
		margin-top:100px;
	}
}

@media only screen and (max-width: 1350px) {
.title_why_yebis{
	margin-top:230px;
}
.qc_content2_r_content .title{
	margin-top:10px;
}
.process_content1_l .title{
	margin-top:20px;
	margin-bottom: 10px;
}
	.qc_content2_r_content .title {
		margin-top: 0px;
		margin-bottom: 10px;
	}
}
@media only screen and (max-width: 1261px) {

.process_content .title{
	margin-bottom:20px;
}
	.qc_content2_r_content .title{
		margin: 0;
	}
.process_content .content,
.qc_content .content{
	padding:0;
	line-height:28px;
}
.qc_content2_r_content .title{
	margin-top:10px;
}
.process_content1_l .title{
	margin-top:10px;
	margin-bottom: 10px;
}
a .kuwashiku{
	margin-top:90px;
}

}

@media only screen and (max-width: 1220px) {
	.qc_content .title{
		margin-bottom: 10px;
		margin-top: 0;
	}
	.process_content .content, .qc_content .content{
		line-height: 1.8;
		font-size: 15px;
	}
	ul#menu li{
		margin: 0 5px;
	}
}


@media only screen and (max-width: 1160px) {
	.qc_content .title{
		margin-bottom: 0px;
		margin-top: 0;
	}
	.process_content1_l .title{
		margin-top:0px;
	}
	.process_content2_r .title{
		margin-top:25px;
	}
	a .kuwashiku{
		margin-top:80px;
	}
	ul#menu li{
		margin: 0;
	}
	.process_content .content, .qc_content .content{
		font-size: 15px;
		line-height: 1.5;
	}
	span.br{display: inline;}

}

@media only screen and (max-width: 1000px) {
	ul#menu li img{
		height: 50px;
	}
}



@media only screen and (max-width: 750px) {
/*
.sp{
	display:block !important;
}
.pc{
	display:none !important;
}*/
#plus_yebis li div.sp,
#plus_yebis li a.sp{
	display:block !important;
}
#plus_yebis li div.pc,
#plus_yebis li a.pc{
	display:none !important;
}
.projects_content li a.sp{
	display:block !important;
}
.projects_content li a.pc{
	display:none !important;
}
/**********************/
/*header*/
/**********************/

.mean-bar{
	display:block;
}
.mean-container .mean-bar{
	margin-top:0 !important;
    top: 0;
}

.mean-nav p{
	margin-bottom:0;
	margin-top:0;
}
.mean-container .meanmenu-reveal{
	color: #fff;
    cursor: pointer;
    display: block;
    font-size: 1px;
    font-weight: 700;
    height: 35px;
    line-height: 22px;
    padding: 12px 15px;
    position: absolute;
    text-decoration-color: -moz-use-text-color;
    text-decoration-line: none;
    text-decoration-style: solid;
    text-indent: -9999em;
    top: 0;
    width: 30px;
	right:0;
	left:auto;
}
.mean-container .meanmenu-reveal span{    
	background-attachment: scroll;
    background-clip: border-box;
    background-color: #fff;
    background-image: none;
    background-origin: padding-box;
    background-position: 0 0;
    background-repeat: repeat;
    background-size: auto auto;
    display: block;
    height: 2px;
    margin-top: 5px;
	transition: all 0.3s ease-in-out 0s;
}
.mean-container .meanmenu-reveal span.top{
    margin-top: 10px;
}

.mean-container .meanmenu-reveal.active span.top{
	transform:rotate(135deg);
	margin-top:15px;
	transition: all 0.3s ease-in-out 0s;
}
.mean-container .meanmenu-reveal.active span.mid{
	transform:rotate(135deg);
	opacity:0;
	transition: all 0.3s ease-in-out 0s;
}
.mean-container .meanmenu-reveal.active span.bottom{ 
	transform:rotate(45deg);
	margin-top:-9px;
	transition: all 0.3s ease-in-out 0s;
}

/***********************/

span.br {
    display: inline;
}

#yebis_wrapper{
	min-width:0;
}
.title_why_yebis{
	min-width:0;
}

#top_menu {
	display:none;
	min-width:0;
}

#why_yebis{
	margin-top:50px;
}

.title_why_yebis{
	margin-top:70px;
}
.title_why_yebis .title_text img{
	width:70%;
}
.title_why_yebis .title_text2 img{
	width:100%;
}
#video_qc{
	margin-top:50px;
}
#video_qc .title_text{
	padding-top:50px;
}
#video_qc .title_text img{
	width:70%;
	max-width:330px;
}

.qc_content .qc_content1 .qc_content1_l,
.qc_content .qc_content1 .qc_content1_r,
.qc_content .qc_content2 .qc_content2_l,
.qc_content .qc_content2 .qc_content2_r,
.process_content .process_content1 .process_content1_l,
.process_content .process_content1 .process_content1_r,
.process_content .process_content2 .process_content2_l,
.process_content .process_content2 .process_content2_r{
	width:100%;
}

#featured_projects{
	margin-top:100px;
}
.projects_content li:first-child{
	width:49.5%;
}
.projects_content li{
	width:49.5%;
}

#plus_yebis{
	margin-top:100px;
	padding-bottom:100px;
}
#plus_yebis .title_text img{
	width:80%;
}
#production_process .title_text img{
	width:70%;
	max-width:330px;
}
body#en .foottop ul{
	height:auto;
}

#plus_yebis li div{
	width:60%;
}

.qc_content .title,
.process_content .title{
	margin-bottom:20px;
	margin-top:0px;
}
.qc_content .content,
.process_content .content{
	padding:0;
	line-height:28px;
}



#plus_yebis .title_text img{
	width:90%;
}
#plus_yebis .title_text img.sp{
	width:70%;
	margin:0 auto;
}

#video_qc .title_text,
#production_process .title_text,
#news .title_text{
	margin-bottom:50px;
}
#production_process{
	margin-top:100px;
}

#plus_yebis ul{
	width:90%;
}
#plus_yebis div p{
	font-size:14px;
}

#news .title_text img{
	width:70%;
}

.foottop ul{
	height:auto;
}

.foottop ul li:first-child,
.foottop ul li{
	padding:0 30px 10px 0;
}
.foottop ul li p{
	padding:0;
	margin:0;
}

.footbottom img{
	margin:0;
}
.footbottom .copyright{
	text-align:center;
	padding-bottom:10px;
	width:100%;
}

.corp_sns ul li:first-child{
	width:100%;
	/*text-align:center;*/
}

.corp_sns ul li:nth-child(2) p{
	padding-left:0px;
}
.corp_sns ul li:nth-child(4) p{
	padding-left:20px;
}

/*.qc_content .qc_content1 .qc_content1_l .qc_content1_l_content,
.qc_content .qc_content2 .qc_content2_r .qc_content2_r_content,
.process_content .process_content1 .process_content1_l .process_content1_l_content,
.process_content .process_content2 .process_content2_r .process_content2_r_content{
	padding:10% 5%;
}*/

#yebis_footer{
	min-width:0;
}

.news_content ul li{
	float:left;
	width:100%;
	background-color:#1E1E1E;
	margin-bottom:20px;
}
.news_content ul li:nth-child(2){
	margin:0 auto;
	margin-bottom:20px;
}

.news_content ul li a p.content{
	height:auto;
	padding-bottom:20px;
}
#why_yebis {
    margin-bottom: 50px;
}
#why_yebis_text p {
    font-size: 16px;
    line-height: 30px;
    letter-spacing: 1.5pt;
	text-align:left;
}

#toPageTop {
    bottom: 10px;
    right: 20px;
}


#why_yebis_text{
	padding-top:20px;
	width:85%;
}
.qc_content .qc_content1 .qc_content1_r{
	background-color:transparent;
}

/************Switch***************/
#yebis-for-Switch{
	margin-top:100px;
}
#yebis-for-Switch .cl,
#yebis-for-Switch .cr{
	float:left;
	width:100%;
	text-align:center;
}
#yebis-for-Switch .cr{
	margin-top:50px;
}




a:hover .goto-maya{
}
#toPageTop{
	bottom:70px;
}
.footbottom .copyright{
	padding-bottom:85px;
}


#middleware-link li:first-child{
	float:left;
	width:100%;
}
#middleware-link li:last-child{
	float:right;
	width:100%;
}

#middleware-link li:first-child{
	margin-bottom:50px;
}
#middleware-link .logo img{
	width:50%;
}
#middleware-link .view-first .logo{
	margin-top:15%;
}
#middleware-link .view-first:hover .logo{
	/*margin-top:70px;*/

   -webkit-transform: translateY(-40%);
   -moz-transform: translateY(-40%);
   -o-transform: translateY(-40%);
   -ms-transform: translateY(-40%);
   transform: translateY(-40%); 
   
   -webkit-transition: all 0.2s ease-in 0.0s;
   -moz-transition: all 0.2s ease-in 0.0s;
   -o-transition: all 0.2s ease-in 0.0s;
   -ms-transition: all 0.2s ease-in 0.0s;
   transition: all 0.2s ease-in 0.0s;
}

.view-first:hover h2,
.view-first:hover p,
.view-first:hover a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: translateY(20px);
   -moz-transform: translateY(20px);
   -o-transform: translateY(20px);
   -ms-transform: translateY(20px);
   transform: translateY(20px);
   
}
.view p{
	padding:3%;
}
/*#middleware-link .mask p{
	font-size:12px;
	line-height:1.5;
}*/

#middleware-link{
	padding-top:50px;
	padding-bottom:100px;
}
.view .mask, .view .content{
	position:relative;
}
.view-first .mask{
	height:auto;
	opacity:1;
	margin-top:0 !important;
}
.view-first p{
	opacity:1;
	transform:none !important;
}
#middleware-link .view-first:hover .logo{
	transform:none !important;
}
#middleware-link .view span{
	padding:10px 20px 10px 35px;
}

#toPageTop {
	display:none;
}

#maya_btn{
	display:none;
}
}

@media only screen and (min-width: 1px) and (max-width: 480px) {

.title_why_yebis .title_arrow img{
}
.da-thumbs li a div p.project_name span{
	font-size:12px !important;
	line-height:14px !important;
}
.da-thumbs li a div p.project_name{
	font-size:8px !important;
	margin-top:15%;
	padding:0 9%;
}

.da-thumbs li a div p.learn_more{
	margin-top:10px;
}
.da-thumbs li a div p.learn_more img{
	width:70%;
}

.qc_content1_l_content .title,
.qc_content .title, .process_content .title{
	margin-top:10px;
}
#yebis_footer{
	min-width:0;
}

#plus_yebis li div{
	height: 115px;
}

#why_yebis_text p {
    font-size: 14px;
    line-height: 28px;
    letter-spacing: 1.5pt;
}

#news{
	margin-top:0px;
	padding-bottom:50px;
}
#plus_yebis .title_text{
	margin-bottom:50px;
}

/*--------------------*/
#middleware-link .view-first:hover .logo{
	/*margin-top:70px;*/

   -webkit-transform: translateY(-130%);
   -moz-transform: translateY(-130%);
   -o-transform: translateY(-130%);
   -ms-transform: translateY(-130%);
   transform: translateY(-130%); 
   
   -webkit-transition: all 0.2s ease-in 0.0s;
   -moz-transition: all 0.2s ease-in 0.0s;
   -o-transition: all 0.2s ease-in 0.0s;
   -ms-transition: all 0.2s ease-in 0.0s;
   transition: all 0.2s ease-in 0.0s;
}

/*#middleware-link .mask p{
	font-size:11px;
	line-height:1.5;
}*/

.projects_content li:first-child{
	width:49.9%;
}
.projects_content li{
	width:50%;
}

/*-------------------- TOP BTN MAYA 20160205----------------------------------*/

#maya_btn{
	display:block;
	right:auto;
	bottom:0px !important;
	width:100%;
}
#maya_btn .close_btn{
	display:none;
}
#maya_btn .close_btn img{
}
#maya_btn .close_btn img{
}
#maya_btn .close_btn img:hover{
}
#maya_btn .maya_box{
	padding:10px 5%;
	width:90%;
}
#maya_btn .maya_box .maya_l {
	float:none;
}
#maya_btn .maya_box .maya_r {
	float:none;
	display:none;
}
#maya_btn .maya_box span{
	font-size:18px;
}
#maya_btn .maya_box p{
	width:50%;
	float:left;
}
#maya_btn a .goto-maya{
	width:45%;
	float:right;
	margin-top:1px;
	padding:7px 0;
}
#plus_yebis li div{
	width:80%;
}	
#share-sns li {
    display: block;
    width: 123px;
    text-align: left;
    margin: 0 auto;
    margin-bottom: 20px;
}

}

@media only screen and (min-width: 1px) and (max-width: 400px) {

#plus_yebis li div{
	height: 100px;
}

#maya_btn .maya_box span{
	font-size:16px;
}
}