@charset "UTF-8";

/*--------------------------------
 ホンダサイト全体の調整
---------------------------------*/
.l-auto-header__close__button>span::before, .l-auto-header__close__button>span::after {
    top: 10px !important;
}

/*--------------------------------
 全体
---------------------------------*/
#contents {
	font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", "Meiryo", "Arial", sans-serif;
	color: #000;
	-webkit-print-color-adjust: exact;
	color-adjust: exact;
	overflow-x: hidden;
}
#contents img {
	max-width: 100%;
	height: auto;
	image-rendering: -webkit-optimize-contrast;
}
#contents picture img {
	width: auto;
}
#contents .pc {
	display: block;
}
#contents .sp {
	display: none;
}

:root {
  /* font-size pc */
  --fs-20: 20px;
  --fs-18: 18px;
  --fs-16: 16px;
  --fs-14: 14px;
  --fs-12: 12px;
}

@media screen and (max-width: 768px) {
  :root {
    /* font-size sp */
    --fs-20: 18px;
    --fs-18: 16px;
    --fs-16: 14px;
    --fs-14: 12px;
    --fs-12: 10px;
  }
}

/*--------------------------------
 レイアウト
---------------------------------*/
#contents {
	background: #F0F0F0;
	position: relative;
}
#contents .container {
	max-width: 980px;
	margin: 0 auto;
}
#contents .container__inner {
	padding: 40px 0 40px;
}
#main {
	background: #fff;
}
#contents .element + .element {
	margin-top: 45px;
}
#contents .txt-large {
	font-size: 18px;
	line-height: 1.4;
	margin-bottom: 10px;
}
#contents .txt-middle {
	font-size: 16px;
	line-height: 1.4;
	margin-bottom: 10px;
}
#contents .txt-small {
	font-size: 14px;
	line-height: 1.4;
	margin-bottom: 10px;
}
#contents .col-red {
	color: #CC0000;
}
#contents .caption {
	font-size: 12px;
	line-height: 1.3;
	color: #7C7C7C;
	font-weight: normal;
	padding-left: 1em;
	text-indent: -1em;
}
#contents .line-bottom {
	border-bottom: 1px solid #ccc;
}
#contents .link-bnr p {
	display: block;
	border-radius: 4px;
	overflow: hidden;
}
#contents .link-bnr a {
	transition: .3s;
}
#contents .link-bnr a:hover {
	opacity: .7;
}
#contents .icon-doc {
	background: url("../images/common/icon-document.svg") center right no-repeat;
	background-size: 20px;
	padding-right: 35px;
}
#contents .blank {
	width: 100%;
	min-height: 96px;
	padding: 16px;
	text-align: center;
	font-size: 16px;
	line-height: 1.4;
	border-radius: 4px;
	color: #000;
	background-color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 15px;
}
#contents .blank .h2-ttl__more {
	display: inline-block;
	margin: 5px 0 0;
}

#contents .blank .btn {
	margin: 16px auto -10px;
	max-width: 400px;
}

#contents .column-single {
	display: flex;
	flex-wrap: wrap;
}
#contents .column-single > div, 
#contents .column-single > label {
	width: 100%;
	margin-bottom: 15px;
}
#contents .column-harf {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-bottom: -15px;
}
#contents .column-harf > div,
#contents .column-harf > label {
	width: 49.33%;
	margin-bottom: 15px;
}
#contents .column-harf.wide > div,
#contents .column-harf.wide > label {
	width: 48.4%;
	margin-bottom: 15px;
}
#contents .column-third {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-bottom: -15px;
}
#contents .column-third::before {
	content: "";
	width: 32.4%;
	order: 1;
}
#contents .column-third::after {
	content: "";
	width: 32.4%;
}
#contents .column-third > div,
#contents .column-third > label {
	width: 32.4% !important;
	margin-bottom: 15px;
}
#contents .column-fourth {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-bottom: -15px;
}
#contents .column-fourth::before {
	content: "";
	width: 24%;
	order: 1;
}
#contents .column-fourth::after {
	content: "";
	width: 24%;
}
#contents .column-fourth > div,
#contents .column-fourth > label {
	width: 24% !important;
	margin-bottom: 15px;
}
#contents .column-fifth {
	display: flex;
	flex-wrap: wrap;
	margin-right: -1.5%;
	margin-bottom: -15px;
}
#contents .column-fifth > div,
#contents .column-fifth > label {
	width: 18.5% !important;
	margin-right: 1.5%;
	margin-bottom: 15px;
}

#contents a.comingsoon {
	pointer-events: none;
}

#contents a.underline {
	text-decoration: underline;
}

#contents .inline-item {
	display: inline-block;
}

/* 汎用 editor記述 */
#contents .sentence p + p,
#contents .sentence ol + p,
#contents .sentence ul + p,
#contents .sentence p + ol,
#contents .sentence ol + ol,
#contents .sentence ul + ol,
#contents .sentence p + ul,
#contents .sentence ol + ul,
#contents .sentence ul + ul {
	margin-top: 20px;
}

/*--------------------------------
 ヘッダー
---------------------------------*/
#head-logo {
	background: #041D41;
}
#head-logo .head-logo__inner {
	padding: 3px 0 2px;
	display: flex;
	align-items: center;
}
#head-logo .head-logo__inner img {
	width: 72px;
	margin-left: -5px;
}

#contents .page-ttl {
	padding: 30px 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}
#contents .page-ttl__ttl {
	font-size: 24px;
	line-height: 1;
	/*margin-bottom: 5px;*/
    width: 100%;
    text-align: center;
}
#contents .page-ttl__txt {
	font-size: 16px;
	line-height: 1.4;
	margin-top: 20px;
}
#contents .page-ttl__caption {
	color: #7C7C7C;
	font-size: 14px;
	line-height: 1.4;
	margin-top: 20px;
}
#contents .btn-reload {
    position: absolute;
    left: calc((100% - 980px) / 2);
    cursor: pointer;
}
#contents .btn-reload img {
	width: 45px;
}

/*--------------------------------
 アプリ用 スマホヘッダー
---------------------------------*/
#auto-header-sp {
	position: sticky !important;
	top: 0;
	left: 0;
	z-index: 999;
	background: #fff;
	display: none;
}

/* アプリ用 ヘッダー切り替え */
#auto-header-sp.app {
	display: block !important;
}

.l-auto-header.app {
	display: none !important;
}
/* */

#auto-header-sp #auto-header-sp-inner {
	padding: 14px 0;
	text-align: center;
	position: relative;
}
#auto-header-sp .page-ttl__ttl {
	font-size: 16px;
	font-weight: 600;
	line-height: 1;
	margin-bottom: 0;
}
#auto-header-sp #btn-spnav {
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	width: 45px;
	height: 45px;
	background: url("../images/common/btn-spnav.svg") center no-repeat;
	cursor: pointer;
}
#auto-header-sp #spnav {
	position: fixed;
	top: 0;
	left: -330px;
	z-index: 99999;
	width: 330px;
	max-width: 100vw; /* 330px以下対策 */
	height: 100vh;
	overflow-y: scroll;
	overflow-x: hidden;
	/*-webkit-overflow-scrolling: touch;
	overflow-scrolling: touch;*/
	display: none;
	transition: ease 0.4s;
	background: #F2F2F2;
}
#auto-header-sp #spnav.current {
	display: block;
	left: 0;
}
body.open {
	position: relative;
	overflow: hidden;
    width: 100vw;
    height: 100vh;
	transition: ease 0.4s;
    /*left: 294px;*/
}
body::after {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0);
	transition: ease 0.4s;
}
body.open::after {
	left: 330px;
	z-index: 9999;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.75);
	transition: ease 0.4s;
	overflow: hidden;
}
#auto-header-sp .spnav-close {
	font-weight: normal;
	display: flex;
	align-items: center;
	font-size: 14px;
	line-height: 1;
	position: relative;
	overflow: hidden;
	outline: none;
	vertical-align: bottom;
	text-decoration: none;
	background: url("../images/common/btn-close.svg") left 16px center no-repeat;
	padding: 16px 16px 16px 55px;
	color: #000;
	cursor: pointer;
}
#auto-header-sp #spnav .spnav-link {
	margin: 0;
	padding: 0;
	list-style: none;
}
#auto-header-sp #spnav .spnav-link li,
#auto-header-sp #spnav .spnav-accordion {
	border-bottom: 1px solid #ccc;
}
#auto-header-sp #spnav .spnav-link li a,
#auto-header-sp #spnav .spnav-accordion .title {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	font-size: 14px;
	line-height: 1;
	position: relative;
	overflow: hidden;
	background: #fff url("../images/common/btn-arrow-secondary.svg") right 12px center no-repeat;
	color: #000;
	border: 1px solid #fff;
	padding: 18px 20px 18px 20px;
	text-decoration: none;
}

