@media screen and (max-width: 1180px) {
	#main{
		width:100%;
		overflow:hidden;
	}
	
	#main .visual{
		width:100%;
		background:#0c0c0c;
		padding:200px 0px 100px;
		box-sizing:border-box;
	}
	
	
	#main .visual .tit{
		text-align:center;
		color:#fff;
		font-size:110px;
		font-weight:900;
		font-family:'montserrat';
	}
	
	#main .visual .subTit{
		text-align:center;
		color:#fff;
		font-size:20px;
		margin-top:20px;
		line-height:30px;
	}
	
	#main .visual .subTit br{
		display:block;
	}
	
	#main .visual .phoneThum{
		width:320px;
		margin:50px auto 0;
	}
	
	
	#main .visual .phoneThum img{
		width:100%;
	}
	
	#main .roadmap{
		width:100%;
		background:#0c0c0c;
		padding:5em 3%;
		box-sizing:border-box;
	}
	
	#main .roadmap .keyword{
		width:100%;
		position:Relative;
	}
	
	#main .roadmap .keyword div{
		font-size:60px;
		color:#fff;
		font-family:'montserrat';
		font-weight:bold;
		transition:all 2s;
	}
	
	#main .roadmap .keyword .keyword01{
		position:absolute;
		left:50%;
		transform:translateX(-50%);
	}
	
	#main .roadmap .keyword .keyword02{
		width:100%;
		text-align:Center;
		padding:75px 0px;
	}
	
	#main .roadmap .keyword .keyword03{
		position:absolute;
		right:50%;
		transform:translateX(50%);
		bottom:0;
	}

	
	
	#main .roadmap .productVisual{
		width:94%;
		margin:50px auto;
	}
	
	#main .roadmap .productVisual .slick-list{
		overflow:visible;
	}
	
	
	#main .roadmap .productVisual li{
		width:100%;
		margin:0px 20px;
		box-sizing:border-box;
	}
	
	#main .roadmap .productVisual li .thum{
		width:100%;
	}
	
	#main .roadmap .productVisual li .thum img{
		width:100%;
	}
	
	
	#main .roadmap .productVisual li .txArea{
		width:100%;
		display:inline-block;
		display:none;
		margin-top:30px;
	
	}
	
	#main .roadmap .productVisual li .txArea .txA{
		display:inline-block;
	}
	
	#main .roadmap .productVisual li .txArea .txA .subj{
		font-size:24px;
		color:#e5e5e5;
		font-weight:bold;
	}
	
	#main .roadmap .productVisual li .txArea .txA .subs{
		font-size:16px;
		color:#e5e5e5;
		margin-top:10px;
	}
		
	#main .roadmap .productVisual li .txArea .more{
		display:inline-block;
		float:right;
		width:60px;
		line-height:60px;
		border:1px solid #444;
		text-align:Center;
		color:#777;
		border-radius:100%;
	}
	
	#main .roadmap .productVisual li .txArea .more a{
		color:#777;
	}
	
	#main .roadmap .productVisual .slick-current .txArea{
		display:inline-block;
	}
	
	#main .product{
		width:100%;
		position:relative;
	}
	
	#main .product .bg{
		width:100%;
	}
	
	#main .product .bg img{
		width:100%;
	}
	
	#main .product .txA{
		width:94%;
		position:absolute;
		left:50%;
		margin-left:-47%;
		margin-top:10%;
	}

	#main .product .txA .tit{
		font-size:60px;
		color:#fff;
		font-weight:bold;
		font-family:'montserrat';
	}
	
	#main .product .txA .subj{
		font-size:24px;
		color:#fff;
		margin-top:30px;
	}
	
	#main .product .txA .subs{
		font-size:18px;
		color:#fff;
		margin-top:10px;
	}


	
	
	#main .product .txA .more{
		margin-top:50px;
	}
	
	#main .product .txA .more .tx{
		font-size:18px;
		text-decoration:underline;
		display:inline-block;
		vertical-align:middle;
		color:#fff;
	}
	
	
	#main .product .txA .more .arrow{
		width:23px;
		display:inline-block;
		vertical-align:middle;
		margin-left:10px;
	}
	

	#main .reference{
		width:100%;
		background:#0c0c0c;
		padding:100px 0%;
		box-sizing:border-box;
	}
	
	#main .reference .inner{
		width:94%;
		margin:0 auto;
	}
	
	#main .reference .inner .tit{
		font-size:60px;
		color:#fff;
		font-weight:bold;
		font-family:'montserrat';
		text-align:center;
	}
	
	#main .reference .inner .subs{
		text-align:center;
		color:#fff;
		font-size:20px;
		margin-top:20px;
		line-height:30px;
	}
	
	
	#main .reference .inner .referenceList{
		width:100%;
		display:inline-block;
	}
	
	#main .reference .inner .referenceList li{
		width:20%;
		display:inline-block;
		float:left;
		margin-top:50px;
	}
	
	#main .reference .inner .referenceList li img{
		width:100%;
	}
	
	
	#main .case{
		width:94%;
		margin:100px auto 100px;
	}
	
	#main .case .tit{
		font-size:72px;
		color:#222;
		font-weight:bold;
		font-family:'montserrat';
		text-align:center;
	}
	
	
	#main .case .subTit{
		text-align:center;
		color:#444;
		font-size:24px;
		margin-top:20px;
		line-height:34px;
	}
	
	
	#main .case .more{
		margin-top:50px;
		width:100%;
		text-align:Center;
	}
	
	#main .case .more .tx{
		font-size:18px;
		text-decoration:underline;
		display:inline-block;
		vertical-align:middle;
		color:#444;
	}
	
	
	#main .case .more .arrow{
		width:23px;
		display:inline-block;
		vertical-align:middle;
		margin-left:10px;
	}
	
	#main .case .caseList{
		width:100%;
		display:inline-block;
		margin-top:50px;
	}
	
	#main .case .caseList li{
		width:32%;
		display:Inline-block;
		border-radius:10px;
		border:1px solid #e5e5e5;
		box-shadow:3px 3px 10px rgba(0,0,0,0.12);
		margin-left:2%;
		margin-top:20px;
		float:left;
		box-sizing:border-box;
		padding:25px;
	}
	
	#main .case .caseList li:nth-child(3n+1){
		margin-left:0%;
	}
	
	#main .case .caseList li .subj{
		width:100%;
		font-size:18px;
		color:#222;
		font-weight:bold;
		overflow:hidden;
		text-overflow:ellipsis;
		white-space:nowrap;
	}
	
	#main .case .caseList li .subs{
		width:100%;
		font-size:16px;
		color:#777;
		overflow:hidden;
		text-overflow:ellipsis;
		white-space:nowrap;
		margin-top:10px;
	}
	
	#main .case .caseList li .date{
		width:100%;
		font-size:16px;
		color:#777;
		font-family:'lato';
		margin-top:20px;
	}
	
	
	#main .case .caseList li .comp{
		width:100%;
		font-size:16px;
		color:#e89200;
		margin-top:50px;
	}
	

}



