@charset "utf-8";

@media screen and (max-width : 768px){
/*------------------------------------------------------------------------------------------
*
*
    car_common_sp.css
        max-width : 768px
*
*
------------------------------------------------------------------------------------------ */

body{
	font-size: 1.4rem;
	line-height: 1.6;
}

/* common style */
.switch_pc{ display: none;}
.switch_sp{ display: block;}

.br_sp {
	display: block;
}

br.pc {
	display: none;
}

br.sp {
	display: inline;
}

/* ------------------------------------------------------------
*
    #header_sensing
*
------------------------------------------------------------ */
#header_sensing {
	height: 45px;
}

#header_sensing .head_text .txt {
	font-size: 1.2rem;
}

#header_sensing .head_text .logo_txt {
	font-size: 1.4rem;
}

#header_sensing .head_nav{
	display: none;
}
#header_sensing .btn_menu{
	display: flex;
}

/* ------------------------------------------------------------
*
    #modal_menu
*
------------------------------------------------------------ */
#modal_menu {
	top: 103px;
	height: calc(100dvh - 103px);
	max-height: none;
	padding: 0;
	overflow: auto;
}

#modal_menu .modal_menu_wrap {
	/* padding: 25px 0 45px; */
	padding: 0 0 45px;
	box-shadow: 0 3px 6px rgba(0,0,0,.06);
	overflow: visible;
}
/* 
#modal_menu .plus_link::before {
	transform: translateY(-50%) scale(1.47);
}

#modal_menu .plus_link::after {
	transform: translateY(-50%) rotate(90deg) scale(1.47);
}

#modal_menu .plus_link.active::after {
	transform: translateY(-50%) scale(1.47);
	background-color: #10256A;
} */

#modal_menu .menu {
	padding: 0 20px;
}

#modal_menu a {
	margin: 0;
}

#modal_menu .top_link {
	margin-bottom: 0px;
	border-bottom: 1px solid #DDDDDD;
	display: block;
}

#modal_menu .top_link a {
	display: block;
	padding: 12px 0;
}

#modal_menu .contents_link{
	padding:0px 0;
}
#modal_menu .contents_link h3 {
	display: block;
	padding: 20px 0px;
}
#modal_menu .contents_link h3 a{
	padding: 0;
}

#modal_menu .contents_link--lists{
	flex-direction: column;
	gap:3px;
	width: 100%;
}
#modal_menu .contents_link--lists > li{
	width: 100%;
	border:none;
	text-align: left;
	flex:auto;
	background-color: #F3F4F8;
}
#modal_menu .contents_link--lists > li a{
	display: block;
	padding:12px;
}
#modal_menu .contents_link--lists > li a.current{
	background-color: #EAECF2;
}
#modal_menu .contents_link--lists > li a figure{
	display: flex;
	gap:14px;
	align-items: center;
	justify-content: flex-start;
	margin: 0;
}
#modal_menu .contents_link--lists > li picture{
	margin: 0;
}
#modal_menu .contents_link--lists > li picture img{
	width: 110px;
}

#modal_menu .contents_link--lists > li h5{
	font-size: 14px;
	line-height: 18px;
	margin-bottom: 2px;
}

/* #modal_menu .top_link a::after {
	right: 20px;
}

#modal_menu .top_link a:not(:first-child){
margin-left: 0;
border-top: 1px solid #E0E0E0;
} */