/* spnav-accordion */
#auto-header-sp #spnav .spnav-accordion .toggle {
	display: none;
}
#auto-header-sp #spnav .spnav-accordion .title,
#auto-header-sp #spnav .spnav-accordion .content {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transform: translateZ(0);
	transition: ease 0.4s;
}
#auto-header-sp #spnav .spnav-accordion .title::after {
	content: "";
	position: absolute;
	right: 12px;
	width: 24px;
	height: 24px;
	background: #fff url("../images/common/btn-arrow-secondary.svg") center no-repeat;
	transition: ease 0.4s;
}
#auto-header-sp #spnav .spnav-accordion .content {
	max-height: 0;
	overflow: hidden;
}
#auto-header-sp #spnav .spnav-accordion .toggle:checked + .title + .content {
	max-height: 1500px;
	transition: ease 0.4s;
}
#auto-header-sp #spnav .spnav-accordion .toggle:checked + .title::after {
	transform: rotate(90deg) !important;
}

#auto-header-sp #spnav .spnav-bnr {
	margin: 0;
	padding: 16px;
	list-style: none;
}
#auto-header-sp #spnav .spnav-bnr a {
	display: flex;
	position: relative;
	background-color: #fff;
	border-radius: 4px;
	overflow: hidden;
	color: #000;
	text-decoration: none;
}
#auto-header-sp #spnav .spnav-bnr li + li {
	margin-top: 10px;
}
#auto-header-sp #spnav .spnav-bnr .thumb {
	width: 74px;
	height: 55px;
	transition: 0.3s;
	position: relative;
}
#auto-header-sp #spnav .spnav-bnr a:hover .thumb {
	opacity: 0.7;
}
#auto-header-sp #spnav .spnav-bnr .thumb img {
	width: 100%;
	height: 100%;
/*	object-fit: cover;*/
    object-fit: contain;
}
#auto-header-sp #spnav .spnav-bnr .txt {
	flex: 1;
	overflow: hidden;
	display: flex;
	align-items: center;
	padding: 14px;
	font-size: 14px;
	font-weight: normal;
	line-height: 1.4;
	margin: 0;
	/*背景*/
	background: url(../images/common/icon-document.svg) center right 5px no-repeat;
	background-size: 20px;
	padding-right: 20px;
}

#auto-header-sp .spnav-btn {
	padding: 16px;
}
#auto-header-sp .spnav-btn a {
	width: 100%;
	height: 48px;
	font-weight: 600;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	font-size: 14px;
	line-height: 1;
	border-radius: 100px;
	position: relative;
	overflow: hidden;
	outline: none;
	vertical-align: bottom;
	text-decoration: none;
	background: #fff url("../images/common/btn-arrow-secondary.svg") right 12px center no-repeat;
	border: 1px solid #000;
	color: #000;
	transition: 0.3s;
}
#auto-header-sp .spnav-btn a:hover {
	color: #000;
	background: #E9E9E9 url("../images/common/btn-arrow-secondary.svg") right 12px center no-repeat;
}

/*--------------------------------
 パンくずリスト
---------------------------------*/
#breadcrumb {
    background: #fff;
}
#breadcrumb .breadcrumb__inner {
    padding: 12px 0;
    overflow-x: auto;
}
#breadcrumb ul {
    display: flex;
    width: max-content;
}
#breadcrumb li {
    padding-left: 10px;
    font-size: 12px;
	line-height: 1;
}
#breadcrumb li::after {
    content: '>';
    padding-left: 5px;
}
#breadcrumb li:last-child::after { content: ''; }

/*--------------------------------
 ページ下部バー
---------------------------------*/
#contents .bottom-bar {
	background-color: rgba(255, 255, 255, 1);
	width: 100%;
	z-index: 100;
	position: fixed;
	bottom: 0;
	box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.16);
}
#contents .bottom-bar__inner {
	display: flex;
	justify-content: center;
}

#contents .foot-nav {
	justify-content: space-around;
	height: 80px;
	max-width: 980px;
	padding: 16px 0;
	margin: auto;
}
#contents .foot-nav > div {
	margin: 0 15px;
}

/*----- .f-icon -----*/
#contents .f-icon {
	width: 60px;
	display: block;
	text-align: center;
	color: #3A3A3A;
	font-size: 10px;
	padding: 46px 0 0;
	position: relative;
}
#contents .f-icon img {
	width: 35px;
	height: 35px;
	position: absolute;
	top: calc(50% - 5px);
	left: 50%;
	transform: translate(-50%, -50%);
}
#contents .f-icon img:nth-child(2) {
	opacity: 0;
}
#contents .f-icon:hover img:nth-child(1),
#contents .f-icon.active img:nth-child(1) {
	opacity: 0;
}
#contents .f-icon:hover img:nth-child(2),
#contents .f-icon.active img:nth-child(2) {
	opacity: 1;
}
#contents .f-icon:hover, #contents .f-icon.active {
	color: #CC0305;
}

/*
#contents .f-icon.ic1 {
	background-image: url("../images/common/foot-icon01.png");
}
#contents .f-icon.ic2 {
	background-image: url("../images/common/foot-icon02.png");
}
#contents .f-icon.ic3 {
	background-image: url("../images/common/foot-icon03.png");
}
#contents .f-icon.ic4 {
	background-image: url("../images/common/foot-icon04.png");
}
#contents .f-icon.ic5 {
	background-image: url("../images/common/foot-icon05.png");
}
#contents .f-icon.ic6 {
	background-image: url("../images/common/foot-icon06.png");
}

#contents .f-icon.ic1:hover, #contents .f-icon.ic1.active {
	background-image: url("../images/common/foot-icon01-ov.png");
}
#contents .f-icon.ic2:hover, #contents .f-icon.ic2.active {
	background-image: url("../images/common/foot-icon02-ov.png");
}
#contents .f-icon.ic3:hover, #contents .f-icon.ic3.active {
	background-image: url("../images/common/foot-icon03-ov.png");
}
#contents .f-icon.ic4:hover, #contents .f-icon.ic4.active {
	background-image: url("../images/common/foot-icon04-ov.png");
}
#contents .f-icon.ic5:hover, #contents .f-icon.ic5.active {
	background-image: url("../images/common/foot-icon05-ov.png");
}
#contents .f-icon.ic6:hover, #contents .f-icon.ic6.active {
	background-image: url("../images/common/foot-icon06-ov.png");
}
*/
#contents .f-icon strong {
	font-weight: normal;
}
#contents .f-icon.arrival::after {
	content: "";
	position: absolute;
	top: 1px;
	right: 6px;
	width: 12px;
	height: 12px;
	background: #CC0000;
	border-radius: 50%;
}
#contents .f-icon::before {
	position: absolute;
	top: 33px;
	left: 0;
	width: 100%;
}
#contents .f-icon.ic1::before {
	content: "ホーム";
}
#contents .f-icon.ic2::before {
	content: "決済";
}
#contents .f-icon.ic5::before {
	content: "お知らせ";
}
#contents .f-icon.ic6::before {
	content: "登録情報";
}
#contents .f-icon.ic7::before {
	content: "Total Care";
}
#contents .f-icon.ic7 img {
    width: 30px;
    height: 30px;
    top: 38%;
}

