@charset "utf-8";

@font-face {
    font-family: "Roboto Condensed";
    font-style: normal;
    font-weight: 400;
    src: local("Roboto Condensed Regular"), local("RobotoCondensed-Regular"), url("//themes.googleusercontent.com/static/fonts/robotocondensed/v9/Zd2E9abXLFGSr9G3YK2MsFzqCfRpIA3W6ypxnPISCPA.woff") format("woff");
}

.topMainBg{
}
#indexSub{
	background-color: #f5f5f5;
}
#indexSubContents{
	max-width: 980px;
	margin: 0 auto;
	padding-left: 0;
	padding-right: 0;
	background-color: inherit;
}

#indexMainVisual{
	background: none;
	height: 750px;
}

#indexNews{
	float: none;
	width: 100%;
}
h1#indexMainVisualText{
	letter-spacing: 1;
	font-size: 40px;
	width: auto;
	top: 27%;
	opacity: 0;
	z-index: 150;
}
h1#indexMainVisualText span.newyear{
	font-size: 30px;
	display: inline-block;
}
#indexMainVisual .subText{	
	font-size: 20px;
	font-weight: lighter;
	font-family: "Roboto Condensed";
	text-shadow: 0 0 8px #000;
	top: 36%;*/ /* defalt  */
	/*top: 46% !important;*/ /* newyear  */
	opacity: 0;
	z-index: 150;
	position: absolute;
	width: 100%;
}

.top-slide-bg.slick-slider{
	position: absolute;
	top: -10%;
	width: 100%;
}
.top-slide-bg .pc{
	display: block;
	max-width: none;
	width: 100%;
}
.top-slide-bg .sp{
	display: none;
}
#bgvid {
    z-index: 0;
    bottom: 0px;
    min-height: 100%;
    min-width: 100%;
    position: absolute;
    right: 0;
    width: auto;
    height: auto;
    /*background: url("/middleware/mizuchi/images/video_bg.jpg") no-repeat;
        background-position-x: 0%;
        background-position-y: 0%;
        background-size: auto;
    background-position: center bottom;
    background-size: 100% auto;*/
    transition: 1s opacity;
}
.top-slide-nav.slick-slider{
	position: absolute;
	right: 100px;
	top: 511px;
	width: 750px;
	color: #FFF;
	cursor: pointer;
	outline: none;
	transition: all 0.3s ease-in-out 0s;
}
.topics.slider .slick-track{
	margin-bottom: 0px !important;
}
#indexMainVisual .slick-list{
	height: 1000px;
}
.slide-title{
	height: 154px;
	width: 871px;
	padding: 25px 40px;
	color: #FFF;
	background-color: rgba(0,0,0,0.4);
	position: absolute;
	top: 586px;
	top: 586px !important;
	left: 50px;
	z-index: 1;
}
/*
.slide-title{
	top: 511px !important;
}
*/
#indexContents .slide-title h2{
	text-align:left;
}
.slide-title h2.titleJp{
	font-size: 28px;
	font-weight:bold;
	padding:2px 0 7px 0;
}
.slide-title h2.titleEn{
	font-family: 'Roboto', sans-serif;
	font-size: 32px;
}
.slide-title h2.titleEnCond{
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 32px;
}
/*.slide-title p .title{
	display: block;
	font-weight: bold;
	font-size: 30px;
}*/
.slide-title .content{
	float: left;
	text-align: left;
	width: 67%;
	word-break:break-all;
}
.slide-title p{
	font-size: 18px;
	float: left;
	text-align: left;
	width: 100%;
	word-break:break-all;
	
	display: -webkit-box;
	-webkit-line-clamp:2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
a .slide-title .btn div{
	padding: 10px 70px;
	color: #fff;
	border: 2px solid #FFF;
	float: right;
	margin-top: 35px;
	transition: all 0.3s ease-in-out 0s;
	background-image: url("/common/images/newtop/arrows-btn_w.svg");
	background-position: 90% center;
	background-repeat: no-repeat;
	background-size: auto 15px;
	
}
a .slide-title .btn div.iconBlank{
	background-image: url("/common/images/com_ic035_w.svg");
	background-size: 15px auto;
	
}
a .slide-title.automotive .btn div,
a .slide-title.cgdata .btn div,
a .slide-title.mizuchi .btn div{}



a .slide-title .btn div.btnP50{
	padding:10px 50px;
}
a:hover .slide-title .btn div{
	background-color: #FFF;
	color: #000;
	transition: all 0.3s ease-in-out 0s;
	background-image: url("/common/images/newtop/arrows-btn.svg");
	background-position: 92% center;
}
a:hover .slide-title .btn div{
	background-image: url("/common/images/com_ic035_off.svg");
}
.slide-nav-bg{
	padding: 25px;
	padding-bottom: 15px;
	background-color: rgba(0,0,0,0.4);
	transition: all 0.3s ease-in-out 0s;
}
.slide-nav-bg:hover{
	box-shadow:0 -3px 0 0 #eb6100 inset;
	background-color: rgba(255,255,255,1);
	transition: all 0.3s ease-in-out 0s;
}
.top-slide-nav a{
	color: #fff;
}
.top-slide-nav a:hover{
	color: #eb6100;
}


.top-slide-nav .slick-next{
	background-color: rgba(0,0,0,0.4);
	top: 0;
	right: -51px;
	transform: none;
	width: 50px;
	height: 204px;
	background-image: url("/common/images/com_ic041-w1.svg");
	transition: all 0.3s ease-in-out 0s;
}
.top-slide-nav .slick-next:hover{
	opacity: 0.8;
	transition: all 0.3s ease-in-out 0s;
}
.top-slide-nav .slick-prev{
	background-color: rgba(0,0,0,0.4);
	top: 0;
	left: -51px;
	transform: none;
	width: 50px;
	height: 204px;
	background-image: url("/common/images/com_ic040-w1.svg");
}
.top-slide-nav .slick-prev:hover{
	opacity: 0.8;
	transition: all 0.3s ease-in-out 0s;
}

.top-slide-nav .slick-current{
	box-shadow:0 -3px 0 0 #FFF inset;
	transition: all 0.3s ease-in-out 0s;
}
.slick-slide p.info-detail{
	margin-top: 10px;
}

.top-slide-bg .pc,
.top-slide-bg .sp{
	display: none;
}

.CopyOnBG{
	position: absolute;
	top: 90px;
	right: 47px;
	font-size: 10px;
	text-align:right;
	font-family: 'Noto Serif', serif;
	color:#000;
}
.CopyOnBG.wh{
	color:#FFF;
}

.logoOnBG{
	position:absolute;
	top:420px;
	left:48px;
}

.logoOnBG.ssa-logo img{
	max-width: 200px;
}
/* share-sns */
#share-sns{
	text-align: center;
	margin-bottom: 50px;
}
#share-sns p{
	margin-bottom: 20px;
}
#share-sns li{
	line-height: 40px;
	display: inline;
	margin-right: 20px;
}
#share-sns li a:hover{
	opacity: 0.8;
}