/* #modal_menu .link_list {
	display: none;
}

#modal_menu .menu_area .menu_block {
	display: block;
	margin-top: 0;
}

#modal_menu .menu_area .menu_block .f_link {
	display: block;
}

#modal_menu .menu_area .menu_block .f_link .a {
	display: block;
	width: 100%;
	padding: 12px 20px;
	font-size: 1.8rem;
	font-family:var(--font-bold);
}

#modal_menu .menu_area .menu_block .f_link .a::before {
	right: 23px;
}

#modal_menu .menu_area .menu_block .f_link .a::after {
	right: 20px;
}

#modal_menu .menu_area .menu_block .menu_box {
	display: none;
	padding: 10px 0 18px;
}

#modal_menu .menu_area .menu_block .menu_box .flex_box {
	display: block;
}

#modal_menu .menu_area .menu_block .menu_box .menu_wrp {
	width: 100%;
}

#modal_menu .menu_area .menu_block .menu_box .menu_wrp + .menu_wrp {
	margin-top: 5px;
}

#modal_menu .menu_area .menu_block .menu_box .menu_wrp .s_open {
	margin-bottom: 0;
	padding: 5px 20px;
	font-size: 1.6rem;
}

#modal_menu .menu_area .menu_block .menu_box .menu_wrp .s_open::before,
#modal_menu .menu_area .menu_block .menu_box .menu_wrp .s_open::after {
	content: "";
}

#modal_menu .menu_area .menu_block .menu_box .menu_wrp .s_open::before {
	right: 23px;
}

#modal_menu .menu_area .menu_block .menu_box .menu_wrp .s_open::after {
	right: 20px;
}

#modal_menu .menu_area .menu_block .menu_box .menu_wrp .s_open.active::after {
	transform: translateY(-50%) scale(1.47);
}

#modal_menu .menu_area .menu_block .menu_box .menu_wrp .s_open .ico {
	width: 40px;
}

#modal_menu .menu_area .menu_block .menu_box .menu_wrp .s_open .txt {
	width: calc(100% - 50px);
}

#modal_menu .menu_area .menu_block .s_links_scroll {
	display: none;
	padding: 0 20px 8px 70px;
	overflow-x: scroll;
	overflow-y: hidden;
	-ms-overflow-style: none;
	scrollbar-width: none;
}

#modal_menu .menu_area .menu_block .s_links_scroll::-webkit-scrollbar{
	display:none;
}

#modal_menu .menu_area .menu_block .menu_box .s_links {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	width: 100%;
	min-width: 424px;
}

#modal_menu .menu_area .menu_block .menu_box .s_links li {
	display: flex;
	align-items: center;
	width: 212px;
	padding: 5px 0;
}

#modal_menu .s_links.scene01 li:nth-child(1) { order: 0; }
#modal_menu .s_links.scene01 li:nth-child(2) { order: 3; }
#modal_menu .s_links.scene01 li:nth-child(3) { order: 1; }
#modal_menu .s_links.scene01 li:nth-child(4) { order: 4; }
#modal_menu .s_links.scene01 li:nth-child(5) { order: 2; }

#modal_menu .s_links.scene02 li:nth-child(1) { order: 0; }
#modal_menu .s_links.scene02 li:nth-child(2) { order: 3; }
#modal_menu .s_links.scene02 li:nth-child(3) { order: 1; }
#modal_menu .s_links.scene02 li:nth-child(4) { order: 2; }

#modal_menu .s_links.scene03 li:nth-child(1) { order: 0; }
#modal_menu .s_links.scene03 li:nth-child(2) { order: 3; }
#modal_menu .s_links.scene03 li:nth-child(3) { order: 6; }
#modal_menu .s_links.scene03 li:nth-child(4) { order: 1; }
#modal_menu .s_links.scene03 li:nth-child(5) { order: 4; }
#modal_menu .s_links.scene03 li:nth-child(6) { order: 2; }
#modal_menu .s_links.scene03 li:nth-child(7) { order: 5; }

#modal_menu .menu_area .menu_block .menu_box .s_links li + li {
	margin-top: 0;
}

#modal_menu .menu_area .menu_block .menu_box .s_links li a {
	width: 100%;
	padding: 5px 0;
	font-size: 1.2rem;
}

#modal_menu .menu_area .menu_block .menu_box .s_links li a::after {
	content: none;
}

#modal_menu .menu_area .menu_block .menu_box .s_links li .em,
#modal_menu .menu_area .menu_block .menu_box .s_links li .wrp {
	display: inline-block;
	position: relative;
	padding-right: 23px;
}

#modal_menu .menu_area .menu_block .menu_box .s_links li .em::after,
#modal_menu .menu_area .menu_block .menu_box .s_links li .wrp::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	width: 15px;
	height: 15px;
	border-radius: 50%;
	background: #CC0000 url(/hondasensing/common/image_common/parts_ico_btm_nav_arrow.png) no-repeat 60% center / 5.5px 8px;
	transition: .1s ease;
}

#modal_menu .menu_area .menu_block.block_func {
	padding: 0;
}

#modal_menu .menu_area .menu_block.block_func .menu_box .switch_pc {
	display: none;
}

#modal_menu .menu_area .menu_block.block_func .s_links_scroll {
	display: block;
	padding: 0 20px 0 70px;
}

#modal_menu .menu_area .menu_block.block_func .menu_box {
	padding-top: 0;
}

#modal_menu .menu_area .menu_block.block_func .menu_box .s_links li a {
	display: flex;
	align-items: center;
	min-height: 35px;
} */

