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

	.switch_sp {
        display: block !important;
    }

    .switch_pc {
        display: none !important;
    }

	br { display: none;}
	br.sp {display: block;}

	img { width: 100%;}


	.section {
		margin-bottom: 62px;
	}
	.section.gray {
		padding: 25px 0 50px;
		background: #e0e0e0;
	}

	/* メインビジュアル */
	#main_visual {
		width: 100%;
		position:relative;
		margin-bottom: 30px;
	}
	.kv-video {
		position: relative;
		/* aspect-ratio: 375 / 469; */
		aspect-ratio: 3 / 4;
		background-color: #E2E6E5;
	}

	/* section */
	.section h3 {
		color: #444;
		margin: 0 25px 22px;
		font-size: 23px;
		font-weight: normal;
		text-align: center;
	}
	.section h3 span {
		width: 160px;
		padding: 0 0 10px;
		border-bottom: 3px solid #444;
		display: inline-block;
		white-space: nowrap;
	}

	.block {
		margin: 0 0 34px;
	}

	.block .block_copy {
		color: #444;
		font-size: 23px;
		font-weight: normal;
		line-height: 32px;
		margin: 0 10px 5px;
	}

	.link {
		margin: 0 20px 6px;
		font-size: 13px;
		line-height: 24px;
		text-align: center;
	}

	.link a {
		color: #0064a1;
	}

	.link a:after{
		content: '';
		width: 10px;
		height: 10px;
		display: inline-block;
		background-image:url(../common/img/parts_ico_btn_detail_arrow.png);
		background-repeat: no-repeat;
		background-position: center top;
		background-size: 10px 10px;
		position: relative;
		top: 0;
		right: -5px;
	}

	.section .link.frame a {
		padding: 12px 24px 12px 18px;
		border: 1px solid #0064a1;
		border-radius: 2px;
		background: none;
	}


	 /* インフォメーション */
    #section_info {
        border-top: 1px solid #dbdbdb;
        border-bottom: 1px solid #dbdbdb;
        padding: 20px 0;
        margin: 0 20px 50px;
    }
    #section_info li {
        font-size: 12px;
        line-height: 18px;
        color: #444;
    }


	/* ピックアップ */
	#section_special .img_slider .slider_inner {
		padding: 0;
		overflow: hidden;
	}

	#section_special p.block_copy
	{
		text-align: center;
	}

	#section_special p.block_copy_desc {
		text-align: center;
		font-size: 13px;
		margin-top: 10px;
	}

#section_special .img_slider .slick-active img{



}

#section_special .img_slider .no-zoom-anim.slick-active img{
		animation-name: none;
	}

	#section_special .img_slider .slider_inner
	{
		position: relative;
	}

	#section_special .img_slider div
	{
		margin: 0;
	}


		#section_special .img_slider .door-anim.slick-active {
		position: relative;
		/* height: 100%; */
	}

	#section_special .img_slider .door-anim p{
		position: absolute;
		overflow: hidden;
	}

	#section_special .img_slider .door-anim p img{
		position: relative;
		transition: none;
	}

	#section_special .img_slider .door-anim .scene-1{
		position: relative;
	}

	#section_special .img_slider .door-anim .scene-2{
		/* width: 100%; */
		top: 0;
		/* left: 0; */

	}

	#section_special .img_slider .door-anim .scene-3{
		/* width: 100%; */
		top: 0;
		/* left: 0; */

	}



