@charset "utf-8";
@media screen and (max-width : 768px){
	.u-sp-show{
		display: block;
	}
	.u-sp-hide{
		display: none;
	}

	img{
		width: 100%;
	}

	#contents_area{
		color: #666666;
	}
	#contents_area br{
		display: block !important;
	}

	.container{
		width: 100%;
		margin: 0 auto;
	}

	/* hero */
	.hero{
		width: 100%;
		height:133.333vw;
		text-align: center;
	}
	.hero-row__top{
		width: 100%;
		height:44.667vw;
		background: #99CDD3;
	}
	.hero-row__top .container{
		height: 100%;
		position: relative;
	}
	.hero-row__top img{
		position: absolute;
		left: 0;
		top: 3.467vw;
		width: 100%;
		z-index: 1;
	}
	.hero-row__copy{
		width: 100%;
		height:30.667vw;
		background: #4A9AB3;
		position: relative;
	}
	.hero-row__copy .box{
		position: absolute;
		top: 4.533vw;
		left: 50%;
		transform: translateX(-50%);
		z-index: 2;
	}
	.hero-row__copy .box h2{
		width: 93.333vw;
		margin: 0 auto;
	}
	.hero-row__copy .box p{
		font-family: "Hiragino Kaku Gothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", Meiryo, sans-serif;
		margin-top:2.133vw;
		font-size: 3.597vw;
		/*font-size: 3.467vw;*/
		font-weight: bold;
		line-height: 1.6;
		letter-spacing: 0.068em;
		color: #fff;
		text-align: center;
		white-space: nowrap;
		font-feature-settings: normal;
	}
	.hero-row__bottom{
		width: 100%;
		height:58vw;
		background: #99CDD3;
	}
	.hero-row__bottom .container{
		width: 100%;
		height: 100%;
		position: relative;
	}
	.hero-row__bottom img{
		position: absolute;
		bottom:0;
		left: 0;
		width: 100%;
		z-index: 1;
	}

	/* new_item */
	.new_item{
		width: 100%;
		padding-bottom: 50px;
	}

	/* sec01 */
	.sec01{
		width: 100%;
		background: #CAD7DA;
	}
	.sec01-title{
		width: 100%;
		height: 32vw;
		background: #839FAC;
		text-align: center;
	}
	.sec01-title .container{
		height: 100%;
		position: relative;
	}
	.sec01-title .container::after{
		position: absolute;
		left: 0;
		top: -3vw;
		content:'';
		width: 100%;
		height: 34vw;
		background: url(../img/sec01-title_bg_sp.png) no-repeat;
		background-size: contain;
		z-index: 1;
	}
	.sec01-title .voice{
		position: absolute;
		top: 4vw;
		left: 14.4vw;
		width: 75vw;
	}

	.sec01-spada{
		padding-top: 13.333vw;
		padding-bottom: 40vw;
		position: relative;
	}
	.sec01-spada::after{
		position: absolute;
		right:10.133vw;
		bottom: 4.4vw;
		content:'';
		width: 32vw;
		height: 31.067vw;
		background: url(../img/sec01-air_img02_sp.png) no-repeat;
		background-size: contain;
	}
	.sec01-spada__top .slide{
		width: 80vw;
		height: 60vw;
		margin: 0 auto;
		position: relative;
	}
	.sec01-spada__top .slide .image{
		position: absolute;
		top: 0;
		left: 0;
		inset: 0;
		opacity: 0;
		transition: opacity 0s ease-in-out;
	}
	.sec01-spada__top .slide .image.is-active{
		opacity: 1;
	}
	.sec01-spada__top .slide .image img{
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	.sec01-spada__top .text{
		display: none;
	}
	.sec01-spada__top .text img{
		width: 100%;
	}
	.sec01-spada__image{
		text-align: center;
	}
	.sec01-spada__image .text{
		width: 67.333vw;
		margin: 0 auto;
		padding: 1.333vw 0 6.667vw;
	}
	.sec01-spada__itemList{
		width: 64vw;
		margin: 0 auto;
		display: grid;
		grid-template-columns: 100%;
		grid-template-rows: auto auto auto;
		gap: 6.667vw;
	}
	.sec01-spada__itemList .item a{
		display: block;
		transition: 0.3s;
	}
	.sec01-spada__itemList .item a:hover{
		opacity: 0.7;
	}
	.sec01-spada__itemList .item .thumb{
		margin-bottom: 10px;
	}
	.sec01-spada__itemList .item .thumb img{
		width: 100%;
	}
	.sec01-spada__itemList .item p{
		color: #666;
		font-size: 16px;
		font-family: "HondaGlobalFontJP-Bold", sans-serif;
		line-height: 1.4;
		text-align: center;
	}
	.sec01-spada__itemList .item p span{
		display: block;
		font-size:11px;
		font-family: "HondaGlobalFontJP-Light", sans-serif;
		text-align: left;
		letter-spacing: -0.06em;
		width: 100px;
		height: 20px;
		line-height: 20px;
		padding-left: 8px;
		border:#666666 solid 1px;
		border-radius: 20px;
		margin: 5px auto 0;
		position: relative;
	}
	.sec01-spada__itemList .item p span::after{
		position: absolute;
		top: 50%;
		right: 8px;
		content:'';
		width: 6px;
		height: 9px;
		transform: translateY(-50%);
		background: url(../img/icon_arrow.png) no-repeat;
		background-size: contain;
	}

	.sec01-air{
		padding-bottom: 13.333vw;
	}
	.sec01-air__top .slide{
		width: 80vw;
		height: 60vw;
		margin: 0 auto;
		position: relative;
	}
	.sec01-air__top .slide .image{
		position: absolute;
		top: 0;
		left: 0;
		inset: 0;
		opacity: 0;
		transition: opacity 0s ease-in-out;
	}
	.sec01-air__top .slide .image.is-active{
		opacity: 1;
	}
	.sec01-air__top .slide .image img{
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	.sec01-air__top .text{
		display: none;
	}
	.sec01-air__top .text img{
		width: 100%;
	}
	.sec01-air__image{
		padding-top: 5.333vw;
		text-align: center;
	}
	.sec01-air__image .text{
		width:39.333vw;
		margin: 0 auto;
		padding: 1.333vw 0 6.667vw;
	}
	.sec01-air__itemList{
		width: 64vw;
		margin: 0 auto;
		display: grid;
		grid-template-columns: 100%;
		grid-template-rows: auto auto auto;
		gap: 6.667vw;
	}
	.sec01-air__itemList .item a{
		display: block;
		transition: 0.3s;
	}
	.sec01-air__itemList .item a:hover{
		opacity: 0.7;
	}
	.sec01-air__itemList .item .thumb{
		margin-bottom: 10px;
	}
	.sec01-air__itemList .item .thumb img{
		width: 100%;
	}
	.sec01-air__itemList .item p{
		color: #666;
		font-size: 16px;
		font-family: "HondaGlobalFontJP-Bold", sans-serif;
		line-height: 1.4;
		text-align: center;
	}
	.sec01-air__itemList .item p span{
		display: block;
		font-size:11px;
		font-family: "HondaGlobalFontJP-Light", sans-serif;
		text-align: left;
		letter-spacing: -0.06em;
		width: 100px;
		height: 20px;
		line-height: 20px;
		padding-left: 8px;
		border:#666666 solid 1px;
		border-radius: 20px;
		margin: 5px auto 0;
		position: relative;
	}
	.sec01-air__itemList .item p span::after{
		position: absolute;
		top: 50%;
		right: 8px;
		content:'';
		width: 6px;
		height: 9px;
		transform: translateY(-50%);
		background: url(../img/icon_arrow.png) no-repeat;
		background-size: contain;
	}

	.sec01-air__bottom{
		padding-bottom: 13.333vw;
	}
	.sec01-air__bottom .slide{
		width: 80vw;
		height: 60vw;
		margin: 0 auto 10px;
		position: relative;
	}
	.sec01-air__bottom .slide .image{
		position: absolute;
		top: 0;
		left: 0;
		inset: 0;
		opacity: 0;
		transition: opacity 0s ease-in-out;
	}
	.sec01-air__bottom .slide .image.is-active{
		opacity: 1;
	}
	.sec01-air__bottom .slide .image img{
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	.sec01-air__bottom .text p{
		font-size: 16px;
		font-family: "HondaGlobalFontJP-Bold", sans-serif;
		line-height: 1.32;
		text-align: center;
	}
	.sec01-air__bottom .text p a{
		display: block;
		color: #666 !important;
		font-size:11px;
		font-family: "HondaGlobalFontJP-Light", sans-serif;
		text-align: left;
		letter-spacing: -0.06em;
		width: 100px;
		height: 20px;
		line-height: 20px;
		padding-left: 8px;
		border:#666666 solid 1px;
		border-radius: 20px;
		margin: 5px auto 0;
		position: relative;
	}
	.sec01-air__bottom .text p a::after{
		position: absolute;
		top: 50%;
		right: 8px;
		content:'';
		width: 6px;
		height: 9px;
		transform: translateY(-50%);
		background: url(../img/icon_arrow.png) no-repeat;
		background-size: contain;
	}


	/* access-list */
	.access-list{
		display: flex;
		flex-direction: column;
	}
	.access-list .slide{
		width: 80vw;
		height: 60vw;
		margin: 0 auto 10px;
		position: relative;
	}
	.access-list .slide .image{
		position: absolute;
		top: 0;
		left: 0;
		inset: 0;
		opacity: 0;
		transition: opacity 0s ease-in-out;
	}
	.access-list .slide .image.is-active{
		opacity: 1;
	}
	.access-list .slide .image img{
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	.access-list .text{
		margin-bottom: 13.333vw;
	}
	.access-list .text p{
		font-size: 16px;
		font-family: "HondaGlobalFontJP-Bold", sans-serif;
		line-height: 1.32;
		text-align: center;
	}
	.access-list .text p a{
		display: block;
		color: #666 !important;
		font-size:11px;
		font-family: "HondaGlobalFontJP-Light", sans-serif;
		text-align: left;
		letter-spacing: -0.06em;
		width: 100px;
		height: 20px;
		line-height: 20px;
		padding-left: 8px;
		border:#666666 solid 1px;
		border-radius: 20px;
		margin: 5px auto 0;
		position: relative;
	}
	.access-list .text p a::after{
		position: absolute;
		top: 50%;
		right: 8px;
		content:'';
		width: 6px;
		height: 9px;
		transform: translateY(-50%);
		background: url(../img/icon_arrow.png) no-repeat;
		background-size: contain;
	}
	.access-list .col01,
	.access-list .col02,
	.access-list .col03,
	.access-list .col04,
	.access-list .col05,
	.access-list .col06{
		position: relative;
		z-index: 1;
	}

	/* sec02 */
	.sec02{
		width: 100%;
		background: #EBE5CC;
	}
	.sec02-title{
		width: 100%;
		height:33.333vw;
		background: #DFD099;
		text-align: center;
	}
	.sec02-title .container{
		height: 100%;
		position: relative;
	}
	.sec02-title .container::after{
		position: absolute;
		left:2.267vw;
		top: 0;
		content:'';
		width:95.333vw;
		height:34.4vw;
		background: url(../img/sec02-title_bg_sp.png) no-repeat;
		background-size: contain;
	}
	.sec02-title .voice{
		position: absolute;
		top: 4.7vw;
		left: 14vw;
		width:75vw;
	}
	.sec02-item{
		padding-top: 13.333vw;
	}

	/* sec03 */
	.sec03{
		width: 100%;
		background: #D6E0C6;
	}
	.sec03-title{
		width: 100%;
		height:33.333vw;
		background: #A7C78E;
		text-align: center;
	}
	.sec03-title .container{
		height: 100%;
		position: relative;
	}
	.sec03-title .container::after{
		position: absolute;
		top: 1.333vw;
		left: 0;
		content:'';
		width: 100%;
		height: 45.733vw;
		background: url(../img/sec03-title_bg_sp.png) no-repeat;
		background-size: contain;
		z-index: 1;
	}
	.sec03-title .voice{
		position: absolute;
		top: 4vw;
		left: 14.667vw;
		width: 70.667vw;
	}
	.sec03-item{
		padding-top: 13.333vw;
	}

	/* sec04 */
	.sec04{
		width: 100%;
		background: #D8D8D8;
	}
	.sec04-title{
		width: 100%;
		height:33.333vw;
		background: #BFC0C0;
		text-align: center;
	}
	.sec04-title .container{
		height: 100%;
		position: relative;
	}
	.sec04-title .container::after{
		position: absolute;
		top: 1.333vw;
		left: 0;
		content:'';
		width: 100%;
		/*height:30vw;*/
		height:38vw;
		background: url(../img/sec04-title_bg_sp.png) no-repeat;
		background-size: 100% auto;
		z-index: 1;
	}
	.sec04-title .voice{
		position: absolute;
		top:4vw;
		left:14.133vw;
		width:74.933vw;
	}

	.sec04-item{
		padding: 13.333vw 0 0;
	}
	.sec04-item .access-list .image{
		width: 80vw;
		height: 60vw;
		margin: 0 auto 10px;
	}

	.content_bottom{
		width: 100%;
		background: #fff;
		padding:6.667vw 0;
	}
	.content_bottom p{
		color: #808080;
		font-size: 16px;
		font-family: "HondaGlobalFontJP-Bold", sans-serif;
		text-align: center;
	}

	/* アイテム */

	.section h3 span {
		width: 160px;
		padding: 0 0 10px;
		border-bottom: 3px solid #444;
		display: inline-block;
		white-space: nowrap;
	}
	#section_items {
		padding-top: 50px;
		padding-bottom: 42px;
		margin-bottom: 0;
		background-color: #dbdbdb;
	}
	#section_items h3 {
		margin: 0 25px 30px;
		font-size: 23px;
		text-align: center;
	}

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

	.item_list {
		margin: 0 15px 70px;
	}

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

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

	#section_items .item_list .img {
		width: 38.6%;
		position: relative;
		overflow: hidden;
	}

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

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


	.item_list li .box h4 {
		margin: 0 0 15px;
		font-size: 3.5vw;
		line-height: 1.6;
		font-family: "HondaGlobalFontJP-Bold", sans-serif;
	}

	#section_items .item_list h4 svg {
		margin-left: 3px;
		width: 3vw;
		height: 3vw;
	}

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

	.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;
		align-self: flex-end;
	}

	#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;
	}

	 /* banner_acollect */
	 .banner_acollect {
        margin: 40px 15px 0;
    }
	.banner_acollect .pc {
		display: none;
	}

	 /* banner_archive */
	 .banner_archive {
        margin: 40px 15px 0;
    }
	.banner_archive .pc {
		display: none;
	}






}