#modal_menu .close_btn {
	bottom: -30px;
	/* right: calc(50% - 8px);
	transform: translateX(50%); */
	font-size: 15px;
}



/* ------------------------------------------------------------
*
    #contents_area
*
------------------------------------------------------------ */
#contents_area .ttl_ptn01 {
	font-size: 2.2rem;
}

#contents_area .arrow_link::after {
	width: 15px;
	height: 15px;
	background-position: 60% center;
	background-size: 5.5px 8px;
}



/* ------------------------------------------------------------
*
    .use_notice
*
------------------------------------------------------------ */

.use_notice {
	padding: 0 0 90px;
	margin-top: 365px;
}

.use_notice .list_notice01 {
	width: auto;
	margin: 0 25px;
}

.list_notice01 li {
	padding-left: 0;
	text-indent: 0;
}

.list_notice01 li.num {
	padding-left: 0;
	text-indent: 0;
}

.list_notice01 li .underline {
	text-decoration: underline;
}

.use_notice .btn_modal {
	margin-top: 0;
	padding: 40px 25px 10px;
	background: #fff;
}

.use_notice .btn_modal a {
	display: block;
	font-size: 1.4rem;
	width: auto;
	padding: 10px 0;
}

.use_notice .btn_modal a:before {
	right: 18px;
}

/* ------------------------------------------------------------
*
    #modal_notice
*
------------------------------------------------------------ */

#modal_notice {
	 -webkit-overflow-scrolling: touch;
   /* z-index: 300; */
}

#modal_notice .box {
	left: 0;
	padding: 66px 0 50px;
	width: calc(100% - 50px);
	margin: 25px 25px 140px;
}

#modal_notice h2 {
	padding: 50px 0 30px;
	font-size: 1.7rem;
	background-size: 50px auto;
	line-height: 1.3;
}

#modal_notice .case {
	padding: 30px 0 10px;
}

#modal_notice .case h3,
#modal_notice .case h3 .sml {
	font-size: 1.4rem;
}

#modal_notice .case ul {
	margin: 0 25px;
}

#modal_notice .case li {
	display: block;
	width: auto;
	margin: 0 0 15px;
}

#modal_notice .case li p {
	line-height: 1.4;
}

#modal_notice .manual {
	padding-top: 30px;
}

#modal_notice .manual p {
	margin: 0 22px;
}

#modal_notice .manual dt {
	margin: 10px 22px 5px;
}

#contents_area #modal_notice .manual dd a {
	padding: 14px 0;
	max-width: 100%;
}

#modal_notice .manual dd {
	margin: 0 25px;
}

#modal_notice .manual dd a:after {
	background-size: 4px auto;
	width: 14px;
	height: 14px;
}

#modal_notice .close {
width: 41px;
height: 41px;
top: 15px;
right: 15px;
}

#modal_notice .close img{
width: 19px;
}


#footer-sp {
	position: relative;
	z-index: 99;
	background-color: #fff;
}
#footer-sp .pagetop {
	padding-top: 20px;
}

#footer-sp .pagetop .backtop {
	margin-top: 0!important;
}



/* ------------------------------------------------------------
*
    .feature_detail
*
------------------------------------------------------------ */
.feature_detail .contents_in{
max-width: 1020px;
width: 100%;
margin: 0 auto;
padding: 0 20px;
}

.feature_detail .h2_feature_ptn01{
text-align: center;
margin-bottom: 22px;
}

.feature_detail .h2_feature_ptn01 h2{
color: #08326F;
font-family:var(--font-bold);
font-size: 22px;
line-height: 1.4;
margin-bottom: 10px;
}

