/*===============================================================================
共通
================================================================================*/
.access__group:not(:last-child){
	margin-bottom: var(--g-sec--lg);
}
.access__group.--has-bgc{
	position: relative;
	padding: var(--g-sec--lg) 0;
}
.access__group.--has-bgc::before{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: -1;
	content: "";
	max-width: 1200px;
	width: 105vw;
	height: 100%;
	background: linear-gradient(165.76deg, #EFF5FB 10.12%, #EFFBF5 89.88%);
	border-radius: var(--bd-r--lg);
	overflow: hidden;
}

.access__container{
	max-width: var(--width-sm);
	margin-inline: auto;
}

.access__box:not(:last-child){
	margin-bottom: var(--g-sec--md);
}

.access__title{
	text-align: center;
	color: var(--c-main);
}


/*===============================
 * 2カラム
 * =================================*/
.access__cols{
	--count: 1;
	--gap: var(--g-sec--sm);
	--media-width: 100%;
	--body-width: calc( 200% - var(--media-width) );
	display: flex;
	flex-wrap: wrap;
	gap: var(--gap);
}
@media (min-width: 768px){
	.access__cols{
		--media-width: 85%;
		--count: 2;
	}
}
.access__map{
	width: calc( ( var(--media-width) - var(--gap) * (var(--count) - 1) ) / var(--count) );
	border: 4px solid var(--c-blue);
	border-radius: var(--bd-r--lg);
	overflow: hidden;
}
.access__map iframe{
	display: block;
	width: 100%;
	height: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	object-position: 50% 50%;
}
.access__content{
	width: calc( ( var(--body-width) - var(--gap) * (var(--count) - 1) ) / var(--count) );
	font-weight: var(--fw-lg);
}

.access__info>*:not(:last-child){
	margin-bottom: .25rem;
}

/*===============================
* アコーディオン
* =================================*/
.access-accordion{
	--side-pad: 2rem;
	--vertical-pad: 1.5rem;
	--gap: .25em;
	--this-color: var(--c-light);
	display: block;
	width: 100%;
}

/**********************************
* ***質問
* **********************************/
.access-accordion__head{
	position: relative;
	z-index: 5;
	display: flex;
	gap: var(--gap);
	max-width: 560px;
	width: 91%;
	margin-inline: auto;
	padding: var(--vertical-pad) var(--side-pad); /* クリック可能範囲の確保 */
	background: var(--c-act01);
	border-radius: 100vmax;
	overflow: hidden;
	cursor: pointer;
	transition: var(--ani-t--normal) ease-out;
}

.access-accordion__headInner{
	flex-grow: 1;
	text-align: center;
	font-size: 1.75rem;
	font-weight: var(--fw-xl);
	color: var(--this-color);
}

/**********************************
* ***回答
* **********************************/
.access-accordion__body{
	position: relative;
	top: -3rem;
	z-index: 1;
	display: flex;
	gap: var(--gap);
	padding: var(--g-sec--lg) 1rem var(--g-sec--sm);
	background: var(--c-light);
}

/* アニメーション */
.access-accordion[open] .access-accordion__body {
	animation: fadein 0.5s ease;
}
@keyframes fadein {
	0% { opacity: 0; }
	100% { opacity: 1; }
}
.access-accordion__bodyInner{
	display: flex;
	flex-direction: column;
	gap: var(--g-sec--md);
	flex-grow: 1;
	max-width: 800px;
	margin-inline: auto;
}

.access-accordion__desc{
	display: flex;
	align-items: baseline;
	margin-bottom: var(--g-sec--xs);
	font-weight: var(--fw-lg);
}
.access-accordion__image{
	border-radius: var(--bd-r--sm);
	overflow: hidden;
}
.access-accordion__hr{
	width: 100%;
	height: 1px;
	background: var(--c-gray);
}

.access-accordion__root.--btn{
	text-align: center;
}
.access-accordion__cta{
	margin-bottom: .75rem;
	font-weight: var(--fw-lg);
}


/**********************************
* ***開閉アイコン
* **********************************/
.access-accordion__toggle{
	--toggle-size: .75em;
	position: relative;
	display: inline-block;
	align-self: center;
	margin-left: var(--gap);
	width: var(--toggle-size);
	min-width: var(--toggle-size);
	aspect-ratio: 1;
}
.access-accordion__toggle::before,
.access-accordion__toggle::after{
	position: absolute;
	top: 50%;
	left: 50%;
	content: '';
	width: var(--toggle-size);
	height: 2px;
	background: var(--this-color);
	transition: var(--ani-t--normal) ease-out;
}
.access-accordion__toggle::before{transform: translate(-50%, -50%) rotate(90deg);}
.access-accordion__toggle::after{transform: translate(-50%, -50%) rotate(0deg);}

/* アニメーション */
.access-accordion[open] .access-accordion__toggle::before{transform: translate(-50%, -50%) rotate(180deg);}
.access-accordion[open] .access-accordion__toggle::after{
	opacity: 0;
	transform: translate(-50%, -50%) rotate(90deg);
}

/* 既存のマーカー */
.c-accordion__head {
	list-style: none;
}
.c-accordion__head::-webkit-details-marker {
	display: none;
}




/*===============================================================================
nav
================================================================================*/
.access__group.--nav{
	display: flex;
	justify-content: center;
}
.access__group.--nav > a{
	max-width: 380px;
}