@charset "utf-8";
/***********************
sp.css
************************/
@media screen and (min-width: 0px) and (max-width: 800px) {
	
	/*---------------------
	全体
	-----------------------*/
	#container{
		min-width:0;
	}
	/*---------------
	メインエリア
	-----------------*/
	#main {
		content: "";
		width: 100%;
		height: auto;
		/* background: url(../img/sp/main_img_sp.jpg) no-repeat center top; */
		background-image: none;
		background-size: 100% auto;
		background-position: 0 55px;
	}
	.sp_visual {
		margin-top: 56px;
	}
	  .sp_visual img {
		width: 100%;
		height: auto;
	}
	#fv_scroll {
		position: absolute;
		height: 105px;
		bottom: 0;
		right: 20px;
		color: #fff;
		writing-mode: vertical-rl;
		font-size: 9px;
		font-weight: bold;
	}
	
	#fv_scroll .scrollborder {
		position: absolute;
		width: 2px;
		height: 50px;
		background-color: rgba(255, 255, 255, 0.4);
		bottom: 0;
		left: 50%;
		transform: translate(-50%, 0);
		overflow: hidden;
	}
	#main_sp{
		position:relative;
		width:100%;
		height:inherit;
		margin: 0 auto;
	}
	.header_txt {
		color: #fff;
		line-height: 56px;
		padding-left: 15px;
	}
	#main_sp img {
		position: absolute;
		top: 65px;
		left: 20px;
	}
	.main_logo {
		position: absolute;
		width: 22.3vw;
		height: 22.8vw;
		bottom: auto;
		top: 10px;
		left: auto;
		right: 10px;
	}
	.main_logo img {
		width: 100%;
		height: auto;
	}

	/*---------------------
	ニュースエリア
	-----------------------*/
	#news_top {
		position: relative;
		/* z-index: 9; */
		margin-top: 0;
		/* background: none; */
	}
	#news_top a {
		padding: 10px;
		margin: 0 auto;
	}
	#news_wrap {
		display: flex;
	}
	#news_top h2 {
		padding-left: 20px;
	}
	#news_txt {
		padding: 0 10px;
	}
	#news_txt span {
		margin-left: 0px;
	}
	/*---------------------
	プロジェクトエリア
	-----------------------*/
	#project_top {
		padding: 28% 5.6%;
	}
	#project_area {
		padding: 40px 0 20px;
		width: 100%;
		box-sizing: border-box;
	}
	#project_wrap {
		display: block;
	}
	.pro_txt {
		width: 100%;
		margin-top: 0;
		font-size: 14px;
		line-height: 1.5em;
	}
	.subtitle {
		font-size: 20px;
	}
	#project_logo {
		margin: 30px auto 0;
		padding: 20px 10px;
	}
	#project_logo > img {
		margin-bottom: 50px;
	}
	.companylogo {
		display: flex;
	}
	/*---------------------
	ムービー紹介エリア
	-----------------------*/
	#movie_top {
		display: block;
		background: url(../img/sp/m_bg_sp.jpg) repeat-y;
		background-size: 100% auto;
	}
	#movie_top h2 {
		border-right: none;
	}
	.movie_area {
		width: 100%;
	}
	.movie_wrap{
		display: block;
	}
	.movie_wrap section {
		display: block;
		width: 100%;
		padding-top: 0;
		padding-bottom: 24%;
	}
	.movie_wrap:first-child {
		padding-top: 0;
	}
	.movie_wrap:last-child {
		padding-bottom: 0;
	}
	h3 {
		margin: 0 auto;
	}
	.img_area_sp {
		width: 95%;
		margin: 0 auto;
	}
	.sgimg {
		margin-top: -25px;
	}
	hr {
		width: 95%;
		margin: 0 auto;
		margin-top: 20px;
	}
	.acbtn {
		background: url("../img/ac_open.jpg") no-repeat top center;
		background-size: 59px auto;
		background-position: 0 0;
	}
	.acbtn.close_btn:hover {
		background: url("../img/ac_close.jpg") no-repeat top center;
		background-size: 59px auto;
		background-position: 0 0;
	}
	.acbox {
		width: 93%;
		margin: 0 auto;
	}
	.acbox .txt {
		padding: 15px 0;
		line-height: 1.7em;
		letter-spacing: 1px;
	}
	table {
		line-height: 1.6em;
	}
	table tr td {
		padding: 10px 20px;
		padding-left: 0;
	}
	table tr td:last-child {
		padding-right: 0;
	}
	td p {
		padding: 10px 5px;
		line-height: 1.5em;
	}
	/*---------------------
	関連リンクエリア
	-----------------------*/
	#rlinks_top {
		background: url(../img/sp/bg_rlinks_sp.jpg) no-repeat center top;
		background-size: cover;
		width: 100%;
		padding: 18% 0 24%;
	}
	#rlinks_top h3 {
		margin: 0 20px 50px;
	}
	#rlinks_wrap {
		width: 100%;
		/* padding: 0 20px; */
		box-sizing: border-box;
		font-size: 14px;
		letter-spacing: 00;
	}
	#rlinks_wrap:first-of-type {
		width: 90%;
		box-sizing: border-box;
	}
	.rlinks {
		display: flex;
		position: relative;
		padding: 15px 0;
		line-height: 3em;
		padding-left: 40px;
	}
	.rlinks::before {
		content: url(../img/r_content.png);
		top: 55%;
	}
	/*---------------------
	フッター
	-----------------------*/
	footer {
		overflow: hidden;
		box-sizing: border-box;
		width: 100%;
		margin: 0 auto;
		padding: 12% 0 14%;
		background: #fff;
		text-align: center;
	}
	small {
		width: 80%;
		display: block;
		margin: 0 auto;
		line-height: 1.6rem;
	}
	.footer_share ul {
		display: flex;
		width: 70%;
		margin: 0 auto;
		margin-bottom: 20px;
	}
	.footer_share ul li {
		padding: 1%;
		width: 10%;
		margin: 0 auto;
	}
	.footer_share ul li.share_t {
		width: 20%;
	}
	

}