.feature_detail .h2_feature_ptn01 h2::after{
content: "";
display: block;
width: 20px;
height: 2px;
background: #BB271A;
margin: 7px auto 0;
}

.feature_detail .h2_feature_ptn01 h2 .dib {
display: inline-block;
}

.feature_detail .h2_feature_ptn01 .sub_title{
color: #08326F;
font-family:var(--font-bold);
font-size: 16px;
line-height: 1;
}

.feature_detail .h2_feature_ptn02{
margin-bottom: 20px;
}

.feature_detail .h2_feature_ptn02 h2{
color: #08326F;
font-family:var(--font-bold);
font-size: 16px;
line-height: 1;
}

.feature_detail .h3_feature_ptn01{
text-align: center;
margin-bottom: 30px;
}

.feature_detail .h3_feature_ptn01 h3{
font-family:var(--font-bold);
font-size: 16px;
line-height: 26px;
color: #000000;
}

.feature_detail .h3_feature_ptn01 h3::after{
content: "";
display: block;
width: 20px;
height: 2px;
background: #BB271A;
margin: 11px auto 0;
}


.feature_detail #scene_title_area{
text-align: center;
padding: 47px 0;
background: url(../image_common/sensing/bg_title_feature_sp01.jpg) no-repeat 50% 50%/cover;
margin-bottom: 20px;
}

.feature_detail #scene_title_area .scene_title{
display: inline-block;
background: #041D41;
padding: 10px 20px;
color: #fff;
font-family:var(--font-bold);
font-size: 16px;
line-height: 1;
}

.feature_detail #title_area{
width: calc(100% - 40px);
background: #F2F4F8;
padding: 20px 20px;
font-family:var(--font-bold);
font-size: 16px;
line-height: 1;
color: #08326F;
text-align: center;
margin-bottom: 20px;
}

.feature_detail #title_area .text01_title{
background: url(../image_common/sensing/fukidashi_feature_sp.png) no-repeat center top/ 100% auto;
max-width: 223px;
width: 100%;
margin: 0 auto 10px;
padding: 10px 6px 17px;
}

.feature_detail #title_area h1{
max-width: 293px;
width: 100%;
margin: 0 auto 10px;
background: #08326F;
padding: 7px 0;
font-family:var(--font-bold);
font-size: 26px;
letter-spacing: 0.12em;
line-height: 34px;
color: #fff;
}

.feature_detail #title_area h1 img{
display: block;
max-width: 740px;
width: 100%;
margin: 0 auto;
}

.feature_detail #title_area h1 img.pc{
display: none;
}

.feature_detail #title_area .text02_title{
line-height: 27px;
}




/* -----------------------------------
    car_scene
----------------------------------- */

.feature_detail #car_scene{
background: #E4EDFA;
position: relative;
padding: 40px 0 0;
}

.feature_detail #car_scene::after{
content: "";
display: block;
width: 100%;
height: calc(100vw*50/375);
border-top: calc(100vw*50/375) solid #E4EDFA;
border-left: calc(100vw/2) solid transparent;
border-right: calc(100vw/2) solid transparent;
box-sizing: border-box;
position: absolute;
bottom: calc(-1*(100vw*50/375));
left: 0;
}

.feature_detail #car_scene img{
display: block;
width: 100%;
height: auto;
}

.feature_detail #car_scene .scene_g{
max-width: 800px;
width: 100%;
margin: 0 auto;
padding-bottom: 60px;
}

.feature_detail #car_scene .scene_g:last-child{
padding-bottom: 30px;
}

.feature_detail #car_scene .scene_g .video_box{
position: relative;
margin-bottom: 14px;
}

.feature_detail #car_scene .scene_g .thumbanil_box{
cursor: pointer;
position: absolute;
top: 0;
left: 0;
z-index: 1;
transition: .1s ease;
width: 100%;
height: 100%;
}

.feature_detail #car_scene .scene_g .thumbanil_box.current{
opacity: 0;
display: none;
}

.feature_detail #car_scene .scene_g .thumbanil_box:hover {
opacity: .7;
}