#share-sns li:last-child{
	margin-right: 0;
}
#share-sns li img{
	height: 45px;
	width: 45px;
}
#share-sns li span{
	margin-left: 10px;
	font-size: 14px;
}
#share-sns li.sp{
	display: none;
}

/* indexSubContentsTopics */
.slick-track{
	height: auto !important;
}
#indexSubContentsTopics{
	opacity: 0;
	padding-top: 70px;
	padding-bottom: 70px;
	border-top: 1px dotted #ccc !important;
	border-bottom: 1px dotted #ccc !important;
}
#indexSubContentsTopics h2{
	margin-bottom: 30px;
}
#indexSubContentsTopics h2 img{
	max-width: 104px;
}
#indexSubContentsTopics .topics.slider div.slick-slide{
	margin-right: 10px;
	margin-left: 10px;
	height: auto;
}
#indexSubContentsTopics .topics.slider .slick-prev{
	/*display: none !important;*/
	background-color: rgba(0, 0, 0, 0.4);
    background-image: url("/common/images/com_ic040-w1.svg");
    height: 50px;
    left: 10px;
    transform: none;
	transition: all 0.3s ease-in-out 0s;
    width: 50px;
	z-index: 1;
} 
#indexSubContentsTopics .topics.slider .slick-next{
    background-color: rgba(0, 0, 0, 0.4);
    background-image: url("/common/images/com_ic041-w1.svg");
    height: 50px;
    right: 8px;
    transform: none;
	transition: all 0.3s ease-in-out 0s;
    width: 50px;
}