@media screen and (max-width:767px) {
	#main{
		width:100%;
		overflow:hidden;
	}
	
	#main .visual{
		width:100%;
		background:#0c0c0c;
		padding:10em 3% 5em;
		box-sizing:border-box;
	}
	
	
	#main .visual .tit{
		text-align:center;
		color:#fff;
		font-size:80px;
		font-weight:900;
		font-family:'montserrat';
	}
	
	#main .visual .subTit{
		text-align:center;
		color:#fff;
		font-size:16px;
		margin-top:20px;
		line-height:26px;
		word-break:keep-all;
	}
	
	#main .visual .subTit br{
		display:none;
	}
	
	#main .visual .phoneThum{
		width:260px;
		margin:50px auto 0;
	}
	
	
	#main .visual .phoneThum img{
		width:100%;
	}
	
	#main .roadmap{
		width:100%;
		background:#0c0c0c;
		padding:5em 3%;
		box-sizing:border-box;
	}
	
	#main .roadmap .keyword{
		width:100%;
		position:Relative;
	}
	
	#main .roadmap .keyword div{
		font-size:38px;
		color:#fff;
		font-family:'montserrat';
		font-weight:bold;
		transition:all 2s;
	}
	
	#main .roadmap .keyword .keyword01{
		position:absolute;
		left:50%;
		transform:translateX(-50%);
	}
	
	#main .roadmap .keyword .keyword02{
		width:100%;
		text-align:Center;
		padding:50px 0px;
	}
	
	#main .roadmap .keyword .keyword03{
		position:absolute;
		right:50%;
		transform:translateX(50%);
		bottom:0;
	}

	
	
	#main .roadmap .productVisual{
		width:94%;
		margin:50px auto;
	}
	
	#main .roadmap .productVisual .slick-list{
		overflow:hidden;
	}
	
	
	#main .roadmap .productVisual li{
		width:100%;
		margin:0px 0px;
		box-sizing:border-box;
	}
	
	#main .roadmap .productVisual li .thum{
		width:100%;
	}
	
	#main .roadmap .productVisual li .thum img{
		width:100%;
	}
	
	
	#main .roadmap .productVisual li .txArea{
		width:100%;
		display:inline-block;
		margin-top:30px;
	
	}
	
	#main .roadmap .productVisual li .txArea .txA{
		display:inline-block;
		width:70%;
	}
	
	#main .roadmap .productVisual li .txArea .txA .subj{
		font-size:18px;
		color:#e5e5e5;
		font-weight:bold;
	}
	
	#main .roadmap .productVisual li .txArea .txA .subs{
		font-size:14px;
		color:#e5e5e5;
		margin-top:10px;
		line-height:22px;
	}
		
	#main .roadmap .productVisual li .txArea .more{
		display:inline-block;
		float:right;
		width:60px;
		line-height:60px;
		border:1px solid #444;
		text-align:Center;
		color:#777;
		border-radius:100%;
		font-size:14px;
	}
	
	#main .roadmap .productVisual li .txArea .more a{
		color:#777;
	}
	
	#main .roadmap .productVisual .slick-current .txArea{
		display:inline-block;
	}
	
	#main .product{
		width:100%;
		position:relative;
	}
	
	#main .product .bg{
		width:100%;
		overflow:hidden;
	}
	
	#main .product .bg img{
		width:200%;
		position:relative;
		left:50%;
		margin-left:-100%;
	}
	
	#main .product .txA{
		width:94%;
		position:absolute;
		left:50%;
		margin-left:-47%;
		margin-top:10%;
		z-index:1;
	}

	#main .product .txA .tit{
		font-size:36px;
		color:#fff;
		font-weight:bold;
		font-family:'montserrat';
	}
	
	#main .product .txA .subj{
		font-size:18px;
		color:#fff;
		margin-top:30px;
	}
	
	#main .product .txA .subs{
		font-size:14px;
		color:#fff;
		margin-top:10px;
		word-break:keep-all;
		line-height:22px;
	}


	
	
	#main .product .txA .more{
		margin-top:50px;
	}
	
	#main .product .txA .more .tx{
		font-size:16px;
		text-decoration:underline;
		display:inline-block;
		vertical-align:middle;
		color:#fff;
	}
	
	
	#main .product .txA .more .arrow{
		width:23px;
		display:inline-block;
		vertical-align:middle;
		margin-left:10px;
	}
	

	#main .reference{
		width:100%;
		background:#0c0c0c;
		padding:100px 0%;
		box-sizing:border-box;
	}
	
	#main .reference .inner{
		width:94%;
		margin:0 auto;
	}
	
	#main .reference .inner .tit{
		font-size:36px;
		color:#fff;
		font-weight:bold;
		font-family:'montserrat';
		text-align:center;
	}
	
	#main .reference .inner .subs{
		text-align:center;
		color:#fff;
		font-size:16px;
		margin-top:20px;
		word-break:keep-all;
		line-height:26px;
	}
	
	#main .reference .inner .subs br{
		display:none;
	}
	
	
	#main .reference .inner .referenceList{
		width:100%;
		display:inline-block;
	}
	
	#main .reference .inner .referenceList li{
		width:33.3%;
		display:inline-block;
		float:left;
		margin-top:50px;
	}
	
	#main .reference .inner .referenceList li img{
		width:100%;
	}
	
	#main .reference .inner .referenceList li:last-child{
		display:none;
	}
	
	
	#main .case{
		width:94%;
		margin:100px auto 100px;
	}
	
	#main .case .tit{
		font-size:36px;
		color:#222;
		font-weight:bold;
		font-family:'montserrat';
		text-align:center;
	}
	
	
	#main .case .subTit{
		text-align:center;
		color:#444;
		font-size:16px;
		margin-top:20px;
		line-height:26px;
	}
	
	
	#main .case .more{
		margin-top:50px;
		width:100%;
		text-align:Center;
	}
	
	#main .case .more .tx{
		font-size:16px;
		text-decoration:underline;
		display:inline-block;
		vertical-align:middle;
		color:#444;
	}
	
	
	#main .case .more .arrow{
		width:23px;
		display:inline-block;
		vertical-align:middle;
		margin-left:10px;
	}
	
	#main .case .caseList{
		width:100%;
		display:inline-block;
		margin-top:50px;
	}
	
	#main .case .caseList li{
		width:49%;
		display:Inline-block;
		border-radius:10px;
		border:1px solid #e5e5e5;
		box-shadow:3px 3px 10px rgba(0,0,0,0.12);
		margin-left:2%;
		margin-top:10px;
		float:left;
		box-sizing:border-box;
		padding:1em;
	}
	
	
	
	#main .case .caseList li:nth-child(3n+1){
		margin-left:2%;
	}
	
	#main .case .caseList li:nth-child(2n+1){
		margin-left:0%;
	}
	
	#main .case .caseList li:last-child{
		display:none;
	}
	
	#main .case .caseList li .subj{
		width:100%;
		font-size:16px;
		color:#222;
		font-weight:bold;
		overflow:hidden;
		text-overflow:ellipsis;
		white-space:nowrap;
	}
	
	#main .case .caseList li .subs{
		width:100%;
		font-size:14px;
		color:#777;
		overflow:hidden;
		text-overflow:ellipsis;
		white-space:nowrap;
		margin-top:10px;
	}
	
	#main .case .caseList li .date{
		width:100%;
		font-size:14px;
		color:#777;
		font-family:'lato';
		margin-top:20px;
		overflow:hidden;
		text-overflow:ellipsis;
		white-space:nowrap;
	}
	
	
	#main .case .caseList li .comp{
		width:100%;
		font-size:13px;
		color:#e89200;
		margin-top:50px;
		overflow:hidden;
		text-overflow:ellipsis;
		white-space:nowrap;
	}
	

}