.feature_detail #car_scene .scene_g .thumbanil_box .icon{
position: absolute;
top: 50%;
left: 50%;
width: 41px;
height: 41px;
border-radius: 50%;
box-shadow: 0 0 10px rgba(0,0,0,.07);
background: #FDE731;
transform: translate(-50%,-50%);
}

.feature_detail #car_scene .scene_g .thumbanil_box .icon::before{
content: "";
display: block;
width: 12px;
height: 18px;
box-sizing: border-box;
border-left: 12px solid #fff;
border-top: 9px solid transparent;
border-bottom: 9px solid transparent;
position: absolute;
top: 50%;
left: 16px;
transform: translateY(-50%);
}

.feature_detail #car_scene .scene_g .thumbanil_box .thumbnail{
width: 100%;
height: 100%;
}

.feature_detail #car_scene .scene_g .thumbanil_box .thumbnail img{
width: 100%;
height: 100%;
object-fit: cover;
}

.feature_detail #car_scene .scene_g .youtube_box{
padding-top: 56.25%;
position: relative;
max-width: 800px;
width: 100%;
margin: 0 auto;
}

.feature_detail #car_scene .scene_g .youtube_box iframe{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.feature_detail #car_scene .scene_g .video_box video{
display: block;
width: 100%;
opacity: 0;
}

.feature_detail #car_scene .scene_g .video_box video.active{
opacity: 1;
}

.feature_detail #car_scene .scene_g .text01{
font-size: 14px;
line-height: 26px;
}

.feature_detail #car_scene .scene_g .text01 .small{
font-size: 12px;
font-family:var(--font-light);
font-family:var(--font-light);
line-height: 22px;
display: inline-block;
}



/* -----------------------------------
    #function_detail
----------------------------------- */

.feature_detail #function_detail{
margin-top: 0;
background: #F7F9FF;
padding-top: calc(100vw*50/375);
padding-bottom: 0;
}

.feature_detail #function_detail .contents_in{
padding-top: 30px;
padding-bottom: 60px;
}

.feature_detail #function_detail .h2_feature_ptn01{
margin-bottom: 27px;
}

.feature_detail #function_detail .h2_feature_ptn01 h2::after{
margin-top: 17px;
}

.feature_detail #function_detail .cnt_g{
margin-bottom: 15px;
}

.feature_detail #function_detail .cnt_box{
max-width: 335px;
width: 100%;
margin: 0 auto 10px;
}

.feature_detail #function_detail .cnt_box a{
width: 100%;
text-decoration: none;
display: flex;
align-items: start;
background: #fff;
box-shadow: 0 0 10px rgba(0,0,0,.05);
padding: 31px 20px 28px 30px;
transition: all .1s;
}

.feature_detail #function_detail .cnt_box a:hover{
opacity: 0.7;
}

.feature_detail #function_detail .cnt_box .cnt_img{
max-width: 61px;
width: 100%;
margin-right: 15px;
}

.feature_detail #function_detail .cnt_box .cnt_img img{
width: 100%;
height: auto;
display: block;
}

.feature_detail #function_detail .cnt_box .cnt_text{
max-width: 195px;
width: 100%;
padding-top: 3px;
font-size: 0;
}

.feature_detail #function_detail .cnt_box .cnt_text .title{
font-family:var(--font-bold);
font-size: 15px;
line-height: 1;
color: #000;
margin-bottom: 10px;
}

.feature_detail #function_detail .cnt_box .cnt_text .link_btn{
display: inline-block;
color: #CC0000;
text-decoration: none;
position: relative;
font-size: 14px;
line-height: 1;
padding: 0 27px 0 0;
}

.feature_detail #function_detail .cnt_box:nth-child(1) .cnt_text .link_btn{
padding: 0 22px 0 0;
}

.feature_detail #function_detail .cnt_box .cnt_text .link_btn::after{
content: "";
position: absolute;
top: 50%;
right: 0;
transform: translateY(-50%);
transition: .1s ease;
}

.feature_detail #function_detail .cnt_box:nth-child(1) .cnt_text .link_btn::after{
width: 12px;
height: 12px;
background: url(../image_common/parts_ico_btm_blank.png) no-repeat center center/100% auto;
}