#indexSubContentsTopics .mask{
	overflow: hidden;
	transition: all 0.3s ease-in-out 0s;
}
#indexSubContentsTopics a .mask img{
	transition: all 0.3s ease-in-out 0s;
}
#indexSubContentsTopics a:hover .mask img{
	transform: scale(1.1,1.1);
	transition: all 0.3s ease-in-out 0s;
}

#indexSubContentsTopics .contents{
	font-size: 15px;
	background-color: #FFF;
	padding: 15px 25px;
}
#indexSubContentsTopics a:hover .contents{
	color: #FFF;
	background-color: #333333;
	transition: all 0.3s ease-in-out 0s;
}
#indexSubContentsTopics .contents .title{
	font-size: 16px;
}
#indexSubContentsTopics .contents .title.middleware{
	color: #5e9de3;
}
#indexSubContentsTopics .contents .title.game{
	color: #dfa535;
}
#indexSubContentsTopics .contents .title.ssa{
	color: #c52b7b;
}
#indexSubContentsTopics .contents .title.rd,
#indexSubContentsTopics .contents .title.blog{
	color: #919191;
}
#indexSubContentsTopics .contents .title.media{
	color: #14b29b;
}
#indexSubContentsTopics a .contents .txt{
	font-size: 14px;
	color: #333;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;	
	word-break:break-all;
	transition: all 0.3s ease-in-out 0s;
}
#indexSubContentsTopics a:hover .contents .txt{
	color: #FFF;
	transition: all 0.3s ease-in-out 0s;
}
#indexSubContentsTopics .according-topics-sp{
	display: none;
}
#indexSubContentsTopics .according-topics-sp .close{
	display: none;	
}

/* indexSubContentsBlog */

#indexBlog{   
	opacity: 0;
	max-width: 1920px;
    margin: 0 auto;
    padding: 0 50px;
	background-color: #e8e8e8;
}
#indexSubContentsBlog {
    /*opacity: 0;*/
    padding-top: 70px;
    padding-bottom: 70px;
	margin: 0 auto;
}
#indexSubContentsBlog h2{
	margin-bottom: 30px;
}
#indexSubContentsBlog h2 img{
	max-height: 39px;
}
#indexSubContentsBlog h2 a{
	display: inline-block;
    margin-left: 20px;
	margin-bottom: 7px;
    font-size: 14px;
}
#indexSubContentsBlog .blogSubTitle{
	text-align: center;
	font-size: 18px;
    padding-bottom: 20px;
}
#indexSubContentsBlog .blog-content{
	float: left;
	width: 25%;
	padding: 0 10px;
	box-sizing: border-box;
	overflow: hidden;
}
#indexSubContentsBlog .blog-wrapper{
	padding: 15px;
	border: 1px solid #e8e8e8;
	transition: all 0.3s ease-in-out 0s;
}
#indexSubContentsBlog a:hover .blog-wrapper{
	background-color: #FFF;
	border: 1px solid #eb6100;
	transition: all 0.3s ease-in-out 0s;
}
#indexSubContentsBlog .blog-content img{
	width: 100%;
	box-sizing: border-box;
}
#indexSubContentsBlog p.title{
	margin-top: 10px;
	display: -webkit-box;
	-webkit-line-clamp:2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 16px;
	font-weight: bold;
	transition: all 0.3s ease-in-out 0s;
}
#indexSubContentsBlog p.blogTime{
	margin-top: 5px;
	font-size: 14px;
	color: #888;
	transition: all 0.3s ease-in-out 0s;
}
#indexSubContentsBlog p.description{
	margin-top: 5px;
	font-size: 14px;
	display: -webkit-box;
	-webkit-line-clamp:3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	color: #444;
	transition: all 0.3s ease-in-out 0s;
}
#indexSubContentsBlog a:hover .blog-wrapper p.blogTime{
	color: rgba(235,97,0,0.7);
	transition: all 0.3s ease-in-out 0s;
}#indexSubContentsBlog a:hover .blog-wrapper p.title,
#indexSubContentsBlog a:hover .blog-wrapper p.description{
	color: #eb6100;
	transition: all 0.3s ease-in-out 0s;
}

/* Product-Service */
#Product-Service{
	opacity: 0;
}
/* SearchByPurpose */
#SearchByPurpose{
	max-width: 2020px;
	margin-top: 70px;
}
#SearchByPurpose h2{
	font-size: 28px;
	margin-bottom: 20px;
}

