@charset "utf-8";

#expert1810 {
	max-width: 996px;
	margin: 0 auto;
	padding-top: 12px;
	font-feature-settings: "palt";
	letter-spacing: 0.8px;
}
#expert1810 h2 {
	margin: 46px 0 24px;
	padding: 10px 0 7px;
	border-bottom: 1px solid #323232;
	background-color: transparent;
	font-size: 22px;
	text-align: center;
	letter-spacing: 1.2px;
}
#expert1810 p {
	margin-bottom: 27px;
	line-height: 1.75;
}
/* メインビジュアル */
#expert1810 #kv {
	margin: 0;
	padding: 180px 0 242px;
	font-size: 24px;
	text-align: center;
	letter-spacing: 3.2px;
}
/* 研究の始まり */
#expert1810 .intro {
	position: relative;
	padding: 0 88px;
}
#expert1810 .intro h2 {
	margin-left: -88px;
	margin-right: -88px;
}
#expert1810 .intro p {
	padding-right: 235px;
	text-align: justify;
}
#expert1810 .intro p span.img {
	position: absolute;
	top: 127px;
	right: 88px;
	color: #969696;
	font-size: 12px;
	text-align: right;
}
#expert1810 .intro span.img:after {
	display: inline;
	content: "加治屋研究員";
}
#expert1810 .intro span.img img {
	display: block;
	margin-bottom: 4px;
}
/* 理由の追求 */
#expert1810 .mechanism {
	text-align: center;
}
#expert1810 .mechanism h2 {
	margin-top: 22px;
}
#expert1810 .mechanism h3 {
	margin: -3px 0 45px;
	padding: 16px 0 14px;
	background-color: #f0f0f0;
	font-size: 20px;
}
#expert1810 #mech-slide {
	padding: 0 33px;
}
#expert1810 #mech-slide .mech {
	position: relative;
	width: 310px;
	padding: 268px 5px 0;
}
#expert1810 #mech-slide .mech:before {
	display: block;
	position: absolute;
	top: 0;
	left: 5px;
	width: 100%;
	height: 258px;
	background: no-repeat 0 50% / 100% auto;
	content: "";
}
#expert1810 #mech-slide .mech1:before {
	max-width: 328px;
	background-image: url(../img/mech1.png)
}
#expert1810 #mech-slide .mech2:before {
	max-width: 316px;
	background-image: url(../img/mech2.png)
}
#expert1810 #mech-slide .mech3:before {
	max-width: 306px;
	background-image: url(../img/mech3.png)
}
#expert1810 #mech-slide p {
	margin-bottom: 0;
	font-size: 14px;
	line-height: 1.85;
}
#expert1810 #mech-slide .slick-slide {
	outline: none;
}
/* あくなき挑戦 */
#expert1810 .challenge p {
	text-align: center;
}
/* 質問してみました */
#expert1810 .question h2 {
	margin-bottom: 44px;
}
#expert1810 .question > div {
	display: flex;
	margin: 32px 68px 0;
	padding: 13px 20px 0;
	background: url(../img/dot_line.png) repeat-x 0 0;
}
#expert1810 .question > div:last-child {
	padding-bottom: 32px;
	background: url(../img/dot_line.png) repeat-x 0 0, url(../img/dot_line.png) repeat-x 0 100%;
}
#expert1810 .question h3,
#expert1810 .question p {
	position: relative;
	margin: 0;
	padding-left: 22px;
	font-size: 16px;
	line-height: 1.75;
}
#expert1810 .question h3 span,
#expert1810 .question p span {
	position: absolute;
	left: 0;
}
#expert1810 .question h3 {
	flex: 0 1 448px;
	width: 448px;
}
/* 余計な貫録はつけずに */
#expert1810 .outro {
	margin-bottom: 95px;
}
#expert1810 .outro h2 {
	margin-top: 66px;
}
#expert1810 .outro > div {
	display: flex;
	align-items: center;
	padding: 0 68px 0 88px;
}
#expert1810 .outro p {
	flex: 0 0 auto;
	margin: 0;
}
#expert1810 .outro p:nth-child(1) {
	flex: 0 1 auto;
	width: 500px;
	margin-right: 40px;
	text-align: justify;
}
#expert1810 .outro p:nth-child(2) {
	width: 300px;
	text-align: center;
}
#expert1810 .outro p a {
	display: block;
	position: relative;
	padding: 12px 28px 12px 12px;
	color: inherit;
	border: 1px solid #323232;
	background-color: #fff;
	text-decoration: none;
}
#expert1810 .outro p a:after {
	position: absolute;
	top: 0;
	right: 8px;
	bottom: 0;
	height: 13px;
	margin: auto 0;
	color: #323232;
	font-family: "icomoon";
	font-size: 13px;
	font-weight: bold;
	line-height: 1;
	opacity: 1 !important;
	content: "\e906";
}


@media screen and (min-width: 769px) {
	#expert1810 .question p {
		display: block !important;
		height: auto !important;
		margin: 0 !important;
		padding: 0 0 0 22px !important;
	}
}


