@charset "UTF-8";

.r10 {
	border-radius: 10px;
}

img.r10 {
	max-width: 100%;
}

.mb00 {
	margin-bottom: 0 !important;
}

.scroll-fade {
	opacity: 0;
}

.mag-article {
	line-height: 1.6;
}

#honda-magazine .tate {
	writing-mode: vertical-rl;
}

#honda-magazine.mag-article .title {
	font-family: "秀英角ゴシック銀 B";
}

.p-mv__days,
.p-mv__mainText,
.p-readContents__title,
.p-thankComment__text,
.p-thankComment__text--red,
.p-thankComment__bigText,
.p-sevenComment__heading,
.p-sevenComment__headingBg--marginSmall,
.p-fifthComment__heading,
.p-fourthComment__heading,
.p-fourthComment__headingBg--marginSmall,
.p-firstComment__heading,
.p-firstComment__headingBg--marginSmall,
.p-readContents__black,
.p-readContents__text,
#honda-magazine .rel .example,
#honda-magazine .rel .example1,
#honda-magazine .rel .example2,
#honda-magazine .rel .example3,
#honda-magazine .rel .example4,
#honda-magazine .rel .example5,
#honda-magazine .rel .example6,
#honda-magazine .rel .example7,
#honda-magazine .rel .example8,
#honda-magazine .rel .example9 {
	font-family: var(--font-bold);
}

#honda-magazine .full-img {
	background: #FFFFFF;
}


#honda-magazine .tate .text-combine {
	-webkit-text-combine: horizontal;
	-ms-text-combine-horizontal: all;
	text-combine-upright: all;
}

#honda-magazine .tate .inline {
	position: relative;
	display: inline;
}


.article-inner {
	max-width: 980px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	display: block;
}

#honda-magazine .mag-article-visual h3.tate:before {
	display: none;
}

#honda-magazine .mag-article-visual h3.tate {
	background: none;
	font-size: 60px;
	line-height: 1.6;
}

.mag-article-visual .top-inner {
	position: relative;
	display: flex;
	justify-content: flex-end;
	max-width: 980px;
	margin: 0 auto;
	height: calc(100% - 81px);
	z-index: 1;
}

.mag-article-visual .top-inner .caption {
	position: absolute;
	left: 20px;
	font-weight: 600;
	bottom: 30px;
	color: #FFFFFF;
}

#honda-magazine .mag-article-visual .top-inner .caption .date {
	font-size: 10px;
	width: 24px;
	height: 78px;
	background: #D20100;
	margin-right: 25px;
}

#honda-magazine .mag-article-visual .top-inner .caption .date,
#honda-magazine .mag-article-visual .top-inner .caption .text {
	display: flex;
	justify-content: center;
	align-items: center;
}

#honda-magazine .mag-article-visual .top-inner .caption .text {
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	padding-top: 12px;
}

#honda-magazine .mag-article-visual .top-inner .caption .text>span {
	position: relative;
	font-size: 16px;
	text-align: left;
}

#honda-magazine .mag-article-visual .top-inner .caption .text>span:nth-child(1) {
	font-size: 20px;
	font-weight: 800;
}

#honda-magazine .mag-article-visual .abs.scrollBottom {
	bottom: 20px;
	left: 0;
	right: 0;
	margin-left: auto;
	margin-right: auto;
	z-index: 1;
}

#honda-magazine ul.breadcrumb {
	display: flex;
	height: 50px;
	align-items: flex-start;
}

#honda-magazine ul.breadcrumb li {
	list-style: none;
	padding-right: 14px;
	position: relative;
	display: block;
}

#honda-magazine ul.breadcrumb li:last-child {
	position: relative;
	padding-right: 0px;
}

#honda-magazine ul.breadcrumb li a,
#honda-magazine ul.breadcrumb li span {
	font-size: 14px;
	color: #000000;
}

#honda-magazine ul.breadcrumb li :after {
	content: "/";
	display: block;
	position: absolute;
	width: 10px;
	height: 100%;
	top: 0px;
	right: 2px;
}

#honda-magazine ul.breadcrumb li:last-child :after {
	display: none;
}

#honda-magazine ul.breadcrumb li a {
	text-decoration: none;
}

@media screen and (max-width:767px) {
	#honda-magazine ul.breadcrumb {
		display: block;
		height: auto;
		padding-left: 15px;
		padding-right: 15px;
		font-size: 12px;
	}

	#honda-magazine ul.breadcrumb li {
		display: inline;
		padding-right: 5px;
	}

	#honda-magazine ul.breadcrumb li ::after {
		display: inline;
		position: relative;
		width: 10px;
		height: 100%;
		top: auto;
		right: auto;
		padding-left: 5px;
		text-decoration: none;
	}
}


.magContents.subMagContents {
	max-width: 100%;
}