#SearchByPurpose ul li{
	font-size: 18px;
	text-align: center;
	float: left;
	width: 32.8%;
	margin-bottom: 0.8%;
	margin-right: 0.8%;
}
#SearchByPurpose ul li:nth-child(3n){
	margin-right: 0;
}

#SearchByPurpose ul li a div{
	background-image: url("/common/images/newtop/arrows-btn.svg");
	background-position: 95% center;
	background-size: auto 15px;
	background-repeat: no-repeat;
	background-color: #f5f5f5;	
	padding: 15px 0;	
	transition: all 0.3s ease-in-out 0s;
}
#SearchByPurpose ul li a:hover div{
	background-image: url("/common/images/newtop/arrows-btn_w.svg");
	background-color: #333333;
	color: #FFF;
	background-position: 97% center;
	transition: all 0.3s ease-in-out 0s;
}
#SearchByPurpose ul li a div.iconBlank{	
	background-image:url(/common/images/com_ic035_off.svg);
}
#SearchByPurpose ul li a:hover div.iconBlank{	
	background-image:url(/common/images/com_ic035_w.svg);
}

/* トップページの製品サービスのところの日本語画像テキストをただのテキストに変更 */
/* indexService */
#indexService h2 img{
	max-width: 304px;
}
#indexService h3{
	font-size: 28px;
	margin-top: 70px;
	margin-bottom: 40px;
	padding-top: 10px;
	
	text-align: center;
}
#indexService h3 a{
	margin-left: 20px;
	margin-top: -20px;
	font-size: 14px;
	padding: 10px 30px;
	padding-right: 40px;
	border: 1px #333 solid !important;
	background-image: url("/common/images/newtop/arrows-btn.svg");
	background-position: 95% center;
	background-size: auto 10px;
	background-repeat: no-repeat;
	transition: all 0.3s ease-in-out 0s;
	
}

#indexService h3 a:hover{
	background-image: url("/common/images/newtop/arrows-btn_w.svg");
	background-color: #333333;
	color: #FFF;
	background-position: 97% center;
	transition: all 0.3s ease-in-out 0s;
}
#indexService h3 span.txt{
	vertical-align: middle;
}
#indexService p{
	color: #000;
	font-size: 18px;
	letter-spacing: -0.5px;
	line-height: 1.5;
	text-shadow: 0px 0px 2px #fff,0px 0px 4px #fff;
	transition: all 0.3s ease-in-out 0s;
}
#indexService a:hover p{
	text-decoration: none;
	color: #000;
	display: none;
	transition: all 0.3s ease-in-out 0s;
}
#indexService p.txt-w{
	color: #FFF;
	text-shadow: 0px 0px 2px #000,0px 0px 4px #000;
	transition: all 0.3s ease-in-out 0s;
}
#indexService a:hover p.txt-w{
	color: #FFF;
	display: none;
	transition: all 0.3s ease-in-out 0s;
}
#indexService p span{
	display: block;
}
#indexService #indexService07 p{
}
#indexBiz dd a strong > span{
	font-size: 18px;
}
#indexNewsList li a{
	font-size: 16px;
}


/**** GOTO BTN ****/
#gotoProduct,
#gotoNews,
#gotoBlog{
	text-align: center;
}
#gotoNews,
#gotoBlog{
	margin-top: 30px;
}
.btn01 {
  border: 1px solid #333;
  z-index: 1;
	color: #FFF !important;
}
.btn01:after {
  position: absolute;
  content: "";
  width: 0;
  height: 100%;
  top: 0;
  right: 0;
  z-index: -1;
  background: #FFF;
  transition: all 0.2s ease;
}
.btn01.play {
  color: #333 !important;
}
.btn01.play:after{
  left: 0;
  width: 100%;
}

.custom-btn {
  padding: 15px 35px 15px 25px;
  background: #333;
  outline: none !important;
  transition: all 0.1s ease;
  position: relative;
  display: inline-block;
	box-sizing: border-box;
	width: 90%;
	max-width: 350px;
	text-align: center;
	font-size: 18px;
}
.custom-btn div {
    background-image: url(/common/images/newtop/arrows-btn_w.svg);
    background-repeat: no-repeat;
    background-position: 100% center;
    background-size: 12px auto;
}
.custom-btn.play div{
    background-image: url(/common/images/newtop/arrows-btn.svg);
}