/*--------------------------------
 パーツ
---------------------------------*/
/*----- .btn -----*/
#contents .btn {
	min-width: 298px;
	width: 100%;
	height: 48px;
	font-weight: normal;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	font-size: 16px;
	line-height: 1;
	border-radius: 100px;
	position: relative;
	overflow: hidden;
	outline: none;
	vertical-align: bottom;
	padding: 0 30px;
}
#contents .btn-primary {
	color: #fff;
	background: #000 url("../images/common/btn-arrow-primary.svg") right 12px center no-repeat;
	border: 1px solid #000;
	transition: ease 0.2s;
	margin-bottom: 15px;
}
#contents .btn-secondary {
	background: #fff url("../images/common/btn-arrow-secondary.svg") right 12px center no-repeat;
	border: 1px solid #000;
	color: #000;
	background-color: #fff;
	transition: 0.3s;
	margin-bottom: 15px;
}
#contents .btn-tertiary {
	color: #fff;
	background: #041D41 url("../images/common/btn-arrow-primary.svg") right 12px center no-repeat;
	border: 1px solid #fff;
	transition: ease 0.2s;
	margin-bottom: 15px;
}
#contents .btn-primary:hover,
#contents .btn-secondary:hover,
#contents .btn-tertiary:hover {
	color: #000;
	background: #E9E9E9 url("../images/common/btn-arrow-secondary.svg") right 12px center no-repeat;
}
#contents .btn-back {
	text-align: center;
}
#contents .btn-back + .btn-back {
	margin-top: 10px;
}
#contents .btn-back a {
	font-size: 16px;
	text-decoration: underline;
}
#contents .btn-lines {
	font-size: 14px;
	line-height: 1.4;
}
#contents .form .btn-off {
	opacity: .2;
	pointer-events: none;
}
#contents .form .btn-on {
	opacity: 1;
}
#contents .btn-right {
	display: flex;
	justify-content: end;
}
#contents .btn-right .btn-secondary {
	max-width: 220px;
	min-width: unset;
	height: 35px;
}

#contents .btn-harf .btn-secondary {
	width: 298px;
}
/*----- .bnr -----*/
#contents .bnr {
	min-width: 298px;
	width: 100%;
	min-height: 65px;
	padding: 14px 35px 14px 14px;
	font-weight: 600;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	font-size: 16px;
	line-height: 1;
	border-radius: 4px;
	position: relative;
	overflow: hidden;
	outline: none;
	vertical-align: bottom;
	background: #fff url("../images/common/btn-arrow-secondary.svg") right 12px center no-repeat;
	color: #000;
	background-color: #fff;
	border: 1px solid #fff;
}
#contents .bnr:hover {
	border: 1px solid #000;
}
#contents .bnr.arrival::after {
	content: "";
	/*position: absolute;
	top: 0px;
	right: 8px;*/
	width: 12px;
	height: 12px;
	background: #CC0000;
	border-radius: 50%;
	margin: 0 0 15px 20px;
}

#contents .bnr-icon {
	min-height: 80px;
	padding-left: 65px;
}
#contents .bnr-icon::before {
	content: "";
	width: 40px;
	height: 40px;
	position: absolute;
	top: 50%;
	left: 14px;
	transform: translateY(-50%);
	background-image: url("../images/common/foot-icon01.png");
	background-repeat: no-repeat;
	background-position: left center;
	background-size: contain;
}
#contents .bnr-icon span {
	display: block;
	width: 100%;
	font-size: 14px;
	line-height: 1.4;
	font-weight: normal;
	margin-top: 5px;
}

/*----- #tab -----*/
#contents .tab {
	margin-top: 30px;
	background: #fff;
	border-bottom: 1px solid #000;
}
#contents .tab__inner {
	display: flex;
}
#contents .tab .tab-btn {
	cursor: pointer;
}
#contents .tab li {
	width: 50%;
}
#contents .tab li a {
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	font-size: 18px;
	line-height: 1;
	padding: 20px;
	position: relative;
	opacity: .3;
	transition: 0.3s;
}
#contents .tab li a.active,
#contents .tab li a:hover {
	opacity: 1;
}
#contents .tab li a.active::after {
	content: "";
	position: absolute;
	bottom: -1px;
	left: 0;
	width: 100%;
	height: 4px;
	background: #000;
}
#contents .tab li span {
	display: flex;
	justify-content: center;
	align-items: center;
	background: #CC0000;
	color: #fff;
	font-size: 10px;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	padding: 3px 3px;
	margin-left: 10px;
}
#contents .tab-contents .container {
	display: none;
}
#contents .tab-contents .container.show {
	display: block;
}

/*----- .h2-ttl -----*/
#contents .h2-ttl {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 15px;
}
#contents .h2-ttl__ttl {
	font-size: 20px;
	line-height: 1.5;
	font-weight: 600;
	display: flex;
	align-items: center;
}
#contents .h2-ttl__ttl::before {
	content: "";
	background: #CC0000;
	width: 4px;
	height: auto;
	min-height: 22px;
	border-radius: 2px;
	margin-right: 10px;
}
#contents .h2-ttl__more {
	font-size: 14px;
	line-height: 1.5;
	padding-right: 30px;
	text-align: right;
}
#contents .h2-ttl__more {
	background: url("../images/common/btn-arrow-secondary.svg") right center no-repeat;
}
#contents .h2-ttl__more a:hover {
	text-decoration: underline;
}
#contents .h2-read {
	font-size: 16px;
	line-height: 1.4;
	margin: 15px 0 25px;
}

#contents .h3-ttl {
	font-size: 18px;
	line-height: 1.2;
	font-weight: 600;
	margin-top: 5px;
	margin-bottom: 10px;
}

/*----- #bottom-link -----*/
#bottom-link ul {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
/*#bottom-link ul::before {
	content: "";
	width: 32.4%;
	order: 1;
}
#bottom-link ul::after {
	content: "";
	width: 32.4%;
}*/
#bottom-link li {
	width: 32.4%; /*49.33%*/
	font-weight: normal;
	display: flex;
	align-items: center;
	position: relative;
	margin-bottom: 15px;
}
#bottom-link li a {
	display: block;
	width: 100%;
	background: url("../images/common/btn-arrow-secondary.svg") right 12px center no-repeat;
	background-color: #fff;
	background-size: 32px;
	padding: 18px 20px 18px 60px;
	color: #000;
	font-size: 14px;
	border: 1px solid #fff;
	border-radius: 4px;
}
#bottom-link li::before {
	content: "";
	position: absolute;
	left: 14px;
	width: 32px;
	height: 32px;
	background: url("../images/common/bottom-icon01.png") center no-repeat;
	background-size: 32px;
}
#bottom-link li a:hover {
	border: 1px solid #000;
}
#bottom-link .l-ic1::before {background-image: url("../images/common/bottom-icon01.png");}
#bottom-link .l-ic2::before {background-image: url("../images/common/bottom-icon02.png");}
#bottom-link .l-ic3::before {background-image: url("../images/common/bottom-icon03.png");}
#bottom-link .l-ic4::before {background-image: url("../images/common/bottom-icon04.png");}
#bottom-link .l-ic5::before {background-image: url("../images/common/bottom-icon05.png");}