.mag-article-visual {
	height: 590px;
}

.mag-article-area {
	background: #FFFFFF;
}

#honda-magazine .mag-article-visual:before,
#honda-magazine .mag-article-visual2:after {
	content: '';
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat !important;
	background-size: cover;
	z-index: 0;
	min-height: 590px;
}

#honda-magazine .mag-article-visual2:after {
	left: auto;
	right: 0;
	width: 50%;
	height: 85%;
}

#honda-magazine .mag-article-visual2:before {
	width: 50%;
	height: 85%;
}

@media screen and (max-width:768px) {

	#honda-magazine .mag-article-visual2:before,
	#honda-magazine .mag-article-visual2:after {
		height: 267px;
		left: 0;
		right: 0;
		width: 100%;
		min-height: inherit;
	}

	#honda-magazine .mag-article-visual2:before {
		top: 267px;
	}
}

#honda-magazine .subMagContents .h2Area {
	max-width: 980px;
	margin: 0 auto;
	padding-left: 0;
	z-index: 1;
	filter: drop-shadow(0px 3px 5px rgba(0, 0, 0, 0.3));
}

#honda-magazine .mag-article-main .tate {
	z-index: 1;
}

#honda-magazine .mag-article-main .tate .inline {
	background: #FFFFFF;
	padding: 5px;
	font-size: 20px;
}

#honda-magazine .mag-article-main .photo1B1S {
	display: flex;
	justify-content: center;
	align-items: flex-end;
	padding: 50px 0 200px;
}

#honda-magazine .mag-article-main .photo1B1S .tate {
	margin-left: 35px;
}

#honda-magazine .mag-article-main .photo1B1S .imgB>img {
	margin-right: -30px;
	margin-top: 50px;
}

#honda-magazine .mag-article-main .photo1B1S .imgS>img {
	margin-left: -16px;
	margin-bottom: -140px;
}

#honda-magazine .mag-article-flexBlock {
	justify-content: center;
	align-items: center;
	margin: 70px auto;
	padding: 0 15px;
}

#honda-magazine .mag-article-flexBlock.mb00 {
	padding-bottom: 70px;
}

#honda-magazine .mag-article-flexBlock> :nth-child(1) {
	margin-right: 80px;
}

#honda-magazine .mag-article-flexBlock .article {
	flex-direction: column;
	max-width: 410px;
}

#honda-magazine .mag-article-flexBlock .article .title {
	font-size: 24px;
	margin-bottom: 30px;
}

#honda-magazine .mag-article-flexBlock .article .text {
	font-size: 16px;
}

#honda-magazine .mag-article-center {
	justify-content: flex-start;
	align-items: flex-start;
	flex-direction: column;
	width: 100%;
	padding: 150px 0px 0px 0px;
	max-width: 600px;
	margin-left: auto;
	margin-right: auto;
}

#honda-magazine .mag-article-center.tate {
	max-width: inherit;
	align-items: flex-start;
	justify-content: center;
}

#honda-magazine .mag-article-center .title {
	font-size: 24px;
	margin-bottom: 35px;
	font-weight: 900;
}

#honda-magazine .mag-article-center.tate .title {
	margin-left: 35px;
	margin-bottom: auto;
}

#honda-magazine .mag-article-center .text {
	font-size: 16px;
}

#honda-magazine .profileArea {
	background: #F0F0F0;
	padding: 30px 15px;
}

#honda-magazine .profileArea .article-inner {
	max-width: 980px;
}

#honda-magazine .profileArea .article-inner> :nth-child(1) {
	width: 28px;
	margin-right: 10px;
	font-weight: 600;
	font-size: 24px;
}

#honda-magazine .profileArea .article-inner> :nth-child(2) {
	width: 350px;
	margin-right: 70px;
}

#honda-magazine .profileArea .article-inner> :nth-child(3) {
	width: calc(100% - 462px);
	align-self: center;
}

#honda-magazine .profileArea .article-inner>.info .name {
	font-size: 16px;
	font-weight: 800;
	display: block;
}

#honda-magazine .profileArea .article-inner>.info .division {
	font-size: 11px;
	font-weight: 600;
	display: block;
}

#honda-magazine .profileArea .article-inner>.info .text {
	font-size: 11px;
	font-weight: 400;
	display: block;
}

#honda-magazine .profileArea .article-inner>.info hr {
	border: none;
	outline: none;
	border-top: 1px solid #D1D1D1;
	display: block;
	margin: 15px auto;
	width: 100%;
}

#honda-magazine a.mag-btn {
	display: block;
	background: #000;
	color: #FFF;
	width: 100%;
	height: 60px;
	text-decoration: none;
	line-height: 60px;
	font-size: 18px;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}

#questionnaire {
	background: #D2DBE5;
	padding: 40px 10px;
}