.custom-btn div.iconBlank {
    background-image: url(/common/images/com_ic035_w.svg);
    background-size: 15px auto;
}
.custom-btn.play div.iconBlank{
    background-image: url(/common/images/com_ic035_off.svg);
}
/*#indexService #indexService06 p,
#indexService #indexService05 p{
	padding-top: 10px;
}

/* ～1750px For PC
================================ */
@media only screen and (max-width: 1750px) {
	.slide-title{
		padding: 20px 40px;
		height: 184px;
		top: 566px !important;
	}
	.top-slide-nav.slick-slider{
		top:491px;
	}
	.top-slide-nav .slick-next,
	.top-slide-nav .slick-prev{
		height: 224px;
	}
	.slide-title .content,
	.slide-title p{
		float: none;
		width: 100%;
	}
	.slide-title .btn a div{
		float: none;
		margin-top: 10px;
		width: 200px;
	}
	.slide-nav-bg{
		padding: 35px 25px;
		padding-bottom: 25px;
	}
	
	a .slide-title .btn div{
		margin-top: 10px;	
	}
	
}
/* ～1550px For PC
================================ */
@media only screen and (max-width: 1550px) {
	.top-slide-nav.slick-slider{
		width: 550px;
	}
	.top-slide-nav .slick-prev{
		width: 40px;
		left: -41px;
	}
	.top-slide-nav .slick-next{
		width: 40px;
		right: -41px;
	}
	.CopyOnBG{
		right: 59px;
	}
	.slide-nav-bg{
		padding: 35px 15px;
		height: 154px !important;
	}
	.slick-slide p.info-detail{
		font-size: 14px;
	}
}

/* ～1450px For PC
================================ */
@media only screen and (max-width: 1450px) {
	.top-slide-bg.slick-slider{
		top: auto;
	}
	.slide-title,
	.top-slide-nav.slick-slider{
		top: 485px !important;
	}
	.CopyOnBG{
		top: 10px;
	}
	.logoOnBG{
		width:300px;
		top:340px;
	}/* SearchByPurpose */
	#SearchByPurpose ul li a div{
		padding: 15px 3%;
		padding-right: 30px;
		font-size: 16px;
		text-overflow: ellipsis;
		white-space: nowrap;
		overflow: hidden;
	}

}
/* ～1350px For PC
================================ */
@media only screen and (max-width: 1350px) {
	#indexMainVisual{
		/*height: auto;*/
	}
	.top-slide-bg.slick-slider{
		position: relative;
	}
	.slide-title,
	.top-slide-nav.slick-slider{
		top: 465px !important;
	}
	.slide-title p{
		font-size: 16px;
	}
	

	
}
/* ～1300px For PC 
================================ */
@media only screen and (max-width: 1300px) {
	/*.slide-title,
	.top-slide-nav.slick-slider{
		top: 445px;
	}*/	
	.slide-title h2.titleEnCond.bdfe{
		font-size: 28px;
	}
	.logoOnBG{
		top:330px;
		
	}
}

/* ～1250px For PC
================================ */
@media only screen and (max-width: 1250px) {
	/*.slide-title p .title{
		font-size: 24px;
	}*/
	.slide-title p{
		font-size: 18px;
	}
	.slide-title{
		left: 30px;
		padding: 13px 40px 27px;
	}
	.top-slide-nav.slick-slider{
		width: 400px;
		right: 70px;
	}
	.slide-nav-bg{
		height: 135px !important;
	}
	.slide-title{
		height: 165px;
	}
	.top-slide-nav .slick-next,
	.top-slide-nav .slick-prev{
		height: 205px;
	}
	
	.CopyOnBG{
		right: 27px;
	}
	.logoOnBG{
		top:300px;
		left:30px;
	}
}

@media only screen and (max-width: 1200px) {
	.logoOnBG{
		top: 290px;
    	width: 260px;
	}
}

@media only screen and (max-width: 1150px) {
	.logoOnBG{
		top: 275px;
    	width: 250px;
	}
}