/*----- .pagenation -----*/
#contents .pagenation {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	margin: 30px 0;
}
#contents .pagenation ul {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin: 0 20px;
}
#contents .pagenation li {
	margin: 0 6px;
}
#contents .pagenation a {
	display: flex;
	justify-content: center;
	align-items: center;
	color: #999;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	font-size: 16px;
	line-height: 1;
}
#contents .pagenation li.active a {
	color: #000;
	font-weight: 600;
	background: #fff;
	pointer-events: none;
}

#contents .pagenation > a::before {
	content: '';
	width: 24px;
	height: 24px;
	display: inline-block;
}
#contents .pagenation > a.prev::before {
	background: url(../images/common/btn-arrow-prev.svg) center center no-repeat;
}
#contents .pagenation > a.next::before {
	background: url(../images/common/btn-arrow-next.svg) center center no-repeat;
}
#contents .pagenation > a.first::before {
	background: url(../images/common/btn-chevrons-left.svg) center center no-repeat;
}
#contents .pagenation > a.last::before {
	background: url(../images/common/btn-chevrons-right.svg) center center no-repeat;
}
/*----- .pagenation 表示切替 -----*/
#contents .pagenation li:not(.active) {
	display: none;
}

/* 前後2個表示 */
#contents .pagenation li.active + li, 
#contents .pagenation li.active + li + li,
#contents .pagenation li:has(+ li.active),
#contents .pagenation li:has(+ li + li.active),
/* 5個表示 */
#contents .pagenation li.active:first-child ~ li:nth-child(-n+5),
#contents .pagenation li:nth-child(2).active  ~ li:nth-child(5),
#contents .pagenation li:has(+ li + li + li + li.active:last-child), 
#contents .pagenation li:has(+ li + li + li.active:last-child),
#contents .pagenation li:has(+ li + li + li.active + li:last-child) {
/*:nth-last-child(-n+3)*/
	display:flex;
}

/* prev next */
#contents .pagenation a:has( ~  ul li.active:first-child),
#contents .pagenation ul:has(> li.active:last-child) ~ a {
	display: none;
}

/*----- .page-nav -----*/
#contents .page-nav {
	width: 100%;
	margin-bottom: 10px;
}
#contents .page-nav a {
	font-size: 14px;
	line-height: 1;
	font-weight: 600;
	display: inline-flex;
	gap: 7px;
	padding: 10px 0;
}
#contents .page-nav a:hover {
    text-decoration: underline;
}

#contents .page-nav a::before {
  content: '';
  display: inline-block;
  width: 15px;
  height: 15px;
  background: url("../images/common/btn-arrow-prev.svg") center no-repeat;
 /* background-size: contain;*/
}

#contents .page-nav a.next::before {
  transform: rotate(90deg);
}

#contents .page-nav a.prev::before {
  transform: rotate(-90deg);
}

#contents .page-nav a.disabled {
  opacity: 0.3;
  pointer-events: none;
}

/*----- .enjoy-ietm -----*/
#contents .enjoy-item .item {
	margin-bottom: 15px;
}
#contents .enjoy-item .item a {
	display: flex;
	position: relative;
	background-color: #fff;
	border-radius: 4px;
	overflow: hidden;
	padding: 15px 8px 15px 15px;
	border: 1px solid #fff;
}
#contents .enjoy-item .item .item__thumb {
	width: 76px;
	transition: 0.3s;
}
#contents .enjoy-item .item .item__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
#contents .enjoy-item .item .item__txt {
	flex: 1;
	overflow: hidden;
	display: flex;
	align-items: center;
	padding-left: clamp(10px, 5%, 40px);
	margin: 0;
	font-size: 14px;
	line-height: 1.4;
}
#contents .enjoy-item .item .item__txt .icon-doc {
	padding-right: clamp(20px, 16%, 35px);
}

@media (hover: hover) {
	#contents .enjoy-item .item a:hover {
		border: 1px solid #000;
	}
	#contents .enjoy-item .item a:hover .item__thumb {
		opacity: 0.7;
	}
}

/*--------------------------------
 スライダー ベース
---------------------------------*/
/*----- slick -----*/
#contents .slider {
	opacity: 0;
	transition: opacity .3s ease;
}
#contents .slider.slick-initialized {
	opacity: 1;
}
#contents .slick-slide {
	height: auto !important;
}
#contents .slick-track {
    display: flex;
}
#contents .slick-slider .item {
    max-width: 300px;
    margin-right: 16px;
	display: flex;
}
#contents .slick-arrow {
	background: #F0F0F0 !important;
	/*border-radius: 50%;*/
	z-index: 1;
	font-size: 0;
}
#contents .slick-arrow:hover, .slick-arrow:focus {
	background: #F0F0F0 !important;
}
#contents .slick-arrow:before {
	content: "" !important;
	width: 100% !important;
	height: 100% !important;
	position: absolute;
	top: 50%;
	left: 0 ;
	transform: translate(0, -50%);
	opacity: 1 !important;
}
#contents .slick-prev:before {
	background: url("../images/common/btn-arrow-secondary.svg") 0 center no-repeat !important;
	background-size: 35px !important;
	transform: scale(-1, 1);
	top: 0;
}
#contents .slick-next {
	right: 0;
	border-radius: 48px 0 0 48px;
}
#contents .slick-next:before {
	background: url("../images/common/btn-arrow-secondary.svg") 0 center no-repeat !important;
	background-size: 35px !important;
}
#contents .slick-prev, .slick-next {
/*	width: 48px !important;*/
	width: 24px !important;
	height: 48px !important;
}
#contents .slick-prev {
	display: none !important;
	left: 0;
	border-radius: 0 48px 48px 0;
}
#contents .slick-dots {
	bottom: 0 !important;
	text-align: left !important;
}
#contents .slick-dotted.slick-slider {
    margin-bottom: 0 !important;
}
#contents .slick-dots li {
	margin: 0 10px 0 0 !important;
}
#contents .slick-dots li.slick-active {
	margin: 0 45px 0 0 !important;
}
#contents .slick-dots li,
#contents .slick-dots li button {
	width: auto !important;
	height: 4px !important;
	padding: 0 !important;
	font-size: 0;
}
#contents .slick-dots li button:before {
	content: '' !important;
	width: 4px !important;
	height: 4px !important;
	background: #B3B3B3;
	opacity: 1 !important;
	border-radius: 2px;
}
#contents .slick-dots li.slick-active button:before {
	width: 40px !important;
	background: #CC0000;
	opacity: 1 !important;
}

#contents .slick-dots > li:first-child:last-child {
    display: none;
}
/*--------------------------------
 スライダー 個別
---------------------------------*/
/*----- .fov-shop -----*/
#contents .fov-shop__slide .item {
	width: 40%;
	min-width: 700px;
	min-height: 140px;
	border-radius: 4px;
	overflow: hidden;
	background: #fff;
	font-size: 14px;
	line-height: 1.4;
	padding: 20px 20px;
}
#contents .fov-shop__slide .item {
	display: flex !important;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	position: relative;
}
#contents .fov-shop__slide .item .shop-info__add {
	flex: 1;
	padding: 0 20px 0 0;
	/*border-right: 1px solid #ccc;*/
	margin-right: 20px;
}
#contents .fov-shop__slide .item .shop-info__add .ttl {
	font-size: 16px;
	line-height: 1.4;
	margin-bottom: 10px;
}
#contents .fov-shop__slide .item .shop-info__add .add {
	/*background: url("../images/common/icon-map.png") left top 2px no-repeat;
	background-size: 16px;*/
	padding-left: 25px;
	margin-bottom: 5px;
}
#contents .fov-shop__slide .item .shop-info__add .add a {
	text-decoration: underline;
}
#contents .fov-shop__slide .item .shop-info__add .add span {
	margin-right: 10px;
}
#contents .fov-shop__slide .item .shop-info__add .tel {
	background: url("../images/common/icon-tel.png") left top 2px no-repeat;
	background-size: 16px;
	padding-left: 25px;
	margin-bottom: 5px;
}
#contents .fov-shop__slide .item .shop-info__add .tel a {
    pointer-events: none;
}
#contents .fov-shop__slide .item .shop-info__add .time {
	padding-left: 25px;
}
#contents .fov-shop__slide .item .shop-info__add .time span {
	font-weight: 600;
}
#contents .fov-shop__slide .item .shop-info__btn {
	text-align: center;
}
#contents .fov-shop__slide .item .shop-info__btn .btn {
	min-width: 220px;
	height: 35px;
	font-size: 14px;
	padding: 11px 14px;
	margin-bottom: 5px;
}
#contents .fov-shop__slide .item .shop-info__btn .btn-delete {
	font-size: 12px;
	margin-top: 10px;
}
#contents .fov-shop__slide .item .shop-info__btn .btn-delete a {
	text-decoration: underline;
}

