@charset "utf-8";


.newsTx{
	text-align:center;
}

#indexContents h2,
#Features h2,
#About h2{
	text-align:center;
}
#Product-Service{
	margin:100px 0;
}
.Product-Service-Website{
	opacity:0;
	text-align:center;
	max-width:1200px;
	margin:0 auto;	
}
.Product-Service-Website.twoColum{
	max-width: 800px;
}
.Product-Service-Website img{
	max-width:373px;
	width:100%;
}
.Product-Service-Website div{
	text-align:center;
}
.Product-Service-Website .muramasa,
.Product-Service-Website .enlighten{
	width:400px;
	margin:0 auto;
	float: left;
	margin-left: 200px;
}
.Product-Service-Website .yebis{
	width:400px;
	margin:0 auto;
	float: left;
	margin-left: 200px;
}
.Product-Service-Website .mizuchi,
.Product-Service-Website .fantasica{
	width:400px;
	margin:0 auto;
	float: left;
}

.Product-Service-Website .wonderblocks{
	width:400px;
	margin:0 auto;
}
.Product-Service-Website .orochi{
	width:400px;
	margin:0 auto;
	float: left;
	margin-top: 30px;
}
.Product-Service-Website .automotive{
	width:400px;
	margin:0 auto;
	float: left;
	margin-left: 200px;
}
.Product-Service-Website .ss-agent{
	width:400px;
	margin:0 auto;
	float: left;
}
.Product-Service-Website .online{
	width:400px;
	margin:0 auto;
	float: left;
}
.Product-Service-Website .analytics{
	width:400px;
	margin:0 auto;
	float: left;
	margin-left: 200px;
}
.Product-Service-Website a div.logo-cover{
	width:373px;
	position:absolute;
	margin-top:-170px;
	margin-left:13.5px;
	transition: all 0.4s ease-in-out 0s;
}

.Product-Service-Website .according-middleware-sp{
	display:none;
}

.Product-Service-Website a:hover div.logo-cover{
	opacity:0;
	transition: all 0.4s ease-in-out 0s;
}
.Product-Service-Website a div.cover{
	width:373px;
	height:177px;
	opacity:0;
	background-color:rgba(0,0,0,0.7);
	position:absolute;
	margin-top:-177px;
	margin-left:13.5px;
	color:#FFF;
	transition: all 0.4s ease-in-out 0s;
}
.Product-Service-Website a:hover div.cover{
	opacity:1;
	transition: all 0.4s ease-in-out 0s;
}
.Product-Service-Website a div.cover .cover-btn-sp{
	display:none;
}
.Product-Service-Website a div.cover .cover-txt{
	height:100px;
	padding-top:20px;
	padding-left: 10px;
	padding-right: 10px;
	line-height: 1.5;
}
.online .cover-txt{
	font-size: 15px;
}
.Product-Service-Website .game-app a div.cover .cover-txt{
	display:none;
}
.Product-Service-Website a div.cover .cover-btn{
	height:50px;
}
.Product-Service-Website .game-app .wonderblocks a div.cover .cover-btn{
	margin-top:20px;
}

.Product-Service-Website .game-app a div.cover .cover-btn{
	margin-top:70px;
	height:50px;
}
.Product-Service-Website a div.cover .cover-btn span{
	background-image:url('/common/images/com_ic035.svg');
	background-repeat:no-repeat;
	background-position: left center;
	padding-left:18px;
}
.Product-Service-Website figure{
	margin-top:70px;
	margin-bottom:10px;
}
#Features{
	background-color:#f5f5f5;
	padding:90px 0;
	padding-bottom:150px;
	color:#333;
}
#Features #indexAboutContents{
	width:90%;
	max-width:1200px;
	margin:0 auto;
}
#Features .content{
	float:left;
	width:48.8%;
	margin-left:-50px;
	opacity:0;
}
#Features .illus{
	float:right;	
	width:48.8%;
}
#Features p.title{
	font-size:36px;
}
#Features p.txt{
	margin:15px 0;
}