/* ～1100px For PC
================================ */
@media only screen and (max-width: 1100px) {
	.slide-title{
		padding: 15px 40px 25px;
	}
	.slide-title h2.titleJp{
		font-size: 24px;
	}
	.slide-title h2.titleEn{
		font-size: 28px;
	}
	.slide-title h2.titleEnCond{
		font-size: 28px;
	}
	.slide-title h2.titleEnCond.bdfe{
		font-size: 25px;
	}
	.CopyOnBG{
		top: 20px;
	}
	.logoOnBG{
		top: 250px;
    	width: 220px;
	}
}
/* ～1000px For PC
================================ */
@media only screen and (max-width: 1050px) {
	.CopyOnBG{
		top: 10px;
	}
	.logoOnBG{
	top: 240px;
    width: 200px;
	}
}
/* ～1000px For PC
================================ */
@media only screen and (max-width: 1000px) {
	.slide-title h2.titleJp.ssa{
	font-size: 21px;
	}
	.slide-title h2.titleEnCond.bdfe{
	font-size: 21px;
	}	
}

/* ～780px For Tablet 縦
================================ */
@media only screen and (max-width: 980px) {

	#indexMainVisual,#indexMainVisual .slick-list,
	.slick-track{
		height: 750px;
	}
	
	#bgvid {
		width: auto;
		height: 100%;
	}
	h1#indexMainVisualText{
		left: 0;
		text-align: center;
	}
	h1#indexMainVisualText span.newyear{
		font-size: 22px;
		display: inline-block;
	}
	#indexMainVisual .subText{
		position: absolute;
		width: 100%;
		/*top: 58% !important;*/ /* newyear  */
	}
	#indexContents .slide-title h2{
	}	
	#indexContents .slide-title h2 span{
		padding-right: 30px;
		background-image: url("/common/images/newtop/arrows-btn_w.svg");
		background-position: 100% center;
		background-repeat: no-repeat;
		background-size: auto 18px;
	}
	#indexContents .slide-title h2 span:after{
		
	}
	.top-slide-bg.slick-slider{
		position: relative;
	}
	.slide-title{
		top: auto !important;
		bottom: 0;
		width: 90%;
		padding: 3% 5%;
		left: auto;
		height: auto;
	}
	.slide-title h2.titleJp.ssa{
	font-size: 24px;
	}
	.slide-title h2.titleEnCond.bdfe{
	font-size: 28px;
	}
	.top-slide-nav.slick-slider{
		position: relative;
	}
	.slide-title .content{
		float: none;
		width: 100%;
		height: 100px;
	}
	.slide-title p{
		float: none;
		width: 100%;
	}
	.slide-title .content a{
		position: absolute;
		width: 90%;
		height: 100px;
		z-index: 999;
	}
	.slide-title .btn{
		display: none;
	}
	.slide-title .btn a div{
		float: none;
		margin-top: 20px;
	}
	/*.slick-initialized .slick-slide,*/
	.top-slide-nav,
	.top-slide-nav.slick-slider{
		display: none !important;
	}
	/*.slide-title p .title{
		font-size: 26px;
		line-height: 1.5;
	}*/
	.slide-title p{
		font-size: 15px;
	}	
	
	.top-slide-nav .slick-next,
	.top-slide-nav .slick-prev{
		display: none;
	}
	.slick-track{
		margin-bottom: 0 !important;
	}
	.slide-nav-bg{
		padding: 20px 5px;
		padding-bottom: 10px;
		height: auto !important;
	}
	.CopyOnBG{
		top: 20px;
		right: 20px;
	}
	.logoOnBG{
		top: 20px;
    	width: 30%;
    	left: 4%;
	}

	/* SearchByPurpose */
	#SearchByPurpose ul li{
		width: 49.6%;	
		font-size: 16px;
	}	
	#SearchByPurpose ul li:nth-child(3n){
		margin-right: 0.8%;
	}	
	#SearchByPurpose ul li:nth-child(2n){
		margin-right: 0;
	}
	#SearchByPurpose ul li a div{
		padding-left: 5%;
		padding-right: 10%;
	}

}