/*----- .fov-car -----*/
#contents .fov-car__slide .item {
	width: 40%;
	min-width: 400px;
}
#contents .fov-car__slide .item a {
	display: flex;
	position: relative;
	border-radius: 4px;
	overflow: hidden;
	background-color: #fff;
}
#contents .fov-car__slide .item .item__thumb {
	width: 50%;
	height: 100px;
	transition: 0.3s;
}
#contents .fov-car__slide .item a:hover .item__thumb {
	opacity: 0.7;
}
#contents .fov-car__slide .item .item__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
#contents .fov-car__slide .item .item__txt {
	flex: 1;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	padding: 14px;
	margin: 0;
}
#contents .fov-car__slide .item dt.ttl {
	font-size: 16px;
	font-weight: 600;
	line-height: 1.4;
	margin-bottom: 5px;
}
#contents .fov-car__slide .item dd.txt {
	font-size: 14px;
	margin-bottom: auto;
}
#contents .fov-car__slide .item dd.price {
	font-size: 12px;
	font-weight: 600;
	text-align: right;
}
#contents .fov-car__slide .item dd.price span {
	font-size: 16px;
}

/*----- .user-voice -----*/
#contents .user-voice__slide .item {
	width: 40%;
	min-width: 400px;
}
#contents .user-voice__slide .item a {
	display: flex;
	position: relative;
	border-radius: 4px;
	overflow: hidden;
	background-color: #fff;
	/*pointer-events: none;リンク削除*/
}
#contents .user-voice__slide .item .item__thumb {
	width: 35%;
	height: 100px;
	transition: 0.3s;
}
#contents .user-voice__slide .item a:hover .item__thumb {
	opacity: 0.7;
}
#contents .user-voice__slide .item .item__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
#contents .user-voice__slide .item .item__txt {
	flex: 1;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	padding: 14px;
	margin: 0;
}
#contents .user-voice__slide .item dd.car {
	color: #7C7C7C;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.4;
}
#contents .user-voice__slide .item dt.ttl {
	font-size: 14px;
	font-weight: 600;
	line-height: 1.4;
	margin-top: auto;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}
#contents .user-voice__slide .item dd.name {
	font-size: 12px;
	line-height: 1;
}
#contents .user-voice__slide .item dd.date {
	position: absolute;
	top: 14px;
	right: 14px;
	color: #7C7C7C;
	font-size: 10px;
	line-height: 1;
}

/*--------------------------------
 accordion 
---------------------------------*/
#contents .accordion-title {
  position: relative;
  margin-bottom: 25px;
  padding: 10px 0 10px 30px;
  border-bottom: solid 1px #a9a9a9; /*#ccc*/
  cursor: pointer;
  font-size: 18px;
  font-weight: bold;
}

#contents .accordion-title::before {
  display: inline-block;
  content: "";
  position: absolute;
  top: calc(50% - 17px);
  left: -5px;
  width: 35px;
  height: 35px;
  transition: 0.3s;
  background: url(../images/common/btn-arrow-secondary.svg) 0 center no-repeat;
  background-size: 35px;
}

#contents .accordion-title.is-open::before {
  transform: rotate(90deg);
}

#contents .accordion-hide {
  text-align: right;
  margin-top: 15px;
  font-size: 16px;
  font-weight: bold;
}

@media (hover: hover) {
  #contents .accordion-hide button:hover {
    text-decoration: underline;
  }
}

/*--------------------------------
 フォーム要素
---------------------------------*/
#contents input { /* ios */
	font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", "Meiryo", "Arial", sans-serif;
}
#contents input:focus {
	outline-color: #000;
	outline-style: solid;
}
#contents input [type="radio"] {
	-webkit-appearance: button;
	-moz-appearance: button;
	appearance: button;
}

#contents .error-txt,
#contents .alert-txt {
	font-size: 16px;
	line-height: 1.4;
	font-weight: 600;
	color: #cc0000;
	/* padding-left: 1em;
	text-indent: -1em; */
	margin-bottom: 10px;
}
#contents .error-txt {
	display: none;
}
#contents .alert-txt:empty {
	margin-top: -20px;
}
#contents .error-txt p,
#contents .alert-txt p {
	margin-bottom: 10px;
}

#contents .textbox {
	margin-bottom: 25px;
}
#contents .textbox input {
	width: 100%;
	font-size: 16px;
	line-height: 1.4;
	border-radius: 4px;
	background: #fff;
	padding: 18px 20px;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	position: relative;
}
#contents .textbox input:disabled {
	background: #e9e9e9;
}
#contents .textarea {
	margin-bottom: 25px;
}
#contents .textarea textarea {
	width: 100%;
	font-size: 16px;
	line-height: 1.4;
	border-radius: 4px;
	background: #fff;
	padding: 18px 20px;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	position: relative;
}

/*passwordの表示・非表示*/
#contents .password {
	position: relative;
}
#contents .mdi-eye:before,
#contents .mdi-eye-off:before {
	background: url( "../images/common/icon-pass-on.svg");
	background-size: contain;
	content: '';
	display: block;
	width: 18px;
	height: 18px;
	cursor: pointer;
}
#contents .mdi-eye-off:before {
	background: url( "../images/common/icon-pass-off.svg");
	background-size: contain;
}
#contents .field-icon {
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
}
#contents .post-code {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}
#contents .post-code input {
	width: 110px;
}
#contents .post-code .hyphen {
	margin-right: 10px;
}
#contents .post-code__btn {
	min-width: 110px;
	padding: 18px 20px;
	font-weight: normal;
	text-align: center;
	font-size: 16px;
	border-radius: 4px;
	background: #fff;
	border: 1px solid #000;
	position: relative;
	overflow: hidden;
	outline: none;
	vertical-align: bottom;
}
#contents .post-code__btn:hover {
	background: #E9E9E9;
}

#contents .checkbox {
	margin-bottom: 25px;
}
#contents .checkbox input[type=checkbox] {
	display: none;
}
#contents .checkbox label {
	position: relative;
	display: flex;
	align-items: center;
	font-size: 14px;
	line-height: 1;
	background: #fff;
	border-radius: 4px;
	border: 1px solid #fff;
	padding: 18px 20px 18px 40px;
	overflow: hidden;
}
#contents .checkbox input[type=checkbox] + label::before {
	position: absolute;
	content: '';
	display: block;
	width: 20px;
	height: 20px;
	background: url("../images/common/checkbox.svg") no-repeat;
	background-size: contain;
	left: 10px;
	top: 50%;
	transform: translateY(-50%);
}
#contents .checkbox input[type=checkbox]:checked + label::before {
	background: url("../images/common/checkbox-ov.svg") no-repeat;
	background-size: contain;
}
#contents .checkbox label:hover {
    border: 1px solid #000;
}