#questionnaire.answered .inner:before,
#questionnaire.answered .inner:after {
	content: '';
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 9;
}

#questionnaire.answered .inner:before {
	background: rgba(0, 0, 0, 0.7);
	border-radius: 10px;
}

#questionnaire.answered .inner:after {
	font-family: "秀英角ゴシック銀 B";
	content: 'ご意見ありがとうございます。';
	display: flex;
	justify-content: center;
	text-align: center;
	align-items: center;
	font-size: 23px;
	color: #FFFFFF;
}

#questionnaire .inner {
	width: 100%;
	max-width: 980px;
	margin-left: auto;
	margin-right: auto;
	background: #FFFFFF;
	border-radius: 10px;
	padding: 8px;
	position: relative;
}

#questionnaire .inner .waku {
	background: #FCF8F0;
	border-radius: 6px;
	border: 4px solid #041D41;
	padding: 20px 10px 30px;
}

#questionnaire .inner .waku>p {
	color: #041D41;
	font-weight: 800;
	font-size: 18px;
	text-align: center;
	margin-bottom: 15px;
}

#questionnaire .inner .waku>ul {
	width: 100%;
	max-width: 580px;
	margin-left: auto;
	margin-right: auto;
}

#questionnaire .inner .waku>ul li {
	text-align: center;
	cursor: pointer;
}

#questionnaire .inner .waku>ul li img {
	-webkit-transition: 0.2s ease-out;
	transition: 0.2s ease-out;
}

#questionnaire .inner .waku>ul li span {
	font-size: 14px;
	color: #262626;
}

#topBgMovie {
	pointer-events: none;
	position: fixed;
	display: block;
	top: -10%;
	left: 50%;
	transform: translateX(-50%);
}

#topBgMovie .js-topBg-movie {
	position: relative;
	width: 100%;
	height: 0;
	padding-bottom: 56.25%;
	overflow: hidden;
}

#topBgMovie .js-topBg-movie video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: none;
}

.btnPlayMovie {
	width: 240px;
	height: 60px;
}

#honda-magazine .article-inner .btnPlayMovie {
	margin: 30px auto 0;
	outline: 2px solid #262626 !important;
	border-radius: 6px;
}

.top-inner .btnPlayMovie {
	bottom: 40px;
	right: 20px;
}

.btnPlayMovie img {
	display: block;
	width: 100%;
}

.btnPlayMovie img.abs {
	opacity: 0;
	left: 0;
	top: 0;
	-webkit-transition: 0.2s ease-out;
	transition: 0.2s ease-out;
}

.article-inner .btnPlayMovie img.abs {
	opacity: 1;
}

.img3Area.flexBlock {
	padding-bottom: 50px;
}

.img3Area.flexBlock>div {
	width: 50%;
	margin-top: 100px;
	margin-right: 40px;
}

.img3Area.flexBlock>div:last-child {
	margin-right: 0;
	padding: 15px 15px 15px;
}

.img3Area.flexBlock>div>img {
	width: 100%;
	display: block;
}

.img4Area.flexBlock {
	padding-bottom: 50px;
}

.img4Area.flexBlock>div {
	width: 50%;
	margin-top: 10px;
	margin-right: 20px;
}

.img4Area.flexBlock>div:last-child {
	margin-right: 0;
}

.img4Area.flexBlock>div>img {
	width: 100%;
	display: block;
}

.bannerArea {
	width: 90%;
	max-width: 800px;
	margin: 0 auto 60px;
}

.bannerArea {
	width: 90%;
	max-width: 800px;
	margin: 0 auto 60px;
}

.bannerArea>a {
	position: relative;
	display: block;
}

.bannerArea>a>img {
	width: 100%;
	-webkit-transition: 0.2s ease-out;
	transition: 0.2s ease-out;
}

@media screen and (min-width:769px) {
	#questionnaire .inner .waku>ul li:hover img {
		transform: rotate(15deg) scale(0.9, 0.9);
	}

	.bannerArea>a:hover>img {
		opacity: 0.7;
	}

	.p-fifthComment__imageBox2>a:hover>img {
		opacity: 0.7;
	}

	.btnPlayMovie:hover img.abs {
		opacity: 1;
	}
}