@media screen and (max-width: 768px) {
	.product-sp {
		padding: 0 22px;
	}
	#expert1810 {
		max-width: none;
		padding-top: 0;
	}
	#expert1810 section {
		padding-left: 7px;
		padding-right: 7px;
	}
	#expert1810 h2 {
		margin: 48px -7px 15px;
		padding: 0 0 2px;
		font-size: 17px;
		font-size: 4.53vw;
	}
	#expert1810 p {
		margin-bottom: 0;
		font-size: 14px;
		font-size: 3.73vw;
		line-height: 1.9;
	}
	/* メインビジュアル */
	#expert1810 #kv {
		padding: 138px 0 114px;
		font-size: 17.5px;
		font-size: 4.67vw;
		letter-spacing: 1.2px;
	}
	/* 研究の始まり */
	#expert1810 .intro {
		padding: 0 7px;
	}
	#expert1810 .intro h2 {
		margin-left: -7px;
		margin-right: -7px;
	}
	#expert1810 .intro p {
		padding-right: 0;
	}
	#expert1810 .intro h2 + p {
		margin-bottom: 27px;
	}
	#expert1810 .intro p span.img {
		float: right;
		position: static;
		box-sizing: content-box;
		width: 50%;
		padding: 6px 0 0 15px;
		font-size: 13px;
		font-size: 3.47vw;
	}
	#expert1810 .intro span.img img {
		width: 100%;
		margin-bottom: 0;
	}
	/* 理由の追求 */
	#expert1810 .mechanism h2 {
		margin-top: 50px;
	}
	#expert1810 .mechanism h2 + p {
		text-align: justify;
	}
	#expert1810 .mechanism h3 {
		margin: 52px 0 29px;
		padding: 6px 0 8px;
		font-size: 16px;
		font-size: 4.27vw;
	}
	#expert1810 #mech-slide {
		padding: 0;
	}
	#expert1810 #mech-slide .mech {
		width: auto;
		padding: 0;
	}
	#expert1810 #mech-slide .mech:before {
		position: static;
		width: 84vw !important;
		max-width: none !important;
		height: 60vw;
		margin-bottom: 14px;
	}
	#expert1810 #mech-slide .mech1:before {
		background-image: url(../img/sp_mech1.png)
	}
	#expert1810 #mech-slide .mech2:before {
		background-image: url(../img/sp_mech2.png)
	}
	#expert1810 #mech-slide .mech3:before {
		height: 66.9vw;
		background-image: url(../img/sp_mech3.png)
	}
	#expert1810 #mech-slide p {
		font-size: 14px;
		font-size: 3.73vw;
		line-height: 1.6;
	}
	#expert1810 #mech-slide .slick-prev,
	#expert1810 #mech-slide .slick-next {
		margin: 0;
		top: 70px;
		width: 50px;
		padding: 30px 0;
		opacity: 1 !important;
	}
	#expert1810 #mech-slide .slick-prev {
		left: 0;
		padding-left: 18px;
	}
	#expert1810 #mech-slide .slick-next {
		right: 0;
		padding-right: 18px;
	}
	#expert1810 #mech-slide .slick-prev:before,
	#expert1810 #mech-slide .slick-next:before {
		color: #323232;
		font-size: 14px;
		opacity: 1 !important;
	}
	#expert1810 #mech-slide .slick-prev:before {
		float: left;
	}
	#expert1810 #mech-slide .slick-next:before {
		float: right;
	}
	/* あくなき挑戦 */
	#expert1810 .challenge p {
		text-align: justify;
	}
	/* 質問してみました */
	#expert1810 .question h2 {
		margin-bottom: 24px;
	}
	#expert1810 .question > div {
		flex-direction: column;
		margin: 0 8px;
		padding: 3.2vw 0 0 5px;
		background-image: url(../img/sp_dot_line.png);
		background-size: 300px auto;
	}
	#expert1810 .question > div:last-child {
		padding-bottom: 0;
		background-image: url(../img/sp_dot_line.png), url(../img/sp_dot_line.png);
		background-size: 300px auto, 300px auto;
	}
	#expert1810 .question h3,
	#expert1810 .question p {
		padding-left: 1.3em;
		font-size: 14px;
		font-size: 3.73vw;
		line-height: 1.6;
	}
	#expert1810 .question h3 {
		flex: 0 0 auto;
		width: auto;
		margin-bottom: 0.86em;
		cursor: pointer;
	}
	#expert1810 .question h3:after {
		position: absolute;
		top: 4px;
		right: 1px;
		font-family: "icomoon";
		font-size: 13px;
		font-size: 3.47vw;
		line-height: 1;
		content: "\e904";
	}
	#expert1810 .question h3.opened:after {
		content: "\e905";
	}
	#expert1810 .question p {
		display: none;
		padding-top: 3px;
		margin-bottom: 0.79em;
	}
	/* 余計な貫録はつけずに */
	#expert1810 .outro {
		margin-bottom: 45px;
	}
	#expert1810 .outro h2 {
		margin-top: 54px;
	}
	#expert1810 .outro > div {
		flex-direction: column;
		padding: 0;
	}
	#expert1810 .outro p {
		width: 100% !important;
	}
	#expert1810 .outro p:nth-child(1) {
		margin-right: 0;
	}
	#expert1810 .outro p:nth-child(2) {
		margin-top: 23px;
	}
	#expert1810 .outro p a {
		margin: 0 -7px;
		padding: 0.9em 12px;
		font-size: 14px;
		font-size: 3.73vw;
		opacity: 1 !important;
	}
	#expert1810 .outro p a:after {
		right: 9px;
	}
}