.kill_anim{

animation-name: none !important;

}




	@keyframes move {
0% { transform: scale(1) rotate(0.001deg); }
100% { transform: scale(1.2) rotate(0.001deg); }
}

	/* シーン別 */
	#block_scene .block_inner {
		width: 100%;
		font-size: 0;
		position: relative;
		overflow: hidden;
	}

	#block_scene .block_inner::after {
		content: "";
		width: 100%;
		height: 1px;
		position: absolute;
		bottom: 0;
		left: 0;
		background-color: #fff;
	}

	#block_scene .block_inner .img {
		position: relative;
		overflow: hidden;
	}

	#block_scene .block_inner img {
		width: 100%;
		height: auto;
		position: relative;
	}

	#block_scene .block_inner .left_block {
		width: 48.87%;
		float: left;
	}

	#block_scene .block_inner .left_block > div p {
		width: 50%;
		float: left;
	}

	#block_scene .block_inner .center_block {
		width: 20.16%;
		float: left;
	}

	#block_scene .block_inner .img06 {
		width: 30.97%;
		float: left;
	}



	/* アイテム */
	#section_items {
		margin-bottom: 0;
	}

	.item_list {
		margin: 0 18px;
	}

	.item_list li {
		position: relative;
		margin: 0 0 13px;
		background-color: #fff;
	}

	#section_items .item_list li a {
		color: #444;
	}

	#section_items .box_flex {
		display: flex;
		justify-content: flex-start;
	}

	#section_items .item_list .img {
		width: calc(202 / 750 * 100vw);
		position: relative;
		overflow: hidden;
	}

	#section_items .item_list .img img {
		width: 100%;
		vertical-align: middle;
		object-fit: cover;
	}

	.item_list li .box {
		padding: 6px 7px;
		box-sizing: border-box;
	}

	.item_list li .box h4 {
		margin: 0 0 15px;
		font-size: calc(24 / 750 * 100vw);
		font-weight: normal;
		line-height: 1.6;
	}

	.item_list li .box .copy {
		margin: 0 0 15px;
		font-size: 16px;
		line-height: 24px;
		text-align: center;
	}

	.item_list li .box > *:last-child {
		margin-bottom: 0;
	}

	#section_items .item_list .link {
		margin: 0;
		position: absolute;
		right: 2.4vw;
		bottom: 2vw;
		color: #000;
		font-size: 2.7vw;
		text-align: left;
		line-height: 1.2;
	}

	#section_items .item_list .link::after {
		position: relative;
		top: .5vw;
		content: "";
		display: inline-block;
		margin-left: 5px;
		width: 2.7vw;
		height: 2.9vw;
		background: url(../img/parts_ico_red_arrow.png) center no-repeat;
		background-size: 2.7vw auto;
		display: inline-block;
	}

	#section_items .section_inner {
		padding: 0 15px;
	}

	.banner_acollect {
		margin: 40px 15px 0;
	}

	.banner_acollect .pc {
		display: none;
	}


	/* --* enquete *-- */
	.enquete {
		position: relative;
		background-color: #303030;
		border-radius: 7px;
		width: 85%;
		margin: 0 auto;
		margin-bottom: 10vw;
	}

	.enquete a {
		display: block;
		color: #fff !important;
		text-decoration: none !important;
		line-height: 1.5em;
		font-size: 3vw;
		background: url(../common/img/parts_ico_btn_detail_arrow_w.png) right center no-repeat;
		background-size: 20px auto;
		background-position: center right 10px;
		padding: 10px;
		padding-right: 40px;
	}

	.enquete a small {
		font-size: 10px;
	}



	#section_items .bnr{
		margin: 80px 15px 0;
		text-align: center;
	}
	#section_items.section.gray{
		padding-bottom: 40px;
	}

	/* タブ */
	.section_special-tab {
		background-color: #e5e5e5;
		padding-bottom: 42px;
		margin-top: 16px;
		padding: 18px 0;
	}

	.tab-single__btn {
		position: relative;
		display: block;
		height: 40px;
		margin-top: -1px;
		margin-left: 22px;
		margin-right: 22px;
		cursor: pointer;
		z-index: 1;
	}

	.tab-single__btn::before {
		content: "";
		position: absolute;
		right: 0;
		top: 0;
		bottom: 0;
		width: 40px;
		display: block;
		background-color: #8f692f;
		z-index: 2;
	}

	.tab-single__btn::after {
		content: "";
		width: 8px;
		height: 8px;
		border-right: 2px solid #fff;
		border-top: 2px solid #fff;
		-webkit-transform: rotate(135deg);
		transform: rotate(135deg);
		display: block;
		vertical-align: middle;
		margin: 0 0 0;
		position: absolute;
		right: 15px;
		top: 13px;
		z-index: 3;
		transition: all .2s;
	}

	.tab-single__btn button {
		position: absolute;
		background-color: #fff;
		color: #666666 !important;
		border: 1px solid #acacac;
		text-align: left;
		padding: 0 15px;
		font-size: 14px;
		line-height: 20px;
		cursor: default;
		pointer-events: none;
		width: calc(100% - 39px);
		height: 100%;
		font-family: "HondaGlobalFontJP-Regular", sans-serif;
	}

	.tab-single__btn button[aria-selected='false'] {
		opacity: 0;
		visibility: hidden;
	}

	.tab-single__btn button#tab-1[aria-selected='false'] {
		bottom: calc(100% - 1px);
	}

	.tab-single__btn button#tab-2[aria-selected='false'] {
		top: calc(100% - 1px);
	}

	.tab-single__btn[data-active='true']::after {
		-webkit-transform: rotate(-45deg);
		transform: rotate(-45deg);
		top: 17px;
	}

	.tab-single__btn[data-active='true'] button[aria-selected='true'] {
		opacity: .7;
		background-color: #dadada;
	}

	.tab-single__btn[data-active='true'] button[aria-selected='false'] {
		cursor: pointer;
		pointer-events: all;
		opacity: 1;
		visibility: visible;
	}

	.tab-single__body {
		width: 90%;
		margin: 16px auto 0;
	}

	.tab-single__body[aria-hidden='false'] {
		display: block;
		opacity: 0;
		visibility: hidden;
		animation: tabOpen 400ms ease 200ms 1 forwards;
	}

	.tab-single__body[aria-hidden='true'] {
		display: none;
	}

	.tab-single__body ul {
		display: flex;
		flex-flow: wrap;
		gap: 19px 0;
	}

	.tab-single__body ul li {
		width: 100%;
	}

	.tab-single__body ul img {
		display: block;
	}
}

@keyframes tabOpen {
	0% {
		opacity: 0;
		visibility: hidden;
	}

	100% {
		opacity: 1;
		visibility: visible;
	}
}