#Features .btn{
	padding:15px;
	border:1px solid #333;
	max-width:450px;
	background-color:#FFF;
	background-image:url('/common/images/com_ic080.svg');
	background-repeat:no-repeat;
	background-position:95% center;
	background-size:34px 17px;
}
#Features .illus .innovation{
	width:400px;
	margin:0 auto;
}
#Features .illus .innovation div{
	position:absolute;
	/*opacity:0;*/
}
#Features .illus .innovation div.innovation-pic1{
	opacity:0;
	margin-top:30px;
}
#Features .illus .innovation div.innovation-pic2{
	opacity:0;
	margin-top:-30px;
}
#Features .illus .innovation div.innovation-pic3{
	opacity:0;
	margin-top:-30px;
}
#Features .illus .innovation div.innovation-pic4{
	opacity:0;
	margin-top:-30px;
}

#About{
	padding:140px 0;
	padding-bottom:160px;
	position:relative;
	display:block;
	z-index:0;
}
#About::before {
  content: "";
	background-image:url("/corporate/images/com_bg001.jpg");
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
  opacity: 0.5;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -1;   
}
#About ul{
	width:90%;
	max-width:1200px;
	margin:0 auto;
	margin-top:70px;
	opacity:0;
}
#About ul li a div{
	width:165px;
	text-align:center;
}
#About ul li a div span{
	margin-left:10px;
	font-size:14px;
	color: #a9a9a9;
}
a.btn-01a{
	border: 2px solid #333 !important;
	background-image:url("/common/images/newtop/arrows-btn_w.svg");
	background-size:auto 15px;
	background-position:90% center;
	background-repeat:no-repeat;
	transition: all 0.2s ease-in-out 0s !important;
}
a.btn-02a{
	border: 2px solid #333 !important;
	background-image:url("/common/images/newtop/arrows-btn.svg");
	background-size:auto 15px;
	background-position:90% center;
	background-repeat:no-repeat;
	transition: all 0.2s ease-in-out 0s !important;
}
a:hover.btn-01a{
	background-image:url("/common/images/newtop/arrows-btn.svg");
	background-position:92% center;
	transition: all 0.2s ease-in-out 0s !important;
}
a:hover.btn-02a{
	background-image:url("/common/images/newtop/arrows-btn_w.svg");
	background-position:92% center;
	transition: all 0.2s ease-in-out 0s !important;
}
a.btn-01a::after, a.btn-01b::after,
a.btn-02a::after, a.btn-02b::after{
	box-shadow:none !important;
}

@media only screen and (max-width: 1270px) {
.Product-Service-Website{
	max-width:800px;
}

#About .threeColumn a.btn-01a{
	padding-left:5em;
	padding-right:5em;
}
#Features{
	padding-bottom:90px;
}
	
.Product-Service-Website .enlighten,
.Product-Service-Website .wonderblocks,
.Product-Service-Website .yebis,
.Product-Service-Website .automotive,
.Product-Service-Website .muramasa,
.Product-Service-Website .analytics{
	margin-left: 0;
}
}

@media only screen and (max-width: 1100px) {
#About .threeColumn a.btn-01a{
	padding-left:4em;
	padding-right:4em;
}

#Features #indexAboutContents{
	width:90%;
	padding:50px 5%;
}
#Features .illus .innovation{
}
#contents .content .title span.br{
	/*display:inline;*/
}
#Features p.title{
	font-size:30px;
}
}

@media only screen and (max-width: 1000px) {
#About .threeColumn a.btn-01a{
	padding-left:3em;
	padding-right:3em;
}
}

/* ～960px For PC
================================ */
@media only screen and (max-width: 960px) {
	
#indexBiz h2{
	position:relative;
}
#indexService01 dt, #indexService02 dt, #indexService03 dt,
#indexBiz #indexRD dt{
	height:0 !important;
}