.feature_detail #function_detail .cnt_box:nth-child(2) .cnt_text .link_btn::after{
width: 13px;
height: 13px;
border-radius: 50%;
background: #CC0000 url(../image_common/parts_ico_btm_nav_arrow.png) no-repeat 55% center / 4px 7px;
}

.feature_detail #function_detail .list_notice01{
margin: 0 auto 60px;
}

.feature_detail #function_detail .list_notice01 li{
font-size: 12px;
font-family:var(--font-light);
font-family:var(--font-light);
line-height: 20px;
color: #000000;
text-indent: -1em;
margin: 0 0 11px 1em;
}

.feature_detail #function_detail .list_notice01 li.red{
color: #CC0000;
}

.feature_detail #function_detail .list_notice01 li.attention_text{
margin-top: -5px;
}

.feature_detail #function_detail .list_notice01 li .bold{
font-family:var(--font-bold);
}

.feature_detail #function_detail .h3_feature_ptn01::before{
content: "";
display: block;
width: 18px;
height: 26px;
background: url(../image_common/sensing/icon_use_feature.png) no-repeat 50% 50%/100% auto;
margin: 0 auto 7px;
}

.feature_detail #function_detail .btn_modal{
max-width: 800px;
width: 100%;
margin: 0 auto;
background: #08326F;
box-shadow: 0 0 10px rgba(0,0,0,.05);
padding: 0;
}

.feature_detail #function_detail .btn_modal a{
display: block;
padding: 12px 0;
color: #fff;
text-decoration: none;
font-family:var(--font-bold);
font-size: 14px;
line-height: 20px;
text-align: center;
position: relative;
}

.feature_detail #function_detail .btn_modal a .plus {
position: absolute;
top: 50%;
right: 15px;
transform: translateY(-50%);
width: 21px;
height: 21px;
border-radius: 50%;
background-color: #fff;
}

.feature_detail #function_detail .btn_modal a .plus::before,#function_detail .btn_modal a .plus::after {
content: "";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 9px;
height: 1px;
background-color: #08326F;
}

.feature_detail #function_detail .btn_modal a .plus::after {
transform: translate(-50%, -50%) rotate(-90deg);
transition: transform .1s ease;
}

.feature_detail #function_detail .btn_modal a:hover .plus::after {
transform: translate(-50%, -50%);
}

/* -----------------------------------
    #car_model
----------------------------------- */

#car_model{
background: #F7F9FF;
padding-bottom: 60px;
}

#car_model .contents_in{
width: calc(100% - 40px);
padding: 30px 7px 18px;
background: #fff;
}

#car_model .h2_feature_ptn01{
margin-bottom: 19px;
}

#car_model .h2_feature_ptn01 h2::after{
margin-top: 14px;
}

#car_model .car_g{
max-width: 887px;
width: 100%;
margin: 0 auto;
display: flex;
align-items: start;
justify-content: space-between;
flex-wrap: wrap;
}

#car_model .car_g::after{
content: "";
max-width: 104px;
width: 100%;
display: block;
}

#car_model .car_g li{
max-width: 104px;
width: 100%;
/* height:84px; */
margin-bottom: 12px;
}
#car_model .car_g li.civic_type_r{
	margin-bottom: 0;
}

#car_model .car_g li a{
text-decoration: none;
color: #000000;
transition: .1s ease;
}

#car_model .car_g li a:hover{
opacity: 0.7;
}

#car_model .car_g li img{
display: block;
width: 100%;
height: auto;
margin: 0 auto 10px;
}

#car_model .car_g li span{
display: block;
font-size: 12px;
font-family:var(--font-bold);
line-height: 1;
text-align: center;
white-space: nowrap;

}

#car_model .car_g li span.pc{
display: none;
}

#car_model .car_g li span::after{
content: "";
display: inline-block;
margin: 0 0 0 7px;
width: 13px;
height: 13px;
border-radius: 50%;
background: #08326F url(../image_common/parts_ico_btm_nav_arrow.png) no-repeat 55% center / 4px 7px;
vertical-align: bottom;
}

#car_model .car_g li span.civic_type_r{
line-height: 14px;
text-align: left;
margin: 0 auto;
width: 82px;
padding-left: 10px;
}