#contents .radiobtn {
	margin-bottom: 25px;
}
#contents .radiobtn input[type=radio] {
	display: none;
}
#contents .radiobtn label {
	position: relative;
	display: flex;
	align-items: center;
	font-size: 14px;
	line-height: 1;
	margin-bottom: 15px;
	background: #fff;
	border-radius: 4px;
	padding: 18px 20px 18px 40px;
	border: 1px solid #fff;
}
#contents .radiobtn input[type=radio] + label::before {
	position: absolute;
	content: '';
	display: block;
	width: 20px;
	height: 20px;
	background: url("../images/common/radiobtn.svg") no-repeat;
	background-size: contain;
	left: 10px;
	top: 50%;
	transform: translateY(-50%);
}
#contents .radiobtn input[type=radio]:checked + label::before {
	background: url("../images/common/radiobtn-ov.svg") no-repeat;
	background-size: contain;
}
#contents .radiobtn input[type=radio]:disabled + label {
	pointer-events: none;
	display: none;
}
#contents .radiobtn input[type=radio]:disabled:checked + label {
	display: block;
	pointer-events: none;
	background: #e9e9e9;
	border: solid 1px #e9e9e9;
}

#contents .radiobtn label:hover {
    border: 1px solid #000;
}

#contents .select {
	position: relative;
	margin-bottom: 25px;
}
/*.select::after {
	content: "";
	display: block;
	width: 8px;
	height: 8px;
	border-bottom: 2px solid #333;
	border-right: 2px solid #333;
	position: absolute;
	top: 50%;
	right: 20px;
	transform: rotate(45deg) translateY(-50%);
	margin-top: -3px;
}*/
#contents .select select {
	-webkit-appearance: none;
	appearance: none;
	width: 100%;
	font-size: 16px;
	line-height: 1.5;
	border-radius: 4px;
	padding: 16px 32px 16px 20px;
	box-sizing: border-box;
	cursor: pointer;
	background: #fff url("../images/common/select-arrow-primary.svg") right 12px center no-repeat;
	border: 1px solid #fff;
	/**/
	overflow: hidden;
    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}
#contents .select select:disabled {
	pointer-events: none;
	background: #e9e9e9;
	border: solid 1px #e9e9e9;
}
#contents .select select:hover {
	border: 1px solid #000;
}

#contents .star-rating {
	display: flex;
	flex-direction: row-reverse;
	justify-content: center;
	background: #fff;
	border-radius: 4px;
	padding: 25px 20px;
	text-align: center;
	margin-bottom: 40px;
}
#contents .star-rating input[type=radio] {
	display: none;
}
#contents .star-rating label {
	position: relative;
	padding: 0 5px;
	color: #ccc;
	cursor: pointer;
	width: 30px;
	height: 30px;
	font-size: 0;
	background: url("../images/common/star-rating.svg") no-repeat;
	background-size: contain;
	margin: 0 7px;
}
#contents .star-rating label:hover {
	background: url("../images/common/star-rating-ov.svg") no-repeat;
	background-size: contain;
}
#contents .star-rating label:hover ~ label {
	background: url("../images/common/star-rating-ov.svg") no-repeat;
	background-size: contain;
}
#contents .star-rating input[type=radio]:checked ~ label {
	background: url("../images/common/star-rating-ov.svg") no-repeat;
	background-size: contain;
}

#contents .scroll-box {
	width: 100%;
	max-height: 460px;
	background: #fff;
	overflow-y: scroll;
	overflow-x: hidden;
	border: 1px solid #ccc;
	border-radius: 4px;
	padding: 16px;
	margin-bottom: 25px;
}
#contents .scroll-box::-webkit-scrollbar {
	width: 4px;
}
#contents .scroll-box::-webkit-scrollbar-thumb {
	background: #7C7C7C;
	border-radius: 4px;
	width: 4px;
}
#contents .scroll-box::-webkit-scrollbar-track {
	background: rgba(0, 0, 0, 0);
}
#contents .scroll-box hr {
	border-top: 1px solid #ccc;
}

/*--------------------------------
モーダル
---------------------------------*/
.modal-window {
	display: none;
}

/* モーダルライブラリの上書き */
.modaal-overlay {
	opacity: 0.75 !important;
}

.modaal-inner-wrapper {
	padding: 0 !important;
}

/* modaal-container HTMLコンテンツ用のモーダル*/
.modaal-container {
	font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", "Meiryo", "Arial", sans-serif;
	max-width: 600px !important;
	border-radius: 4px !important;
	padding: 30px;
	text-align: center !important;
}

.modaal-wrapper .modaal-content-container {
	padding: 0;
}

.cls-modal-wide .modaal-container {
	padding: 50px 30px;
}

.cls-modal-scrl .modaal-container { /* modal内スクロール */
	padding: 30px 18px 30px 30px;
}

/* 標準Closeボタン × → ボタンのカスタマイズやめる
.modaal-wrapper .modaal-close {
	position: relative;
	top: auto;
	right: auto;
}
.modaal-wrapper .modaal-close {
	width: auto !important;
	height: auto !important;
	margin: 0 auto;
}
.modaal-wrapper .modaal-close {
	min-width: 298px;
	height: 48px !important;
	padding: 14px !important;
	font-weight: normal;
	display: inline-block;
	text-align: center;
	font-size: 16px;
	border-radius: 100px;
	position: relative;
	overflow: hidden;
	outline: none;
	vertical-align: bottom;
}
.modaal-wrapper .modaal-close {
	background: #fff url("../images/common/btn-arrow-secondary.svg") right 12px center no-repeat !important;
	border: 1px solid #000 !important;
	transition: ease 0.2s;
	margin-bottom: 15px;
}
.modaal-wrapper .modaal-close:hover {
	background-color: #E9E9E9 !important;
}
.modaal-wrapper .modaal-close span {
	color: #000;
	font-size: 14px;
	width: auto !important;
	height: auto !important;
	clip: auto;
	display: block;
	position: relative !important;
}
.modaal-wrapper .modaal-close:after, .modaal-wrapper .modaal-close:before {
    display: none;
    content: " ";
    position: absolute;
    top: 1px;
    left: 6px;
    width: 1px;
    height: 14px;
    border-radius: 0;
    background: #000;
}
.modaal-close:focus:after, .modaal-close:focus:before, .modaal-close:hover:after, .modaal-close:hover:before {
    background: #000 !important;
}
*/

/* .modaal-close */
.modaal-close:focus, .modaal-close:hover {
    background: unset !important;
}

.modaal-close:focus:after, .modaal-close:focus:before, .modaal-close:hover:after, .modaal-close:hover:before {
    background: #fff !important;
}

.modaal-close:after, .modaal-close:before {
    height: 40px !important;
}

.modal-window__inner { /* .btn_closeの親 */
	position: relative;
}

/* modal contents ttl */
.modal-window__inner .ttl {
	font-size: 18px;
	line-height: 1.5;
	font-weight: 600;
	margin-bottom: 20px;
	text-align: center;
}

.modal-window__inner .sub-ttl {
	font-size: 15px;
}

.modal-window__inner .ttl img {
	width: 400px;
	max-width: 100%;
	margin-top: 10px;
}

.modal-window__inner .txt {
	font-size: 14px;
	line-height: 1.4;
	margin-bottom: 20px;
	text-align: left;
}

.modal-window__inner .txt.note {
	font-size: 12px;
}

.modal-window__inner .alert-txt {
	font-weight: 600;
	color: #cc0000;
}

.modal-window__inner p {
	margin: 0;
}

.modal-window__inner p + p {
	margin-top: 15px;
}

.modaal-wrapper .modal-htc-inner .check_area { /* 非表示 */
	display: none;
}

.modal-window__inner .btn_result {
	background: #cc0000;
	border: 1px solid #cc0000;
	transition: 0.3s;
	width: 298px;
	max-width: 100%;
	height: 48px;
	font-size: 16px;
	border-radius: 100px;
	outline: none;
	margin: auto;
	display: block;
	color: #fff;
	cursor: pointer;
}

