@charset "UTF-8";
	body#top {
		background-color: #ffffff;
	}
	
	#fv{
		position: relative;
		background-color: #ffffff;
		padding: 100px 0 0 0;
	}
	
	.ttl{
		line-height: 2;
		font-size: 38px;
		letter-spacing: 2px;
		margin-left: -4px;
		color: #191E2A;
	}

	.sub_ttl{
		line-height: 1.65em;
		padding: 12px 0 0 0;
		color: #191E2A;
	}
	
	.text_deco{
		font-family: 'Jost' , san-serif;
		display: block;
		margin: 0 auto;
		padding: 60px 0 30px 0;
		font-size: 40px;
		font-weight: 500;
	}
	
	#company{
		padding: 60px;
	}
	
	.company_ttl{
		font-size: 1.6em;
		margin: 40px;
		line-height: 2;
		color: #1a1e29;
	}
	
	.company_logos_3column {
		display: flex;
		max-width: 600px;
		flex-wrap: wrap;
		justify-content: center;
		margin: 0 auto;
	}
	
	.company_logos_5column{
		display: flex;
		max-width: 1000px;
		flex-wrap: wrap;
		justify-content: center;
		margin: 0 auto;
	}
	
	
	.company_logos_3column img ,.company_logos_5column img{
		width: 180px;
		height: 100%;
		margin: 10px;
	}
	
	#search_box{
		max-width: 940px;
		margin: 60px auto;
		padding: 30px;
		background-color: #EDEDF5;
	}
	
	.search_ttl{
		color: #48495f;
		line-height: 2;
		font-size: 1.2em;
	}
	
	.search_ttl span{
		background-image: url("../img/casestudy/search.png");
		background-repeat: no-repeat;
		background-position: left;
		background-size: 20px auto;
		padding: 0px 0 0px 30px;
	}
	
	.search_box_inner{
		max-width: 850px;
		display: flex;
		flex-wrap: wrap;
		margin: 10px auto;
		justify-content: center;
	}
	
	.search_box_inner li{
		margin: 10px;
		padding: 3px 13px;
		line-height: 2;
		background-color: #fff;
		display: inline-block;
		border-radius: 20px;	
	}
	
	.search_box_inner li a{
		text-decoration: none;
		color: #707070;
	}
	
	.search_item {
		display: inline-block;
		cursor: pointer;
	}
	
	.is-hide {
		display: none;
	}

	#case{
		padding:0px 0 200px;
		background-color: #ffffff;
	}
	
	.case_wrapper{
		max-width: 1000px;
		margin: 0 auto;
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		justify-content: center;
	}
	
	.case_wrapper li{
		width: 30%;
		margin: 0 12px 50px;
	}
	
	.case_wrapper li a{
		display: block;
		transition: .4s;
		border-radius: 8px;
		overflow: hidden;
		box-shadow: 0px 4px 16px rgba(0,0,0,0.1);
		background-color: #ffffff;
	}
	
	.case_wrapper li a:hover{
		box-shadow :0px 12px 22px rgba(0,0,0,0.1);
	}
	
	.case_wrapper li a p{
		text-decoration: none;
		color: #1a1e29;
	}
	
	.company_photo {
		width: 100%;
		height: 176px;
		overflow: hidden;
		position: relative;
	}
	
	.company_photo img {
		width: 100%;
		height: auto;
		position: absolute;
		top:50%;
		left: 50%;
		transform: translate(-50% , -50%);
		transition: .4s;
	}
	
	a:hover .company_photo img{
		width: 110%;
		height: auto;
	}

	.empty{
		width: 100%;
	}
	
	.logo{
		width: 70%;
	}
	
	.case_text{
		padding: 30px;
	}
	
	.company_name{
		margin: 20px 0;
		line-height: 1.55;
		font-size: 0.9em;
	}
	
	.case_under_bar{
		margin: 15px 0;
		background-color: #D7D7DF;
		width: 100%;
		height: 1px;
	}
	
	.case_ttl{
		line-height: 1.7em;
		text-align: justify;
	}
	
	@media screen and (max-width:1080px){
		#search_box{
			margin: 60px 30px;
		}
		
		#case{
			padding:0px 20px 100px 20px;
		}
	}
	
	@media screen and (max-width:880px){
		.case_wrapper li{
			width: 42%;
		}
	}
	
	@media screen and (max-width:650px){
		
		#fv{
			height: 240px;
		}
		
		.sub_ttl {
			font-size: 0.8em;
		}
		
		.text_deco{
			width: 260px;
			padding:30px 0;
		}
		
		#company{
			padding: 10px;
		}
		
		.company_ttl {
			font-size: 1.3em;
			margin: 60px 0 5px 0;
		}
		
		.search_box_inner li{
			line-height: 1.6;
		}
		.company_logos_3column img ,.comapny_logos_5column img {
			width: 40%;
			margin: 5px;
		}
		.ttl{
			font-size: 1.7em;
		}
		.search_box_inner li{
			font-size: 0.9em;
			width: 100%;
		}
		.case_wrapper li{
			width: 64%;
		}
	}
	
	
	@media screen and (max-width:500px){
		.case_wrapper li{
			width: 100%;
		}	
	}
	@media screen and (max-width: 350px){
		#case {
			padding: 0 0 80px 0;
		}
	}

