@charset "utf-8";
/* *******************************************************************************************
* 
*	cloud
*
******************************************************************************************* */
@media screen and (max-width : 768px){

	/* ----------------------------- talk ----------------------------- */
	.talk{
		margin-top: 30px;
	}
	.talk:last-child{
		margin-bottom: 80px;
	}
	.talk li.member2{
		background: url(../image/member2.jpg) no-repeat 0 center;
		background-size: 80px;
	}
	.talk li.haruto{
		background: url(../image/member1_4.jpg) no-repeat 0 center;
		background-size: 80px;
	}
	.talk li.haruto2{
		background: url(../image/member1_3.jpg) no-repeat 0 center;
		background-size: 80px;
	}
	.talk li.haruto3{
		background: url(../image/member1_6.jpg) no-repeat 0 center;
		background-size: 80px;
	}
	.talk li.haruto4{
		background: url(../image/member1_2.jpg) no-repeat 0 center;
		background-size: 80px;
	}
	.talk li.haruto5{
		background: url(../image/member1_5.jpg) no-repeat 0 center;
		background-size: 80px;
	}

	.talk .pic2{
		margin: 30px 0;
		text-align: center;
		width: 100%;
	}
	.talk .pic2 img{
		overflow: hidden;
		border-radius: 15px;
		width: 80%;
	}
	.talk .pic2:first-child{
		margin-top: 0px;
	}
	.talk dl{
		width: 80%;
		margin: 0 auto 20px !important;
	}
	.talk dl.mb{
		margin-bottom: 60px;
	}
	.talk dl dd{
		margin-bottom: 25px !important;
		margin-top: 0px !important;
		margin-right: 0px !important;
		width: 100% !important;
	}
	.talk dl dd:last-of-type{
		margin-bottom: 40px !important;
	}
	.talk dl dd p{
		font-size: 15px;
		margin-bottom: 0px;
	}
	.talk dl dd strong{
		border: 0px;
		border-bottom: 2px dotted ;
		padding: 0 5px 2px;
		margin-bottom: 15px;
		color: #ee7300;
		font-size: 16px;
	}
	.talk .hAuto{
		height: auto;
	}
	.talk dl.col1 dd figure img{
		width: 100%;
	}

	/* ----------------------------- interview ----------------------------- */
	.interview figure{
		text-align: center;
		margin: 40px 0;
		width: 120%;
		margin-left: -10%;
	}
	.interview figure img{
		display: inline-block;
		border-radius: 0px;
		overflow:hidden;
		width: 100%;
	}
	.interview_list_item{
		font-size: 16px !important;
	}

	.interview .interview_about{
		border: 2px solid #eee;
		overflow: hidden;
		margin: 20px 0px 40px -5%;
		padding: 20px;
		border-radius: 15px;
		background-color: #fefefe;
		width: 110%;
		box-sizing: border-box;
	}
	.interview .interview_about h5{
		margin-bottom: 10px;
		font-size: 16px;
	}
	.interview .interview_about figure{
		float: right;
		margin: 0px;
		margin-left: 10px;
		margin-bottom: 10px;
		width: 45%;
	}
	.interview .interview_about figure img{
		display: inline-block;
		border-radius: 15px;
		overflow:hidden;
		width: 100%;
	}
	.interview .chart{
		margin-top: 20px;
	}
	.interview .chart h4{
		text-align: center;
		margin-bottom: -25px;
		font-size: 16px;
		color: #ee7300;
		text-align: center;
	}
	.interview .chart h4 span{
		display: inline-block;
		padding: 0 10px 5px;
		border-bottom: 2px dotted ;
	}
	.interview .chart figure{
		border: 0px;
		overflow: hidden;
		border-radius: 0px;
	}
	.interview .chart figure img.switch_pc{
		display: none;
	}
	.interview .chart figure img.switch_sp{
		display: inline;
	}

	/* ----------------------------- remarks ----------------------------- */
	.remarks figure{
		text-align: center;
		margin-bottom: 20px;
	}
	.remarks figure img{
		display: inline-block;
		border-radius: 15px;
		overflow:hidden;
		width: 100%;
	}

	/* ----------------------------- profile ----------------------------- */
	.profile dl{
		margin-top: 20px;
		margin-bottom: -15px;
	}
	.profile dt{
		margin-bottom: 0px;
	}
	.profile dt:before{
		content: '・';
	}
	.profile dd{
		margin-bottom: 15px;
		padding-left: 1em;
	}
	.profile dd a{
		text-decoration: underline !important;
	}
	.profile dd a:hover{
		text-decoration: none !important;
	}
	
	.profile_about {
		margin: 0 0 0 0px;
		font-size: 16px;
		line-height: 1.8;
	}
}