@charset "utf-8";

/**********************************************
 * 
* case
 *
***********************************************/
#case {
	background: #000211;
}

#case main {
	color: #fff;
	background: url(../../images/case/bg_main.png) no-repeat top -110px left;
	background-size: 120% auto;
}
#case .Breadcrumb {
	margin: 85px 0 105px;
}
#case .MainVisual .MainVisual_area {
    position: relative;
    color: #fff;
    font-family: 'Noto Serif JP', serif;
    margin-top: 85px;
}

#case .MainVisual .MainVisual_area em {
	font-size: 1.4rem;
	letter-spacing: 1.4px;
}

#case .MainVisual .MainVisual_area h1 {
	font-size: 6.0rem;
	margin-top: 20px;
	margin-bottom: 75px;
	letter-spacing: 6px;
}

#case .Copy {
	font-family: 'Noto Serif JP', serif;
	font-size: 5rem;
	text-align: center;
}

#case h2 {
	font-family: 'Noto Serif JP', serif;
	font-size: 6rem;
}

#case h2 span {
	font-size: 4rem;
}

#case .l-container.-Wide {
	width: 85%;
	margin: 0 auto 0 0;
}
#case .l-container.-Wide .textbox .text {
	line-height: 2;
}

#case .l-container.-Wide .textbox {
	padding: 0 30px 40px;
	width: 570px;
}

#case .l-container.-Wide .imgbox {
	margin-top: 10px;
	width: calc(100% - 570px);
}

#case .l-container.-Wide .imgbox figcaption {
	margin-top: 10px;
}

#case .subtitle {
	font-size: 3rem;
	font-family: 'Noto Serif JP', serif;
}

#case .subtitle em {
	font-size: 5rem;
}

#case .Task {
	margin-top: 115px;
}

#case .Task .text {
	font-size: 3rem;
	font-family: 'Noto Serif JP', serif;
	text-align: center;
}

#case .About {
	margin-top: 240px;
}

#case .About .imgbox {
	margin-left: -15px;
}

#case .Achievement {
	margin-top: 135px;
	background: url(../../images/case/bg_achievement.png) no-repeat top center;
}
#case .Achievement dl {
	margin-top: 4rem;
}
#case .Achievement dl dt {
	font-size: 4rem;
	font-family: 'Noto Serif JP', serif;
}

#case .Achievement dl dt span {
	font-size: 3rem;
	display: block;
}
#case .Thoughts {
    margin-top: 130px;
    background: url(../../images/case/bg_thoughts.png) no-repeat bottom -110px left;
}

#case .Data {
	padding-top: 211px;
	margin-top: 74px;
	background: url(../../images/case/bg_data.png) no-repeat top left;
}

#case .Data .l-container.-Wide {
    margin: 0 0 0 auto;

}

#case .Data .l-container.-Wide .textbox {
    padding: 0 30px 40px 0;
}

#case .Data .l-container.-Wide .imgbox {
    padding: 0;
}

#case .Data .subtitle {
    font-size: 4.6rem;
	margin-bottom: 50px;
}

#case .Data .subtitle span {
    font-size: 2rem;
	display: block;
}

@media (max-width: 767px) {
	#case main {
		background: url(../../images/case/bg_main_sp.png) no-repeat top 90px left;
		background-size: contain;
	}

	#case .Breadcrumb {
		margin: 45px 0 55px;
	}

	#case .MainVisual .MainVisual_area h1 {
		font-size: 3rem;
		margin-bottom: 35px;
	}
	#case .Copy {
		font-size: 3rem;
		text-align: left;
	}
	#case h2 {
		font-size: 4rem;
	}
	#case h2 span {
		font-size: 3rem;
	}

	#case .subtitle {
		font-size: 2.4rem;
		margin-bottom: 20px;
	}
	#case .subtitle em {
		font-size: 3.2rem;
	}
	#case .Task .text {
		font-size: 2.4rem;
		text-align: left;
	}
	#case .Task {
		margin-top: 55px;
	}
	#case .Task img {
		width: 100%;
	}
	#case .l-container.-Wide {
		width: 100%;
		margin: 0 auto;
	}

	#case .l-container.-Wide .textbox {
		padding: 20px 0;
	}
	#case .l-container.-Wide .imgbox {
		width: 100%;
	}
	#case .About .imgbox {
		margin-left: 0;
	}
	#case .About {
		margin-top: 80px;
	}

	#case .About .textbox {
		margin-left: 0;
	}
	#case .Achievement {
		margin-top: 65px;
	}
	#case .Achievement dl dt {
		font-size: 3rem;
		margin-bottom: 20px;
	}
	#case .Achievement dl dt span {
		font-size: 2.4rem;
		display: block;
	}

	#case .Thoughts {
		margin-top: 60px;
		background: url(../../images/case/bg_thoughts_sp.png) no-repeat bottom 0px left -170px;
		background-size: ;
		padding-bottom: 100px;
	}

	#case .Data {
		padding-top: 0;
		margin-top: 0;
		background: url(../../images/case/bg_data.png) no-repeat top left;
	}
	#case .Data .subtitle {
		font-size: 3rem;
		margin-bottom: 30px;
	}
	#case .Data .l-container.-Wide {
		width: 100%;
		margin: 0 auto;
	}

	#case .Data .l-container.-Wide .textbox {
		padding: 0;
	}
}