/* --casestudy/index--*/

/* --casestudy/detail--*/
	
	.breadcrumb_list{
		padding: 15px;
		max-width: 1000px;
    	margin: 105px auto 0 auto;
	}
	
	.breadcrumb_list p{
		line-height: 1;
		font-size: 0.7em;
		text-align: left;
	}
	
	.casestudy_detail_ttl{
		line-height: 1.5;
		font-size: 34px;
		padding: 50px 22px 30px 22px;
	}
	
	#company_intro{
		max-width: 830px;
		margin: 50px auto;
		display: flex;
		align-items: center;
	}

	#company_intro img{
		width: 100%;
		height: auto;
	}
	
	.company_intro_inner {
		width: 100%;
		max-width: 680px;
		margin: 50px auto;
		padding: 0 30px;
		text-align: justify;
		line-height: 2;
		box-sizing: border-box;
	}
	
	.company_intro_text span {
		background: linear-gradient(transparent 88%, #F5F6F8 0%);
		display: inline;
		padding: 0 0 4px 0;
	  }
	
	.top_company_name{
		 line-height: 1;
		margin: 20px auto 20px auto;
		font-size:18px;
		color: #1e1e1e;
	}
	
	#issue_effect{
		max-width: 830px;
		margin: 0 auto;
	}
	
	.issue{
		border:1px solid #f0f0f0;
		padding: 40px;
		border-radius: 12px;
		margin: 20px auto;
		background-color: #fbfbfb;
	}
	
	.issue_ttl{
		line-height: 1;
		color: #666666;
		font-size: 1.5em;
		text-align: left;
	}
	
	.issue_effect_text {
		margin: 10px 0 0 25px;
	}

	.issue_effect_text li{
		line-height: 1.55;
		text-align: left;
		list-style: disc;
		font-size: 15px;
		margin:0 0 4px 0;
	}
	
	.issue_effect_text li span{
		font-weight: bold;
	}

	.list_checked{
		position: relative;
   	 padding-left: 1em;
		list-style: none!important;
	}

	.list_checked:before{
		content: "";
		position: absolute;
		top: .3em;
		left: 0;
		-webkit-transform: rotate(50deg);
		-ms-transform: rotate(50deg);
		transform: rotate(50deg);
		width: 5px;
		height: 10px;
		border-right: 2px solid #000;
		border-bottom: 2px solid #000;
	}
	
	.effect{
		border:solid 2px #FFE9F3;
		padding: 40px;
		border-radius: 12px;
		background-color: rgba(2455,233,243,0.4);
	}
	
	.effect_ttl{
		line-height: 1;
		color: #DC8EAC;
		font-size: 1.5em;
		text-align: left;
	}
	
	#casestudy_contents{
		max-width: 830px;
		margin: 0 auto;
	}
	
	
	.casestudy_contents_photo{
		width: 80%;
		max-width: 600px;
		height: auto;
		margin-top: 50px;
	}
	
   .casestudy_contents_text{
		margin-top: 50px;
	}
	
	.casestudy_subttl{
		margin: 73px 0 20px;
		padding: 9px 0;
		font-size: 26px;
		font-weight: 700;
		border-bottom: 3px solid #dfdbdb;
		line-height: 1.35;
		text-align: left;
	}
	.checked{
		position: relative;
		padding-left: 1em;
	}

	.checked:before{
		content: "";
		position: absolute;
		top: 0.6em;
		left: 0.2em;
		-webkit-transform: rotate(50deg);
		-ms-transform: rotate(50deg);
		transform: rotate(50deg);
		width: 8px;
		height: 16px;
		border-right: 3px solid #000;
		border-bottom: 3px solid #000;
	}

	.casestudy_subsub{
		font-size: 18px;
		text-align: left;
		padding-top: 15px;
		line-height: 1.35;

	}
	
	.casestudy_contents_inner{
		margin-top: 15px;
		line-height: 2.2;
		text-align: left;
	}

	.bold{
		font-weight: bold;
	}
	
	.last_greeting{
		font-size: 1.1em;
		line-height: 2.3;
		font-weight: bold;
		text-align: left;
		color: #48495F;
		margin-top: 20px;
	}
	
	#company_detail{
		max-width: 760px;
		margin: 50px auto 0 auto;
		border:solid 3px #f1f1f1;
		background-color: rgba(0, 0, 0, 0);
		padding: 35px;
		border-radius: 10px;
	}
	
	.company_detail_ttl{
		line-height: 1.35;
		text-align: left;
		margin-bottom: 20px;
		font-size: 17px;
		color: #1e1e1e;
	}
	
	#company_detail ul li{
		line-height: 1.8;
		text-align: left;
	}
	
	#company_detail ul li span{
		font-size: 0.8em;
	}
	
	.company_detail_inner{
		display: flex;
		justify-content: space-around;
	}

	.company_detail_inner img{
		max-width: 200px;
		display: block;
		border-radius: 200px;
		border: 1px solid #f1f1f1;
	}

	.company_detail_inner p{
		line-height: 1.8;
	}

	.company_detail_text{
		padding: 20px 0 10px 40px;
		text-align: left;
		
	}


	#othercase{
		margin: 200px auto;
		max-width: 1000px;
	}
	
	.othercase_ttl{
		line-height: 1;
		font-size: 14px;
		font-weight: normal;
		text-align: center;
		padding: 0px 0 30px;
		color: #1e1e1e;
		margin: -10px auto 30px;
	}

	.caseetudy_contents_flex{
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin: 50px 0;
		flex-wrap: wrap;
	}

	.flex_text{
		width: 50%;
		line-height: 2.2;
    	text-align: left;
	}

	.flex_img{
		width: 40%;
	}

	.flex_img img {
		width: 100%;
		height: auto;
	}
	
	.img_comment {
		font-size: 12px;
		max-width: 600px;
		text-align: left;
		margin: 10px auto;
		line-height: 1.5em;
	}
	
	@media screen and (max-width:999px){
		#company_intro{
			display: block;
		}
		.contents_wrapper{
			margin: 0 20px;
		}
	}
	
	
	@media screen and (max-width:650px){
		.pc{
			display: none;
		}
		
		.sp{
			display: block;
		}
		
		.casestudy_detail_ttl{
			padding: 12px;
			font-size: 1.4em;
			line-height: 1.6;
		}
		
		.issue_ttl{
			font-size: 1.2em;
		}
		
		.effect_ttl{
			font-size: 1.2em;
		}
		
		.issue{
			padding: 20px;
		}
		
		.effect{
			padding: 20px;
		}
		
		.casestudy_subttl{
			font-size: 1.45em;
		}
		
		.casestudy_contents_photo{
			width: 100%;
		}
		#company_detail{
			padding: 20px;
			font-size: 0.9em;
		}
		
		.company_detail_inner{
			flex-wrap: wrap;
		}
		
		.company_detail_text{
			    padding: 40px 0 10px 0px;
		}

		.flex_text{
			width: 100%;
		}

		.flex_img{
			margin: 10px auto;
   			 width: 80%;
		}
	}
.stress_text {
	font-weight: bold;
	background: linear-gradient(transparent 70%, #ff9f9f 0%);
	display: inline;
	padding: 0 0 -2px 0;
}

.stress_text em {
	color: #5B8CAD;
	font-style: normal;
}
/* --casestudy/detail--*/

.ttl__casestudy {
	font-family: 'Jost';
	font-weight: 500;
	font-size: 30px;
	line-height: 1;
	padding: 50px 0 30px 0;
}