#Features .content{
	float:none;
	margin:90px auto;
	width:100%;
	text-align:center;
	margin-top:40px;
}
#Features .btn{
	margin:0 auto;
}
#Features .illus{
	float:none;
	margin:0 auto;
	width:90%;
	height:300px;
}
#Features .illus img{
}

}


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

.Product-Service-Website{
	max-width:350px;
}
.Product-Service-Website .enlighten,
.Product-Service-Website .wonderblocks,
.Product-Service-Website .mizuchi,
.Product-Service-Website .yebis,
.Product-Service-Website .orochi,
.Product-Service-Website .automotive,
.Product-Service-Website .muramasa,
.Product-Service-Website .fantasica,
.Product-Service-Website .ss-agent,
.Product-Service-Website .online,
.Product-Service-Website .analytics{
	width:350px;
	float: none;	
}
.Product-Service-Website .mizuchi{
	margin-top: 30px;
}
.Product-Service-Website .fantasica{
	margin-top: 50px;
}
.Product-Service-Website a div.logo-cover,
.Product-Service-Website a div.cover{
	width:350px;
	margin-left:0;
}
.Product-Service-Website .ss-agent a div.cover{
	width:350px;
	margin-left:0;
	height:166px;
	margin-top:-166px;
}
#About .threeColumn a.btn-01a{
	padding-left:2em;
	padding-right:2em;
}
.Product-Service-Website .automotive{
	float: none;
}
.Product-Service-Website .automotive{
	float: none;
}

}
@media only screen and (max-width: 800px) {
	
#About .threeColumn .col{
	width: 100% !important;
    float: none;
    text-align: center;
    margin-top: 20px;
}

#About .threeColumn a.btn-01a{
	padding: .9em 8em;
}
[class*="Column"] .col + .col{
	margin-left:0;
}

#About{
	padding-bottom:80px;
}
#Features{
	padding-bottom:90px;
}
}

@media only screen and (max-width: 700px) {
#About .threeColumn a.btn-01a{
	/*padding-left:4em;
	padding-right:4em;*/
}
}
@media only screen and (max-width: 600px) {
	
a.btn-01a{
	width:200px;
}

#Product-Service h2 img{
	/*width:300px;*/
}
#Features .content p{
	text-align:left;
}
#indexBiz h2{
	padding-left: 0;
	text-align: center;
}

}

@media only screen and (max-width: 450px) {
a.btn-02a,
a.btn-01a{
	padding:.9em 4em !important;
}
#Product-Service{
	margin-bottom:50px;
}
#Product-Service h2 img{
	/*width:90%;*/
	margin-bottom:10px;
}
#Features p.title{
	font-size:26px;
}
.Product-Service-Website{
	max-width:330px;
	opacity:1;
}
.Product-Service-Website .enlighten,
.Product-Service-Website .wonderblocks,
.Product-Service-Website .mizuchi,
.Product-Service-Website .yebis,
.Product-Service-Website .orochi,
.Product-Service-Website .fantasica{
	margin-top: 10px;
}
.Product-Service-Website .enlighten,
.Product-Service-Website .wonderblocks,
.Product-Service-Website .mizuchi,
.Product-Service-Website .yebis,
.Product-Service-Website .orochi,
.Product-Service-Website .muramasa,
.Product-Service-Website .fantasica,
.Product-Service-Website .automotive,
.Product-Service-Website .ss-agent,
.Product-Service-Website .yokozuna,
.Product-Service-Website .analytics,
.Product-Service-Website .online{
	max-width:330px;
}
.Product-Service-Website .enlighten div,
.Product-Service-Website .mizuchi div,
.Product-Service-Website .yebis div,
.Product-Service-Website .orochi div,
.Product-Service-Website .muramasa div,
.Product-Service-Website .fantasica div,
.Product-Service-Website .automotive div,
.Product-Service-Website .ss-agent div,
.Product-Service-Website .wonderblocks div,
.Product-Service-Website .yokozuna div,
.Product-Service-Website .analytics div,
.Product-Service-Website .online div{
	overflow:hidden;
}