#car_model .car_g li span.civic_type_r::after{
vertical-align: top;
margin-top: -7px;
}


/* -----------------------------------
    #scene_search
----------------------------------- */
#scene_search{
padding: 60px 0 78px;
position: relative;
}

#scene_search .cnt_g{
max-width: 335px;
width: 100%;
margin: 0 5px;
background: #F8F8F8;
}

#scene_search .cnt_g .contents_in{
max-width: none;
padding: 30px 20px;
}

#scene_search .cnt_g .h2_feature_ptn01{
margin-bottom: 24px;
}

#scene_search .cnt_g .h2_feature_ptn01 h2::after{
margin-top: 17px;
}

#scene_search .cnt_g .scene_title_box{
max-width: 453px;
width: 100%;
margin: 0 auto 22px;
display: flex;
align-items: center;
justify-content: space-between;
}

#scene_search .cnt_g .scene_title_box .icon{
max-width: 70px;
width: 100%;
border-radius: 50%;
}

#scene_search .cnt_g .scene_title_box .icon img{
width: 100%;
height: auto;
display: block;
border-radius: 50%;
}

#scene_search .cnt_g .scene_title_box .scene_title{
width: 212px;
background: #fff;
border: 2px solid #08326F;
border-radius: 36px;
padding: 10px 0 9px;
text-align: center;
font-family:var(--font-bold);
font-size: 17px;
line-height: 1;
color: #08326F;
position: relative;
}

#scene_search .cnt_g .scene_title_box .scene_title::before{
content: "";
display: block;
width: 11px;
height: 7px;
border-right: 11px solid #08326F;
border-top: 3.5px solid transparent;
border-bottom: 3.5px solid transparent;
box-sizing: border-box;
position: absolute;
top: 50%;
left: -12px;
transform: translateY(-50%);
}

#scene_search .cnt_g .scene_link {
width: 100%;
}

#scene_search .cnt_g .scene_link li {
width: 100%;
height: 75px;
margin-top: 10px;
}

#scene_search .cnt_g .scene_link li a {
display: flex;
align-items: center;
width: 100%;
height: 100%;
padding: 0 8px;
background-color: #fff;
box-shadow: 0 0 10px rgba(0,0,0,.04);
color: #000;
font-family:var(--font-bold);
font-size: 13px;
line-height: 1.4;
text-decoration: none;
-webkit-transition: .1s ease;
transition: .1s ease;
}

#scene_search .cnt_g .scene_link li a:hover {
opacity: .7;
}

#scene_search .cnt_g .scene_link li a::after {
right: 20px;
background-color: #CC0000;
}

#scene_search .cnt_g .scene_link li a .dib {
display: block;
margin-top: 5px;
font-family:var(--font-light);
font-size: 12px;
font-family:var(--font-light);
line-height: 1;
}

#scene_search .cnt_g .scene_link li.active a{
background: #CC0000;
color: #fff;
}

#scene_search .cnt_g .scene_link li.active a::after {
background-image: url(../image_common/parts_ico_btm_nav_arrow_red.png);
background-color: #fff;
}

#scene_search .scene_slider .slick-track {
display: flex;
}

#scene_search .scene_slider .slick-slide {
height: auto !important;
}

#scene_search .slider_arrow{
position: absolute;
top: 50%;
transform: translateY(-50%);
max-width: 360px;
width: 100%;
margin: 0 auto;
left: 0;
right: 0;
}

#scene_search .slider_arrow .slick-arrow{
width: 26px;
height: 26px;
border-radius: 50%;
background: #08326F url(../image_common/sensing/parts_ico_slider_feature.png) no-repeat 55% center / 7px 11px;
}

#scene_search .slider_arrow .slick-arrow::before{
content: none;
}

#scene_search .slider_arrow .slick-arrow.slick-prev{
z-index: 1;
transform: translate(0, -50%) rotate(180deg);
left: 0px;
}

#scene_search .slider_arrow .slick-arrow.slick-next{
right: 0px;
}

#scene_search .slider_thumbnail{
max-width: 51px;
width: 100%;
margin: 30px auto 0;
}

#scene_search .slider_thumbnail .slick-track {
transform: translate(-34px, 0px) !important;
}