@media screen and (max-width:768px) {
	#honda-magazine br {
		display: inherit !important;
	}

	.img3Area.flexBlock {
		flex-wrap: wrap;
	}

	.img3Area.flexBlock>div {
		width: 100%;
		margin-right: 0;
	}

	.img4Area.flexBlock {
		flex-wrap: wrap;
	}

	.img4Area.flexBlock>div {
		width: 100%;
		margin-right: 0;
	}

	.article-inner .btnPlayMovie.sp-in {
		display: block !important;
	}


	.magContents {
		padding-top: 20px;
	}

	.mag-article-visual {
		height: 475px;
	}

	.hasMovie .mag-article-visual {
		height: 100vw;
	}

	#honda-magazine .mag-article-visual h3.tate {
		font-size: 32px;
	}

	#honda-magazine .subMagContents .h2Area h2 {
		margin: 0 0 15px 15px;
	}

	#honda-magazine .mag-article-visual .top-inner .caption .text>span:nth-child(1) {
		font-size: 14px;
	}

	#honda-magazine .mag-article-visual .top-inner .caption .text>span {
		font-size: 10px;
	}

	#honda-magazine .mag-article-visual .top-inner .caption .date {
		margin-right: 10px;
	}

	.mag-article-visual .top-inner {
		height: calc(100% - 67px);
	}

	#honda-magazine .mag-article-visual .abs.scrollBottom {
		width: 30px;
		height: 30px;
		bottom: 12px;
	}

	#honda-magazine .mag-article-main .tate .inline {
		font-size: 16px;
	}

	#honda-magazine .mag-article-main .photo1B1S .tate {
		margin-left: 30px;
	}

	#honda-magazine .mag-article-main .photo1B1S {
		flex-direction: column;
		justify-content: center;
		align-items: flex-end;
		padding: 50px 0 100px;
	}

	#honda-magazine .mag-article-main .photo1B1S .imgS>img {
		margin-left: auto;
		margin-right: 20px;
		margin-bottom: 0px;
		width: 60%;
		margin-top: -10px;
	}

	#honda-magazine .mag-article-flexBlock {
		margin: 30px auto;
		flex-direction: column;
	}

	#honda-magazine .mag-article-flexBlock .article {
		max-width: 100%;
		margin-bottom: 20px;
	}

	#honda-magazine .mag-article-flexBlock> :nth-child(1) {
		margin-right: 0;
	}

	#honda-magazine .mag-article-center .title,
	#honda-magazine .mag-article-flexBlock .article .title {
		font-size: 24px;
		font-weight: 900;
		margin-bottom: 20px;
	}

	#honda-magazine .mag-article-center .text,
	#honda-magazine .mag-article-flexBlock .article .text {
		font-size: 14px;
	}

	#honda-magazine .mag-article-center {
		padding: 90px 15px;
	}

	#honda-magazine .mag-article-center.tate .title {
		font-size: 16px;
		margin-left: 25px;
	}

	#honda-magazine .mag-article-center.tate .text {
		font-size: 14px;
	}

	#honda-magazine .mag-article-flexBlock.mb00>.img {
		margin-bottom: 20px;
	}

	#honda-magazine .profileArea .article-inner {
		flex-direction: column;
		max-width: 320px;
		margin-left: auto;
		margin-right: auto;
	}

	#honda-magazine .profileArea .article-inner> :nth-child(2) {
		width: 100%;
		margin: 10px auto 35px;
	}

	#honda-magazine .profileArea .article-inner> :nth-child(2) img {
		width: 100%;
	}

	#honda-magazine .profileArea .article-inner> :nth-child(1) {
		writing-mode: horizontal-tb;
	}

	#honda-magazine .profileArea .article-inner> :nth-child(3) {
		width: 100%;
		align-self: auto;
	}

	#questionnaire {
		padding: 20px 10px;
	}

	#questionnaire .inner .waku {
		border: 2px solid #041D41;
		padding: 10px 15px 20px;
	}

	#questionnaire .inner .waku>p {
		font-size: 14px;
	}

	#questionnaire .inner .waku>ul li {
		min-width: 72px;
	}

	#questionnaire .inner .waku>ul li span {
		font-size: 12px;
	}

	#questionnaire .inner .waku>ul li img {
		width: 54px;
		height: auto;
		margin-left: auto;
		margin-right: auto;
	}

	#questionnaire .inner .waku>ul {
		max-width: 360px;
		text-align: center;
	}

	#questionnaire.answered .inner:after {
		font-size: 16px;
	}
}

@media screen and (min-width: 768px) {
	.pc {
		display: inline;
	}

	.sp {
		display: none;
	}
}

.pc {
	display: none;
}

.sp {
	display: inline;
}



.mark1 {
	background: linear-gradient(transparent 0%, yellow 0%);
}


.mark2 {
	background: linear-gradient(transparent 0%, #232323 0%);
	color: #fff;
	font-size: 18px;
}

.mark3 {
	background: linear-gradient(transparent 0%, #CC0000 0%);
	color: #fff;
	font-size: 18px;
}

.border {
	text-decoration: underline;
	text-decoration-color: #35363B;
}

.background-color2 {
	background: #F2F2F2;
	margin: 0 calc(50% - 50vw);
	padding: 4px calc(50vw - 50% + 8px);
	width: auto;
	padding-top: 0.8em;
	padding-bottom: 2.8em;
}

.otachinasai {
	text-combine-upright: all;
}