@charset "utf-8";
#idea03 {
	width: 996px;
	margin: 0 auto;
}
.idea {
	padding: 0 48px;
	font-size: 14px;
	line-height: 1.8;
}
.idea > h2:first-child {
	overflow: hidden;
	height: 17px;
	margin-bottom: 15px;
	background: url(../images/common/idea.png) no-repeat 50% 0;
	text-align: left;
	text-indent: 100%;
	white-space: nowrap;
}
#idea-kv {
	overflow: hidden;
	width: 760px;
	height: 410px;
	margin: 0 auto;
}
.idea .lead {
	display: table;
	width: 760px;
	margin: 102px auto 66px;
}
.idea .lead h3,
.idea .lead p {
	display: table-cell;
	vertical-align: middle;
}
.idea .lead h3 {
	width: 180px;
	padding-bottom: 10px;
	font-size: 18px;
	line-height: 135%;
}
.idea .lead p {
	width: 580px;
	font-size: 16px;
	line-height: 1.9;
	text-align: justify;
}
.idea ul.nav {
	display: webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	padding: 0;
}
.idea ul.nav li {
	width: 280px;
	margin-right: 30px;
	margin-bottom: -1px;
}
.idea ul.nav li:nth-child(3n) {
	margin-right: 0;
}
.idea ul.nav li a {
	display: block;
	position: relative;
	padding: 10px 22px 10px 12px;
	border: 1px solid #555;
	border-left: none;
	border-right: none;
}
.idea ul.nav li a:after {
	position: absolute;
	top: 0;
	right: 9px;
	bottom: 0;
	width: 13px;
	height: 8px;
	margin: auto 0;
	background: url(../images/common/menu_arrow.png);
	content: "";
}
.idea section {
	margin-top: 75px;
}
.idea section h3 {
	padding: 12px 0 35px;
	border-top: 1px solid #555;
}
.idea section .cont {
	overflow: hidden;
	position: relative;
}
.idea section .cont p {
	text-align: justify;
}
.idea .sec .cont {
	padding-top: 332px;
}
.idea .sec .cont.col2 {
	padding-top: 0;
}
.idea .sec .cont > div {
	float: left;
	width: 430px;
}
.idea .sec .cont > div:first-child {
	margin-right: 40px;
}
.idea .sec .cont img {
	margin-bottom: 32px;
}
.idea .sec .cont > div:first-child img {
	position: absolute;
	top: 0;
	left: 0;
}
.idea .sec .cont > div:last-child img {
	display: none;
}
.idea .sec .cont.col2 > div:first-child img {
	position: static;
}
.idea .sec .cont.col2 > div:last-child img {
	display: block;
}
.idea #idea-recommend h3 {
	margin-bottom: 10px;
}
.idea #idea-slide-book {
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 12px;
	width: 407px;
	height: 334px;
}
.idea #idea-slide-book .slide li {
	padding: 0 40px;
}
.idea #idea-slide-book .bx-controls {
	display: none;
}
.idea #idea-slide-text {
	overflow: hidden;
	width: 430px;
	height: 334px;
	margin-left: 470px;
}
.idea #idea-slide-text .text {
	position: relative;
	height: 334px;
	padding-right: 40px;
}
.idea #idea-slide-text h4 {
	padding: 20px 0 36px 78px;
	background: url(../images/idea-03/book_num.png) no-repeat 2px 26px;
	font-family: "Hiragino Kaku Gothic W6 JIS2004";
	font-size: 18px;
	line-height: 1.5;
}
.idea #idea-slide-text #b2 h4 {
	background-position: 2px -124px;
}
.idea #idea-slide-text #b3 h4 {
	background-position: 2px -274px;
}
.idea #idea-slide-text #b4 h4 {
	background-position: 2px -424px;
}
.idea #idea-slide-text #b5 h4 {
	background-position: 2px -574px;
}
.idea #idea-slide-text h4 small {
	display: block;
	font-family: "Hiragino Kaku Gothic W3 JIS2004";
	font-size: 15px;
}
.idea #idea-slide-text h4 small span {
	color: #646464;
	font-size: 13px;
}
.idea #idea-slide-text ul.b-pager {
	overflow: hidden;
	position: absolute;
	right: 40px;
	bottom: 35px;
	width: 390px;
}
.idea #idea-slide-text ul.b-pager li {
	background: url(../images/idea-03/arrow.png) no-repeat 0 3px;
	font-size: 12px;
	cursor: pointer;
}
.idea #idea-slide-text ul.b-pager li.prev {
	float: left;
	padding-left: 30px;
}
.idea #idea-slide-text ul.b-pager li.next {
	float: right;
	padding-right: 30px;
	background-position: 100% -46px;
	text-align: right;
}
.idea #idea-profile {
	margin-top: 50px;
	padding-bottom: 28px;
}
.idea #idea-profile h3 {
	padding-bottom: 15px;
}
.idea #idea-profile .cont {
	padding-right: 465px;
}
.idea #idea-profile picture {
	position: absolute;
	top: 34px;
	right: 0;
}
.idea #idea-profile h4 {
	margin-bottom: 2px;
	font-size: 16px;
}
.idea #idea-profile p {
	line-height: 1.75;
}
.idea #idea-profile p.link {
	position: absolute;
	top: 335px;
	right: 0;
	text-align: right;
}
.idea #idea-profile p.link a {
	text-decoration: underline;
}
.idea #idea-profile .bnr {
	margin-top: 21px;
}
.idea #idea-profile .bnr .photo {
	height: auto;
}
.idea #idea-profile .bnr .txt {
	padding-top: 25px;
}
@media screen and (min-width: 769px) {
	.idea section .cont {
		display: block !important;
		height: auto !important;
	}
	.idea .sec .cont {
		padding-top: 332px !important;
	}
	.idea .sec .cont.col2 {
		padding-top: 0 !important;
	}
	#idea03 {
		margin-top: 0;
	}
	#idea03 h2 {
		margin-top: 18px;
	}
	#idea03 .sec h3 {
		margin: 0 auto;
	}
	#idea03 .sec .cont p {
		margin: 0 auto;
		font-size: 14px;
		line-height: 1.8;
	}
	#idea03 #idea-recommend #idea-slide-text h4 {
		margin: 0 auto;
	}
	#idea03 #idea-recommend #idea-slide-text h4 + p {
		margin: 0 auto;
		font-size: 14px;
		line-height: 1.8;
	}
	#idea03 #idea-recommend #idea-slide-text .b-pager {
		padding-right: 0;
	}
	#idea03 #idea-profile h3,
	#idea03 #idea-profile .cont h4,
	#idea03 #idea-profile .cont h4 + p,
	#idea03 #idea-profile .cont .link {
		margin: 0 auto;
	}
	#idea03 #idea-profile .cont h4 {
		margin-bottom: 2px;
	}
}
@media screen and (max-width: 768px) {
	#idea03 {
		width: auto;
		padding: 0 22px;
	}
	.idea {
		padding: 0;
	}
	.idea > h2:first-child {
		width: 98px;
		height: 14px;
		margin: 17px auto;
		background-image: url(../images/common/sp/idea.png);
		background-size: auto 14px;
	}
	#idea-kv {
		width: auto;
		height: auto;
		margin-left: -22px;
		margin-right: -22px;
	}
	#idea-kv img {
		width: 100%;
		height: auto;
	}
	.idea .lead {
		display: block;
		width: auto;
		margin: 24px 0 33px;
	}
	.idea .lead h3,
	.idea .lead p {
		display: block;
	}
	.idea .lead h3 {
		width: auto;
		margin-top: 0;
		padding-bottom: 30px;
		font-size: 18px;
		font-size: 4.8vw;
		text-align: center;
	}
	.idea .lead p {
		width: auto;
		font-size: 14px;
		font-size: 3.73vw;
	}
	.idea .lead + h2 {
		margin-bottom: 16px;
		font-size: 18px;
		font-size: 4.8vw;
		letter-spacing: 1px;
	}
	.idea ul.nav {
		display: none;
	}
	.idea section {
		margin-top: 0;
	}
	.idea section h3 {
		position: relative;
		margin-top: 0;
		padding: 9px 28px 8px 7px !important;
		font-size: 17px;
		font-size: 4.53vw;
		cursor: pointer;
	}
	.idea section h3:after {
		position: absolute;
		top: 20px;
		right: 7px;
		width: 13px;
		height: 8px;
		background: url(../images/idea-03/sp/menu_arrow.png) no-repeat 50% 0;
		background-size: 13px auto;
		content: "";
	}
	.idea section h3.close:after {
		background-position: 50% 100%;
	}
	.idea section .cont {
		padding-bottom: 25px;
	}
	.idea section .cont p {
		padding-bottom: 10px;
		font-size: 14px;
		font-size: 3.73vw;
	}
	.idea .sec .cont {
		padding-top: 0;
	}
	.idea .sec .cont > div {
		float: none;
		width: auto;
	}
	.idea .sec .cont > div:first-child {
		margin-right: 0;
	}
	.idea .sec .cont img {
		width: 100%;
		height: auto;
		margin: 18px 0 22px;
	}
	.idea .sec .cont > div:first-child img {
		position: static;
	}
	.idea .sec .cont > div:last-child img {
		display: block;
	}
	.idea #idea-sec4 .cont p {
		padding-bottom: 0;
	}
	.idea #idea-recommend h3 {
		margin-bottom: 0;
	}
	.idea #idea-slide-book {
		position: relative;
		top: auto;
		left: auto;
		width: auto;
		height: auto;
	}
	.idea #idea-slide-book .slide li {
		padding: 0;
	}
	.idea #idea-slide-book picture {
		display: block;
		position: static;
		padding: 15px 0 30px;
	}
	.idea #idea-slide-book picture img {
		width: 100%;
		height: auto;
	}
	.idea #idea-slide-book .bx-controls {
		display: block;
	}
	.idea #idea-slide-book a.bx-prev,  .idea #idea-slide-book a.bx-next {
		overflow: hidden;
		display: block;
		position: absolute;
		top: 100px;
		top: 26.5vw;
		width: 30px;
		height: 60px;
		background: url(../images/idea-03/sp/arrow.png) no-repeat 0 20px;
		background-size: auto 15px;
		text-decoration: none;
		text-indent: 100%;
		white-space: nowrap;
	}
	.idea #idea-slide-book a.bx-prev {
		left: 0;
	}
	.idea #idea-slide-book a.bx-next {
		right: 0;
		background-position: 100% 20px;
	}
	.idea #idea-slide-text {
		width: auto;
		height: auto;
		margin-left: 0;
	}
	.idea #idea-slide-text .text {
		height: auto;
		padding: 0;
	}
	.idea #idea-slide-text h4 {
		position: relative;
		padding: 0 0 22px 84px;
		background: none;
		font-size: 17px;
		font-size: 4.53vw;
	}
	.idea #idea-slide-text h4:before {
		position: absolute;
		top: 10px;
		top: 2.67vw;
		left: 6px;
		width: 48px;
		height: 46px;
		background: url(../images/idea-03/sp/book_num.png) no-repeat 0 0;
		background-size: auto 46px;
		content: "";
	}
	.idea #idea-slide-text #b2 h4:before {
		background-position: -100px 0;
	}
	.idea #idea-slide-text #b3 h4:before {
		background-position: -200px 0;
	}
	.idea #idea-slide-text #b4 h4:before {
		background-position: -300px 0;
	}
	.idea #idea-slide-text #b5 h4:before {
		background-position: -400px 0;
	}
	.idea #idea-slide-text h4 small {
		font-size: 82.4%;
	}
	.idea #idea-slide-text h4 small span {
		display: block;
		font-size: 85.7%;
	}
	.idea #idea-slide-text ul.b-pager {
		display: none;
	}
	.idea #idea-profile {
		margin-top: 0;
		padding-bottom: 0;
	}
	.idea #idea-profile .cont {
		padding-right: 0;
		padding-bottom: 20px;
	}
	.idea #idea-profile picture {
		position: static;
	}
	.idea #idea-profile picture img {
		width: 100%;
		height: auto;
		margin: 21px 0 22px;
	}
	.idea #idea-profile h4 {
		margin-bottom: 14px;
		font-size: 17px;
		font-size: 4.53vw;
	}
	.idea #idea-profile p {
		line-height: 1.85;
	}
	.idea #idea-profile p.link {
		position: static;
		text-align: left;
	}
	#idea03 .lead h3 {
		margin: 0 auto;
	}
	#idea03 .lead h3 + p {
		margin: 0 auto;
	}
	#idea03 .sec h3 {
		margin-bottom: 0;
	}
	#idea03 .sec .cont p {
		margin: 0 auto;
		font-size: 14px;
		font-size: 3.73vw;
		line-height: 1.8;
	}
	#idea03 #idea-recommend #idea-slide-text h4 {
		margin: 0 auto;
	}
	#idea03 #idea-recommend #idea-slide-text h4 + p {
		margin: 0 auto;
		font-size: 14px;
		font-size: 3.73vw;
		line-height: 1.8;
	}
	#idea03 #idea-recommend #idea-slide-text .b-pager {
		padding-right: 0;
	}
	#idea03 #idea-profile h3,
	#idea03 #idea-profile .cont h4 + p,
	#idea03 #idea-profile .cont .link {
		margin: 0 auto;
	}
	#idea03 #idea-profile .cont h4 {
		margin: 0 auto 14px;
	}
}