/* ～640px For Tablet 縦
================================ */
@media only screen and (max-width: 640px) {
	#indexMainVisual,#indexMainVisual .slick-list,
	.slick-track{
		height: 350px;
	}
	.CopyOnBG{
	top: 6px;
	right: 0px;
	font-size:10px;
	-webkit-transform:scale(0.7);
	-moz-transform:scale(0.7);
	-ms-transform:scale(0.7);
	-o-transform:scale(0.7);
	transform:scale(0.7);
	}
	.CopyOnBG.cptr{
		right: -8px !important;
	}
	.CopyOnBG.cpbd{
		right: -24px !important;
		color:#FFF;
		text-shadow: 0 0 3px #000;
	}
	.logoOnBG{
	top: 5px;
	}
	h1#indexMainVisualText{
		font-size: 34px;
		/*
		font-size: 6.4vw;
		letter-spacing: 0.08em;
		*/ /* newyear  */
	}
	h1#indexMainVisualText span.newyear {
		font-size: 4.27vw;
	}
	#indexMainVisual .subText{
		font-size: 18px;
	}
	.slide-title h2.titleJp{
	font-size: 20px;
	}
	.slide-title h2.titleEn{
	font-size: 24px;
	}
	.slide-title h2.titleEnCond{
	font-size: 24px;
	}
	.slide-title h2.titleJp.ssa{
	font-size: 20px;
	}
	.slide-title h2.titleEnCond.bdfe{
	font-size: 21px;
	}
	
/* トップページの製品サービスのところの日本語画像テキストをただのテキストに変更 */
/* indexService */
#indexService p,
#indexService #indexService06 p,
#indexService #indexService05 p{
	font-size: 25px;
	text-align: left;
	padding-left: 30px;
	padding-top: 10%;
}
	
#indexService a:hover p,
#indexService a:hover p.txt-w{
	display: block;
}
#indexService p span{
	display: inline;
}

	#indexSubContents{
		padding: 30px 0 !important;
	}
	#gotoNews{
		margin-top: 10px;
		margin-bottom: 50px;
	}
	/* SearchByPurpose */
	#SearchByPurpose{
		padding-left: 0;
		padding-right: 0;
		width: 100%;
		margin-left: auto;
		margin-right: auto;
	}
	#SearchByPurpose ul li{
		width: 100%;		
		font-size: 16px;
		margin-bottom: 10px;
	}
	
}

/* ～600px For Tablet 縦
================================ */
@media only screen and (max-width: 600px) {
/* トップページの製品サービスのところの日本語画像テキストをただのテキストに変更 */
/* indexService */
#indexService p{
	font-size: 22px;
}
}
/* ～550px For Tablet 縦
================================ */
@media only screen and (max-width: 550px) {
/* トップページの製品サービスのところの日本語画像テキストをただのテキストに変更 */
/* indexService */
#indexService p,
#indexService #indexService06 p,
#indexService #indexService05 p{
	font-size: 18px;
}
}

/* ～480px For SP
================================ */
@media only screen and (max-width: 480px) {
	
	h1#indexMainVisualText{
		left: 0;
		font-size: 20px;
		top: 35%;
		text-shadow: 0 0 4px #000;
	}
	#indexMainVisual .subText{
		font-size: 12px;
		top: 45%;
		text-shadow: 0 0 3px #000;
	}
	#indexService h2{
		margin-bottom: 10px;
	}
	.slide-title{
		padding:3% 5% 0%;
		top: auto !important;
	}
	.slick-slide p.info-detail{
		display: none;
	}
	.slide-title h2.titleJp{
	font-size: 18px;
	}
	.slide-title h2.titleEn{
	font-size: 21px;
	}
	.slide-title h2.titleEnCond{
	font-size: 21px;
	}
	.slide-title h2.titleJp.ssa{
	font-size: 18px;
	}
	.slide-title h2.titleEnCond.bdfe{
	font-size: 21px;
	}
	/*.slide-title p .title{
		font-size: 22px;
	}*/
	.slide-title p{
		font-size: 14px;
	}
	
	.top-slide-nav .pc{
		display: none;
	}
	.top-slide-nav .sp{
		display: block;
	}

/* トップページの製品サービスのところの日本語画像テキストをただのテキストに変更 */
/* indexService */
#indexService p,
#indexService #indexService06 p,
#indexService #indexService05 p{
	padding-top: 9%;
	font-size: 14px;
}
#indexService p span{
}
	#indexService h3{
		font-size: 24px;
		margin-top: 50px;
		margin-bottom: 20px;
		padding-top: 0;
	}
#indexService h3 span.txt{
	display: block;
}
	#indexService h3 a{
		margin-left: 0;
	}
	