#scene_search .slider_thumbnail li{
background: #A2ABBE;
width: 5px;
height: 5px;
border-radius: 50%;
background: #A2ABBE;
box-sizing: border-box;
padding: 0;
margin: 0 5px;
}

#scene_search .slider_thumbnail li.slick-current{
background: #08326F;
}

#scene_search .slider_thumbnail .slick-arrow{
background: url(../../image/slide_next.png) no-repeat center center/ 6px auto;
}

#scene_search .slider_thumbnail .slick-arrow::before{
content: none;
}

#scene_search .slider_thumbnail .slick-prev{
transform: scale(-1, 1) translate(0, -50%);
left: -27px;
}

#scene_search .slider_thumbnail .slick-next{
right: -27px;
}

/* -----------------------------------
    #car_function
----------------------------------- */

#car_function{
padding-bottom: 60px;
}

#car_function .contents_in{
max-width: 375px;
}

#car_function .func_link {
max-width: 375px;
width: 100%;
display: flex;
flex-wrap: wrap;
}


#car_function .func_link li {
max-width: 147.5px;
width: 50%;
width: calc(50% - 20px);
height: 60px;
margin-right: 40px;
}

#car_function .func_link li:nth-child(2n){
margin-right: 0;
}

#car_function .func_link li a {
display: flex;
align-items: center;
width: 100%;
height: 100%;
/* background-color: #E4EDFA; */
color: #000;
font-family:var(--font-light);
font-size: 12px;
font-family:var(--font-light);
line-height: 17px;
text-decoration: none;
-webkit-transition: .1s ease;
transition: .1s ease;
}

#car_function .func_link li a:hover {
opacity: .7;
}

#car_function .func_link li a::after {
right: 0px;
background-color: #fff;
background-image: url(../../image/slide_next.png);
width: 6px;
height: 10px;
border-radius: 0;
}

#car_function .func_link li a .dib {
display: inline-block;
}




}


@media screen and (max-width : 725px){
#modal_menu .s_links.scene01 li:nth-child(1) { order: 0; }
#modal_menu .s_links.scene01 li:nth-child(2) { order: 2; }
#modal_menu .s_links.scene01 li:nth-child(3) { order: 4; }
#modal_menu .s_links.scene01 li:nth-child(4) { order: 1; }
#modal_menu .s_links.scene01 li:nth-child(5) { order: 3; }

#modal_menu .s_links.scene02 li:nth-child(1) { order: 0; }
#modal_menu .s_links.scene02 li:nth-child(2) { order: 2; }
#modal_menu .s_links.scene02 li:nth-child(3) { order: 1; }
#modal_menu .s_links.scene02 li:nth-child(4) { order: 3; }

#modal_menu .s_links.scene03 li:nth-child(1) { order: 0; }
#modal_menu .s_links.scene03 li:nth-child(2) { order: 2; }
#modal_menu .s_links.scene03 li:nth-child(3) { order: 4; }
#modal_menu .s_links.scene03 li:nth-child(4) { order: 6; }
#modal_menu .s_links.scene03 li:nth-child(5) { order: 1; }
#modal_menu .s_links.scene03 li:nth-child(6) { order: 3; }
#modal_menu .s_links.scene03 li:nth-child(7) { order: 5; }
}








@media screen and (max-width : 768px){
/* contents_nav */


#contents_nav .contents_nav_inner{
	padding: 25px 0 60px;
}
#contents_nav .heading{
	font-size: 20px;
	margin-bottom: 20px;
}
#contents_nav .contents_nav_list{
	flex-direction: column;
	padding: 0 20px;
	box-sizing: border-box;
}
#contents_nav .contents_nav_item{
	flex:auto;
	width: 100%;
}
#contents_nav .contents_nav_item img{
	margin: auto;
}




/* breadcrumbs */

#breadcrumbs .breadcrumbs_inner{
	padding: 25px 20px;
}
#breadcrumbs .breadcrumbs_list{
	flex-wrap: nowrap;
	padding:0 20px 10px;
	margin: 0 -20px;
	overflow-x: scroll;
	-webkit-overflow-scrolling: touch;
}
#breadcrumbs .breadcrumbs_item{
	flex-shrink: 0;

}

}