.modal-window__inner .btn_result:hover {
	background: #e04638;
	border: 1px solid #e04638;
}

.modal-window__inner .btn_wrap {
	display: flex;
	column-gap: 20px;
	justify-content: center;
}

.modal-window__inner .btn {
	font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", "Meiryo", "Arial", sans-serif;
	width: 298px;
	max-width: 100%;
	height: 48px;
	display: flex;
	justify-content: center;
	align-items: center;
	text-decoration: unset;
	font-size: 16px;
	line-height: 1;
	border-radius: 100px;
	overflow: hidden;
	outline: none;
	cursor: pointer;
	margin: auto;
	padding: 0 30px;
}

.modal-window__inner .btn-secondary {
	background: #fff url(../images/common/btn-arrow-secondary.svg) right 12px center no-repeat;
	border: 1px solid #000;
	color: #000;
	background-color: #fff;
	transition: 0.3s;
}

.modal-window__inner .btn-secondary:hover {
	background-color: #E9E9E9;
}

/* modal btn_close */
.modaal-wrapper .btn_close {
	display: block;
	position: absolute;
	top: -30px;
	right: -30px;
	width: 60px;
	height: 30px;
}

.modaal-wrapper.cls-modal-scrl .btn_close {
	right: -18px;
}

.modaal-wrapper .btn_close::before {
	display: block;
	content: "";
	position: absolute;
	top: 6px;
	right: 40px;
	width: 20px;
	height: 20px;
	background-image: url(../images/common/icon-cross-bk.svg);
	background-size: contain;
}

.modaal-wrapper .btn_close::after {
	display: block;
	content: "閉じる";
	position: absolute;
	top: 7px;
	right: 5px;
	width: 33px;
	height: 22px;
	font-size: 11px;
	font-weight: bold;
}

.modaal-wrapper .btn_close:focus::before,
.modaal-wrapper .btn_close:hover::before {
	background-image: url(../images/common/icon-cross-rd.svg);
}

.modaal-wrapper .btn_close:focus::after,
.modaal-wrapper .btn_close:hover::after {
	color: #cc0000;
}

/* modal cluboff */
.modal-cluboff-inner .item__img {
	width: 100%;
	display: flex;
	gap: 10px;
	margin-bottom: 20px;
}

.modal-cluboff-inner .item__img img {
	width: calc((100% - 20px) / 3);
	border-radius: 4px;
}

/* modal 段組み */
.modal-window__inner .column-set {
	min-height: 150px;
	padding-right: 12px;
	overflow-wrap: anywhere; /* 折り返し制御 */
}

.cls-modal-scrl .modal-window__inner .column-set {
	/* modal内スクロール */
	overflow-y: auto;
	max-height: calc(90svh - 60px);
}

@media not screen and (max-width: 768px) {
	/* pcのみ表示 */
	.cls-modal-scrl .column-set::-webkit-scrollbar {
		width: 6px;
		height: 6px;
	}
	.cls-modal-scrl .column-set::-webkit-scrollbar-thumb {
		background: #7C7C7C;
		border-radius: 4px;
		width: 4px;
	}
	.cls-modal-scrl .column-set::-webkit-scrollbar-track {
		background: rgba(0, 0, 0, 0);
	}
}

.modal-window__inner .column-set__inner {
	display: flex;
	flex-direction: column;
	justify-content: space-evenly;
	gap: 20px;
}

.modal-window__inner .column-set__inner > div {
	margin-bottom: 0!important;
	text-align: center;
}

.modal-window__inner .column-set__inner img {
	max-width: 100%;
}

.modal-window__inner #contents {
	background: #fff;
}

.modal-window__inner #contents .radiobtn,
.modal-window__inner #contents .checkbox {
	margin-bottom: 0;
}

.modal-window__inner #contents .column-single > label {
	width:100%;
}

.modal-window__inner #contents label {
	text-align: left !important;
	min-height: 48px;
	margin-bottom: 15px;
	border: 1px solid #ccc;
	padding: 9px 5px 9px 40px !important;
}

.modal-window__inner [type="button"]:disabled { /* choicesで使用 */
	background-color: #E9E9E9;
	pointer-events: none;
}

/*media Queries 768
----------------------------------------------------*/
@media screen and (max-width: 768px) {
	/* modal内スクロール */
	.cls-modal-scrl .modaal-container {
		width: 90vw;
		padding: 30px min(2vw, 8px) 30px min(5vw, 20px);
	}

	.cls-modal-scrl .column-set {
		padding-right: min(3vw, 12px);
	}

	.modaal-wrapper.cls-modal-scrl .btn_close {
		right: -5px;
	}

	.modal-window__inner .column-set__inner > div.ttl,
	.modal-window__inner .column-set__inner > div.txt {
		text-align: start;
		margin-inline: auto;
		max-inline-size: max-content;
	}

	.modal-window__inner #contents .column-harf > label {
		width: 49.33% !important;
	}

	.modal-window__inner .btn_wrap.column-harf {
		flex-flow: unset;
		gap: 10px;
	}

	.modal-window__inner .btn_wrap.column-harf .btn-secondary {
		background: #fff url(../images/common/btn-arrow-secondary.svg) right 5px center no-repeat;
		padding: 0 20px;
	}
}

/*--------------------------------
app
---------------------------------*/
/*----- .app-head -----*/
#contents .app-head {
	background: #fff;
}
#contents .app-head .page-ttl {
	padding: 20px 0;
	text-align: center;
}
#contents .app-head .page-ttl__ttl {
	font-size: 16px;
	line-height: 1;
	margin-bottom: 0;
}
#contents .app-head .app-head-nav {
	position: relative;
}
#contents .app-head .app-head-nav a {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 45px;
	height: 45px;
	display: block;
}
#contents .app-head .app-head-nav .prev a {
	background: url("../images/common/btn-arrow-prev.svg") center no-repeat;
	left: 0;
}
#contents .app-head .app-head-nav .next a {
	background: url("../images/common/btn-arrow-next.svg") center no-repeat;
	right: 0;
}
#contents .app-head .app-head-nav .btn-menu a {
	background: url("../images/common/btn-menu.svg") center no-repeat;
	left: 0;
}


/*media Queries 1000
----------------------------------------------------*/
@media screen and (max-width: 1000px) {
	#contents .container {
		width: 95%;
	}
	#contents .btn-reload {
    	left: calc(5% / 2);
    }
}
	
/*media Queries 768
----------------------------------------------------*/
@media screen and (max-width: 768px) {
/*--------------------------------
 全体
---------------------------------*/
	body {
		/*margin-bottom: 0px !important;*/
	}
	#contents .pc {
		display: none;
	}
	#contents .sp {
		display: block;
	}
	
/*--------------------------------
 レイアウト
---------------------------------*/
	#contents .container {
		width: 95%;
	}
	#contents .blank {
		font-size: 14px;
	}
	
	#contents .column-harf > div,
	#contents .column-harf > label {
		width: 100% !important;
	}
	#contents .column-harf.wide > div,
	#contents .column-harf.wide > label {
		width: 100% !important;
	}
	#contents .column-harf.always > div {
		width: 48.4% !important;
	}
	#contents .column-third > div,
	#contents .column-third > label {
		width: 49.33% !important;
	}
	#contents .column-fourth > div,
	#contents .column-fourth > label {
		width: 49.33% !important;
	}
	#contents .column-fifth > div,
	#contents .column-fifth > label {
		width: 48.5% !important;
	}
	#contents .fullwidth > .item {
		width: 100% !important;
	}

	#contents .txt-large {
		font-size: 16px;
	}
	#contents .txt-middle {
		font-size: 14px;
	}
	#contents .txt-small {
		font-size: 12px;
	}
	
	#auto-header, .slf-header, .car-category-nav, .sp-selected-car-view, .page-specification-side {
		transition: transform 0.3s;
	}
	#auto-header.is-hide {
		transform: translateY(-47px);
	}
	.slf-header.is-hide {
		transform: translateY(-166px);
	}
	.car-category-nav.is-hide {
		transform: translateY(-166px);
	}
	.sp-selected-car-view.is-hide {
		transform: translateY(-166px);
	}
	.page-specification-side.is-up {
		top: 122px;
	}
	
	.is-login-needed .login-alert {
		width: 100%;
	}
	.slf-breadcrumb__text {
		font-size: 12px;
	}
	