#indexService h2 img{
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 10px;
	max-width: 304px;
	width: 85%;
}
/* indexSubContentsBlog */
	#indexSubContentsBlog{
		margin-bottom: 50px;
		padding-bottom: 30px;
	}
#indexSubContentsBlog .blog-content {
	float: none !important;
	width: 100% !important;
	height: auto !important;
	margin: 0 auto;
	margin-bottom: 10px;
}
#indexSubContentsBlog .blog-content .mask{
	height: 170px !important;
}
	#indexSubContentsBlog .blog-content a:hover .contents{
		margin-top:auto !important;
	}
	#indexSubContentsBlog .blog-content .contents{
		height: auto !important;
		padding: 10px 0 !important;
		color: #333;
		background-color: inherit;
	}
	#indexSubContentsBlog p .title{
		font-size: 16px;
	}
	#indexSubContentsBlog .blog-content .contents p,#indexSubContentsBlog .blog-content.second .contents p, #indexSubContentsBlog .blog-content.third .contents p{
    display: -webkit-box;
    -webkit-line-clamp:  3;
    -webkit-box-orient: vertical;
    overflow: hidden;
	height: auto;
}
	#SearchByPurpose ul li a div{
		text-align: left;
	}
	#indexNewsList li a{
		font-size:14px;
	}
	
	#gotoBlog{
		margin-top: 10px;
		margin-bottom: 30px;
	}
	
}

/* ～480px For SP
================================ */
@media only screen and (max-width: 450px) {
	#share-sns li{
		display: block;
		width: 123px;
		text-align: left;
		margin: 0 auto;
		margin-bottom: 20px;
	}
	#share-sns li.pc{
		display: none;
	}
	#share-sns li.sp{
		display: block;
	}
	#share-sns li:last-child{
		margin-right: auto;
	}
	#indexSubContentsTopics{
		padding-left: 20px;
		padding-right: 20px;
		margin-left: auto;
		margin-right: auto;
		margin-top: 30px;
	}
	#indexSubContentsTopics .topics-content{
		margin-bottom: 20px;
		border-top:1px dotted #cccccc;
		padding-top:20px;
	}
	#indexSubContentsTopics .topics-content.first{
		padding-top: 0;
		border-top: none;
	}
	#indexSubContentsTopics .contents{
		height: auto;
	}

div.line-up{
	display:none;
}

#indexSubContentsTopics .according-topics-sp{
	text-align: center;
	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;
}
#indexSubContentsTopics .according-topics-sp.action{
	background-image:url("/common/images/newtop/minus.svg");
}
	
#indexSubContentsTopics .according-topics-sp.action .open{
	display: none;
}	
#indexSubContentsTopics .according-topics-sp.action .close{
	display: block;
}
	
#indexBlog{   
	opacity: 1;
	width: 100%;
	padding: 0;
	}

#indexSubContentsBlog .blogSubTitle{
	text-align: left;
	font-size: 14px;
	width: 90%;
	margin:0 auto;
}
	
}

/* ～400px For Tablet 縦
================================ */
@media only screen and (max-width: 400px) {
/* トップページの製品サービスのところの日本語画像テキストをただのテキストに変更 */
/* indexService */
#indexService p,
#indexService #indexService06 p,
#indexService #indexService05 p{
	padding-left: 20px;
	font-size: 14px;
}
}

/* ～350px For SP
================================ */
@media only screen and (max-width: 370px) {
	
	h1#indexMainVisualText{
		font-size: 17px;
	}
	#indexMainVisual .subText{
		font-size: 11px;
	}
	.slide-title{
		padding:3% 5% 0%;
	}
	.slide-title h2.titleJp{
		font-size: 16px;
	}
	.slide-title h2.titleEn{
		font-size: 19px;
	}
	.slide-title h2.titleEnCond{
		font-size: 19px;
	}
	.slide-title h2.titleJp.ssa,
	.slide-title h2.titleJp.analytics{
		font-size: 16px;
	}
	.slide-title h2.titleEnCond.bdfe{
		font-size: 18px;
	}
	.slide-title p{
		font-size:13px;
	}
/* トップページの製品サービスのところの日本語画像テキストをただのテキストに変更 */
/* indexService */
#indexService p{
	font-size: 13px;
}
	
	/*#SearchByPurpose ul li{
		padding-left: 10%;
		padding-right: 10%;
	}*/
	
}