.Product-Service-Website figure{
	margin-top:40px;
}
#Features .illus img{
	width:95%;
}
#Features{
	padding-bottom:50px;
}

#About{
	padding-top:90px;
	padding-bottom:50px;
}
/************************************/

.Product-Service-Website a div.logo-cover{
	width:330px;
	margin-top:-160px;
	position:relative;
}
.Product-Service-Website a div.cover{
	width:330px;
	position:relative;
	opacity:1;
	margin-top:0;
	color:#333333;
	background-color:#FFF;
	height:auto;		
}
.Product-Service-Website a div.cover .cover-btn.pc{
	display:none;
}

.Product-Service-Website a div.cover .cover-btn-sp{
	margin-top:20px;
	padding-left:30px;
	display:block;
	text-align:left;
	font-weight:bold;
	font-size:16px;
	background-image:url("/common/images/newtop/arrows.svg");
	background-repeat:no-repeat;
	background-position:left center;
	background-size:20px auto;
	text-overflow:ellipsis;
	white-space:nowrap;
	overflow:hidden;
}
.Product-Service-Website a div.cover .cover-txt{
	padding: 0;
	padding-top:10px;
	padding-bottom:0px;
	margin-bottom:0px;
	width: 100%;
	height:auto;
	text-align:left;
}
.Product-Service-Website .game-app a div.cover .cover-txt{
	display:block;
}

.Product-Service-Website a:hover div.logo-cover{
	opacity:1;
}

.Product-Service-Website div.line-up{
	border-top:1px dotted #cccccc;
	padding-top:50px;
	display:none;
}

.Product-Service-Website .according-middleware-sp{
	display:block;
	padding:10px;
	padding-left:30px;
	background-color:#333;
	color:#FFF;
	background-image:url("/common/images/newtop/plus.svg");
	background-repeat:no-repeat;
	background-position:15px center;
	background-size:16px auto;
	cursor:pointer;
}
.Product-Service-Website .according-middleware-sp.action{
	background-image:url("/common/images/newtop/minus.svg");
}
.Product-Service-Website .ss-agent a div.cover,
.Product-Service-Website .yokozuna a div.cover{
	margin-top:0;
	width:auto;
	height:auto;
}
.Product-Service-Website .according-middleware-sp.action .open{
	display:none;
}
.Product-Service-Website .according-middleware-sp .open{
	display:block;
}
.Product-Service-Website .according-middleware-sp.action .close{
	display:block;
}
.Product-Service-Website .according-middleware-sp .close{
	display:none;
}

#Features #indexAboutContents{
	width:90%;
	padding:0 5%;
}
#Features .content{
	width:100%;
	opacity:1;
	margin-bottom:50px;
}

#Features .illus .innovation div.innovation-pic1,
#Features .illus .innovation div.innovation-pic2,
#Features .illus .innovation div.innovation-pic3,
#Features .illus .innovation div.innovation-pic4{
	opacity:1;
	margin-top:0;
	width:80%;
}
#About ul{
	opacity:1;
}

#Features .illus{
	display:none;
}

}

@media only screen and (max-width: 340px) {
a.btn-02a,
a.btn-01a{
	padding:.9em 2em !important;
}
	
.Product-Service-Website{
	max-width: none;
	width: 90%;
}
.Product-Service-Website a div.cover,
.Product-Service-Website .enlighten,
.Product-Service-Website .wonderblocks,
.Product-Service-Website .mizuchi,
.Product-Service-Website .yebis,
.Product-Service-Website .orochi,
.Product-Service-Website .muramasa,
.Product-Service-Website .fantasica,
.Product-Service-Website .automotive,
.Product-Service-Website .ss-agent,
.Product-Service-Website .yokozuna,
.Product-Service-Website .analytics,
.Product-Service-Website .online{
	max-width: none;
	width: 100%;
}

}