/*--------------------------------
 ヘッダー
---------------------------------*/
	#head-logo .head-logo__inner {
		padding: 6px 0 5px;
	}
	#head-logo .head-logo__inner img {
		/*width: 121px;
		height: 23px;*/
		/*width: 50px;*/
		width: 60px;
	}
	#contents .page-ttl {
		padding: 20px 10px;
	}
	#contents .page-ttl__ttl {
		font-size: 18px;
	}
	#contents .page-ttl__txt {
		font-size: 14px;
		margin-top: 15px;
		text-align: left;
	}
	#contents .page-ttl__caption {
		font-size: 12px;
		text-align: left;
	}
	#contents .btn-reload img {
		width: 40px;
	}

/*--------------------------------
ページ下部ナビバー
---------------------------------*/
	#contents .bottom-bar__inner {
		width: 100%;
	}
	/*#contents .foot-nav {
		height: 68px;
		padding: 10px 0;
	}*/
	#contents .foot-nav > div {
		margin: 0 0;
	}
	/*#contents .f-icon {
		width: 52px;
	}
	#contents .f-icon img {
		width: 26px;
		height: 26px;
		top: 4px;
	}*/
	#contents .f-icon strong {
		display: none;
	}
	
/*--------------------------------
パーツ
---------------------------------*/
	#contents .btn {
		font-size: 14px;
		width: 100%;
		min-width: 100%;
	}
	#contents .btn-back a {
		font-size: 14px;
	}
	#contents .btn-harf .btn-secondary {
		width: 100%;
	}
	
	#contents .bnr {
		font-size: 14px;
	}
	#contents .bnr-icon span {
		font-size: 12px;
	}
	
	#contents .tab li a {
		font-size: 16px;
	}
	
	#contents .h2-ttl__ttl {
		font-size: 16px;
	}
	#contents .h2-ttl__ttl::before {
		min-height: 18px;
	}
	#contents .h2-ttl__more {
		font-size: 12px;
	}
	#contents .h2-read {
		font-size: 14px;
	}
	#contents .h3-ttl {
		font-size: 14px;
		margin-bottom: 10px;
	}
	
	#bottom-link {
		margin: 0 calc(50% - 50vw);
		width: 100vw;
	}
	#bottom-link li {
		width: 100%;
		font-size: 14px;
		border-bottom: 1px solid #ccc;
		background-position: right 10px center;
		border-radius: 0;
		margin-bottom: 0;
	}
	#bottom-link li a {
		background-size: 26px;
		padding: 18px 20px 18px 60px;
	}
	
	#contents .pagenation ul {
		margin: 0 10px;
	}
	#contents .pagenation li {
		margin: 0 3px;
	}
	#contents .pagenation a {
		font-size: 14px;
		width: 25px;
		height: 25px;
	}
	
	/*#contents .page-nav a {
		padding: 16px 10px;
		font-size: 12px;
	}
	#contents .page-nav a.prev {
		padding-left: 30px;
	}
	#contents .page-nav a.next {
		padding-right: 30px;
	}*/
	
	/* .enjoy-item */
	#contents .enjoy-item .item {
		margin-bottom: 10px;
	}
	#contents .enjoy-item .item a {
		padding: 5px 8px 5px 15px;
	}
	#contents .enjoy-item .item .item__txt {
		padding-left: clamp(20px, 8%, 40px);
	}
	#contents .enjoy-item .item .item__txt .icon-doc {
		padding-right: 35px;
		line-height: 1.2;
	}

/*--------------------------------
スライダー 個別
---------------------------------*/
	/*----- .fov-shop -----*/
	#contents .fov-shop__slide .item {
		width: 100%;
		min-width: 200px;
		font-size: 12px;
	}
	#contents .fov-shop__slide .item > div {
		width: 100%;
		display: block;
	}
	#contents .fov-shop__slide .item .shop-info__add {
		padding: 0 0 20px 0;
		border-right: none;
		margin-right: 0;
	}
	#contents .fov-shop__slide .item .shop-info__add .ttl {
		font-size: 14px;
		padding-bottom: 10px;
		margin: 0 0 10px 0;
		border-bottom: 1px solid #ccc;
	}
	#contents .fov-shop__slide .item .shop-info__add .tel a {
		pointer-events: auto;
		text-decoration: underline;
	}
	#contents .fov-shop__slide .item .shop-info__btn {
		margin: 0 auto;
	}
	
	/*----- .user-voice -----*/
	#contents .user-voice__slide .item {
		min-width: 200px;
	}
	#contents .user-voice__slide .item dd.car {
		font-size: 12px;
		margin-top: 15px;
		margin-bottom: auto;
	}
	#contents .user-voice__slide .item dt.ttl {
		font-size: 12px;
	}
	#contents .user-voice__slide .item dd.name {
		font-size: 12px;
	}

/*--------------------------------
 accordion
---------------------------------*/
    #contents .accordion-title {
      font-size: 16px;
    }

    #contents .accordion-hide {
     text-align: center;
     font-size: 14px;
    }

/*--------------------------------
フォーム要素
---------------------------------*/
	#contents .error-txt,
	#contents .alert-txt {
		font-size: 14px;
	}
	#contents .textbox input {
		padding: 16px 20px;
	}
	
	#contents .radiobtn label {
		margin-bottom: 10px;
	}
	
	#contents .select {
		width: 100%;
		margin-bottom: 35px;
	}
	#contents .select select {
		font-size: 14px;
	}
	
	#contents .star-rating {
		padding: 20px 10px;
		margin-bottom: 35px;
	}
/*--------------------------------
モーダル
---------------------------------*/
	.modal-window__inner .btn_wrap {
		flex-direction: column;
    	row-gap: 15px;
	}

	.modal-window__inner .btn {
		font-size: 14px;
		width: 100%;
	}

	/* modal cluboff */
	.modal-cluboff-inner .btn_wrap {
		flex-direction: column-reverse;
	}

	.modal-cluboff-inner .btn {
		height: 35px;
	}
}

/*media Queries 400
----------------------------------------------------*/
@media screen and (max-width: 400px) {
/*--------------------------------
 ヘッダー
---------------------------------*/
	#contents .btn-reload + .page-ttl__ttl {
		padding-left: 30px;
		padding-right: 10px;
	}
}

/*-------------------------------
Backdrop
---------------------------------*/
.loader {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  z-index: 10000;
  background: url('/PersonalPortalAssets/js/slick/ajax-loader.gif') 50% 50% no-repeat rgb(249,249,249);
  opacity: .8;
}
/*--------------------------------
 lity.js
---------------------------------*/
.lity {
	background: rgb(15 34 48 / 70%) !important;
}
.lity-wrap::before {
	margin-right: 0 !important;
}
.lity-youtube .lity-container {
	width: 80vw !important;
	max-width: 900px !important;
}
.lity-close {
	width: 35px !important;
	height: 35px !important;
	position: absolute !important;
	top: -35px !important;
	right: 5px !important;
	font-size: 50px !important;
	font-weight: normal !important;
	font-family: unset !important;
	text-shadow: unset !important;
}

@media screen and (min-width: 769px) {
	.lity-image img {
		max-height: 85svh !important;
	}
}

.item .underline-list .column a {
  text-decoration: underline !important;
}