@charset "UTF-8";



/*導入
-----------------------------------------------*/
.lead {
	background: url("../images/access/bg_lead.jpg") no-repeat center top;
	background-size: 100% auto;
}
.lead__caption {
	margin-top: var(--gap-60);
	opacity: 0.7;
}
.lead__layout {
	display: flex;
    justify-content: space-between;
    align-items: center;
}
.lead__layout-img {
	width: min(48%,600px);
}
.lead__layout-txt {
	width: min(48%,590px);
}
.lead__layout-txt p.u-ft-min {
	font-size: min(4.0rem,3.0vw);
	letter-spacing: normal;
	line-height: 1.4em;
}
.lead__layout-txt dt {
	line-height: 1.0em;
	padding-left: 1.0em;
	position: relative;
	margin-top: 2.0em;
	margin-bottom: 1.0em;
}
.lead__layout-txt dt::before {
	content: "";
	position: absolute;
	width: 1px;
	height: 100%;
	background: currentcolor;
	left: 0;
	top: 0;
	transform: rotate(20deg);
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
.lead__layout-txt p.u-ft-min {
	font-size: min(4.0rem,3.5vw);
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.lead {
	background-size: 150% auto;
}
.lead__layout {
	display: block;
}
.lead__layout-img {
	width: 100%;
	margin-bottom: var(--gap-40);
}
.lead__layout-txt {
	width: 100%;
}
.lead__layout-txt p.u-ft-min {
	font-size: var(--fs-34);
}
.lead__layout-txt dt {
	margin-top: 1.5em;
	margin-bottom: .5em;
}
}



/*ページ内共通
-----------------------------------------------*/
.p-access__map-size {
	width: min(80vw,1000px);
	margin-inline: auto;
}

.p-access__ttl {
	font: var(--font-min);
	font-size: var(--fs-32);
	letter-spacing: .04em;
	line-height: 1.5em;
	padding-left: .8em;
	position: relative;
	margin-bottom: .6em;
}
.p-access__ttl::before {
	content: "";
	position: absolute;
	width: 1px;
	height: calc(100% - .6em);
	background: currentcolor;
	left: 0;
	top: .4em;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.p-access__ttl {
	font-size: var(--fs-26);
	letter-spacing: normal;
}
.p-access__map-size {
	width: 100%;
}
}



/*map
-----------------------------------------------*/
.map__bg {
	background: #eceee8;
}
.map h2 {
	margin-bottom: var(--gap-60);
}
.map iframe {
	display: block;
	width: 100%;
	height: min(400px,30vw);
}

.map__link-list {
	margin-top: var(--gap-40);
	width: min(100%,920px);
	margin-inline: auto;
	display: flex;
    justify-content: center;
	text-align: center;
	font-size: min(2.0rem,2.0vw);
	font-weight: bold;
	letter-spacing: .1em;
	line-height: 1.3em;
}
.map__link-list li {
	width: 25%;
	border-left: solid 1px #cccccc;
}
.map__link-list li:first-child {
	border-left: none;
}
.map__link-list li.icon_tel {
	display: none;
}
.map__link-list a,
.map__link-list button {
	display: block;
	width: 100%;
}
.map__link-list span {
	display: block;
	height: 9.0em;
	padding-top: 3.8em;
	background-image: url("../images/access/icon_route.png");
	background-repeat: no-repeat;
	background-position: center top;
	background-size: auto 3.0em;
	position: relative;
}
.map__link-list .icon_map span {background-image: url("../images/access/icon_map.png");}
.map__link-list .icon_copy span {background-image: url("../images/access/icon_copy.png");}
.map__link-list .icon_tel span {background-image: url("../images/access/icon_tel.png");}
.map__link-list span::before {
	font-family: 'fontello';
	content: '\e801';
	font-size: 55%;
	color: #fff;
	font-weight: normal;
	letter-spacing: normal;
	width: 3.0em;
	line-height: 3.0em;
	border-radius: 50%;
	background: var(--color-base);
	position: absolute;
	margin: auto;
	left: 0;
	right: 0;
	bottom: 0;
	transition: all 0.4s;
}
.map__link-list a:hover span::before,
.map__link-list button:hover span::before {
	transform: scale(1.2,1.2);
	background: var(--color-gold);
}

.map__navi {
	text-align: center;
}
.map__navi h3 {
	display: inline-block;
	font-size: var(--fs-20);
	font-weight: bold;
	line-height: 1.4em;
	padding-left: 6.0em;
	position: relative;
	margin-bottom: 1.5em;
}
.map__navi h3::before {
	content: "";
	position: absolute;
	width: 4.0em;
	aspect-ratio: 1 / 1;
	background: url("../images/access/icon_navi.png") no-repeat center center;
	background-size: contain;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.map iframe {
	height: 80vw;
}

.map__link-list {
    flex-wrap: wrap;
	font-size: var(--fs-16);
	letter-spacing: .05em;
	row-gap: var(--gap-40);
}
.map__link-list li {
	width: 50%;
}
.map__link-list li:nth-child(odd) {
	border-left: none;
}
.map__link-list li.icon_tel {
	display: block;
}
.map__link-list span {
	height: auto;
	padding-top: 3.0em;
	padding-bottom: 2.2em;
	background-size: auto 2.5em;
}

.map__navi h3 {
	display: block;
	padding: 4.0em 0 0;
	margin-bottom: .5em;
}
.map__navi h3::before {
	width: 100%;
	height: 3.2em;
	aspect-ratio: auto;
	left: 0;
	top: 0;
	transform: none;
}
}



/*guide
-----------------------------------------------*/
.guide .p-toc__list {
	margin-inline: auto;
    justify-content: center;
	padding-top: var(--gap-40);
	padding-bottom: 0;
	border-bottom: none;
	row-gap: 3.0rem;
}

.guide__inner {
	width: min(100%,1000px);
	margin-inline: auto;
}

.guide__photo-ttl {
	text-align: center;
	font-size: var(--fs-24);
	font-weight: bold;
	line-height: 1.4em;
	background: #fff;
	padding: .5em 1.5em;
	border-radius: 100vmax;
	margin-bottom: var(--gap-40);
}
.guide__photo-list {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--gap-40) 9%;
}
.guide__photo-list div {
	position: relative;
}
.guide__photo-list div::before {
	content: "";
	position: absolute;
	width: 33%;
	height: 100%;
	left: 100%;
	top: 0;
	background: url("../images/access/icon_arrow1.png") no-repeat center center;
	background-size: 25% auto;
}
.guide__photo-list > li:nth-child(3n) div::before,
.guide__photo-list > li:last-child div::before {
	display: none;
}

.guide__parking-img {
	width: min(70%,680px);
	margin-inline: auto;
}
.guide__route-img {
	width: min(85%,810px);
	margin-inline: auto;
}

.guide__lead {
	font-size: var(--fs-18);
	font-weight: bold;
	line-height: 1.8em;
	margin-bottom: 1.0em;
}

.guide__route-list li {
	background: #fff;
	line-height: 1.6em;
	padding: 1.0em 1.5em;
	padding-left: 5.0em;
	margin-bottom: 20px;
	position: relative;
}
.guide__route-list li:last-child {
	margin-bottom: 0;
}
.guide__route-list li::before {
	content: "01";
	font: var(--font-en);
	font-size: 180%;
	letter-spacing: .14em;
	line-height: 1.0em;
	position: absolute;
	left: 1.0em;
	top: .4em;
}
.guide__route-list li:nth-child(2)::before {content: "02";}
.guide__route-list li:nth-child(3)::before {content: "03";}
.guide__route-list li:nth-child(4)::before {content: "04";}
.guide__route-list li:nth-child(5)::before {content: "05";}
.guide__route-list li:nth-child(6)::before {content: "06";}
.guide__route-list li:nth-child(7)::before {content: "07";}
.guide__route-list li:nth-child(8)::before {content: "08";}
.guide__route-list li:nth-child(9)::before {content: "09";}
.guide__route-list li:nth-child(10)::before {content: "10";}

.guide__attention {
	width: min(100%,1044px);
	margin-inline: auto;
}
.guide__attention > p,
.guide__attention > div {
	width: min(100%,1000px);
	margin-inline: auto;
}
.guide__attention-ttl {
	text-align: center;
	font: var(--font-min);
	font-size: var(--fs-32);
	letter-spacing: normal;
	line-height: 1.4em;
	padding-top: 2.2em;
	background-image: url("../images/access/icon_car.png");
	background-repeat: no-repeat;
	background-position: center top;
	background-size: auto 1.6em;
	padding-bottom: 1.0em;
	border-bottom: solid 1px #ecebe7;
	margin-bottom: 1.0em;
}
.guide__attention-ttl.--icon-attention {background-image: url("../images/access/icon_attention.png") !important;}
.bullet .guide__attention-ttl {background-image: url("../images/access/icon_bullet.png");}
.bus .guide__attention-ttl {background-image: url("../images/access/icon_bus.png");}

/*島田市コミュニティバス*/
.bus .guide__attention p {
	margin-top: 1.5em;
}
.bus__links-box {
	width: min(100%,1100px);
	margin-inline: auto;
	border: solid 1px var(--color-gold);
	padding: var(--gap-50) 4%;
}
.bus__links-box .c-list-dotto {
	width: min(100%,800px);
	margin: 2.0em auto 1.5em;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
.guide .p-toc__list {
	row-gap: 2.0rem;
}

.guide__photo-list {
	column-gap: 5%;
}
.guide__photo-list div::before {
	width: 16%;
	background-size: 50% auto;
}

.guide__parking-img {
	width: 75%;
}
.guide__route-img {
	width: 90%;
}

.guide__lead {
	margin-bottom: .6em;
}

.guide__route-list li {
	margin-bottom: 10px;
}

/*島田市コミュニティバス*/
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.guide .p-toc__list {
	row-gap: 1.5rem;
}

.guide__photo-ttl {
	font-size: var(--fs-20);
}
.guide__photo-list {
	grid-template-columns: repeat(2, 1fr);
	column-gap: 8%;
}
.guide__photo-list div::before {
	width: 18%;
	background-size: 50% auto;
	display: block !important;
}
.guide__photo-list > li:nth-child(even) div::before,
.guide__photo-list > li:last-child div::before {
	display: none !important;
}

.guide__parking-img {
	width: 100%;
}
.guide__route-img {
	width: 100%;
}

.guide__lead {
	line-height: 1.6em;
	margin-bottom: .6em;
}

.guide__route-list li {
	padding: 1.0em 1.0em;
	padding-left: 3.5em;
	margin-bottom: .5em;
}
.guide__route-list li::before {
	font-size: 150%;
	letter-spacing: .05em;
	left: .5em;
	top: .7em;
}

.guide__attention-ttl {
	font-size: var(--fs-28);
	padding-top: 2.0em;
	padding-bottom: .8em;
	margin-bottom: .8em;
}

.guide .c-link-list .c-link-btn a {
	display: flex;
	padding-left: .5em;
	padding-right: 2.0em;
}
.guide .c-link-list .c-link-btn a::before,
.guide .c-link-list .c-link-btn a::after {
	right: .2em;
}

/*島田市コミュニティバス*/
.bus .guide__attention p {
	margin-top: 1.0em;
}
.bus__links-box {
	padding: var(--gap-50) 6%;
}
.bus__links-box .c-list-dotto {
	margin: 1.0em auto 1.0em;
}
}



/*foryou
-----------------------------------------------*/
.foryou__bg {
	background-color: #58839f;
	background-image: url("../images/access/bg_ope.png");
	background-repeat: no-repeat;
	background-position: left top;
	background-size: 1130px auto;
	padding-top: var(--gap-100);
	padding-bottom: var(--gap-120);
	color: #fff;
}

.foryou__heading {
	text-align: center;
	margin-bottom: var(--gap-40);
}
.foryou__heading .u-ft-min {
	font-size: var(--fs-40);
	line-height: 1.4em;
	padding-top: 2.8em;
	background-image: url("../images/access/icon_ope.png");
	background-repeat: no-repeat;
	background-position: center top;
	background-size: auto 2.0em;
}
.foryou__heading .u-fw-bold {
	font-size: var(--fs-18);
	line-height: 1.6em;
}
.foryou__heading .u-ft-min + .u-fw-bold {
	margin-top: 1.5em;
}

.foryou .c-ttl__m {
	color: #fff !important;
}

/*ope*/
.ope__inner {
	width: min(100%,1048px);
	margin-inline: auto;
}
.ope__list {
	display: flex;
    justify-content: center;
    flex-wrap: wrap;
	gap: 20px 4%;
	text-align: center;
	color: var(--color-base);
	font-size: var(--fs-18);
	font-weight: bold;
	line-height: 1.4em;
}
.ope__list li {
	width: 48%;
	background: #fff;
	padding: 1.2em 1.5em;
	border-radius: .4em;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.ope__layout {
	display: flex;
    justify-content: space-between;
    align-items: center;
}
.ope__layout-img {
	width: min(35%,362px);
}
.ope__layout-txt {
	width: 61%;
}

/*farway*/
.farway .foryou__bg {
	background-color: #b08e48;
	background-image: url("../images/access/bg_farway.png");
}
.farway .foryou__heading .u-ft-min {
	background-image: url("../images/access/icon_farway.png");
}
.farway__point {
	width: min(100%,1160px);
	margin-inline: auto;
	background: rgba(138,103,50,0.7);
	padding: var(--gap-40) 4%;
}
.farway__point .c-list-dotto {
	width: min(100%,980px);
	margin-inline: auto;
}
.farway__stay-inner {
	width: min(100%,1000px);
	margin-inline: auto;
}
.farway__stay-lead {
	font-weight: bold;
	line-height: 1.8em;
	margin-bottom: 1.5em;
}
.farway__stay .c-list-dotto > li:nth-child(3) {
	break-before: column;
}
.farway__stay .c-list-dotto > li::before {
	background: rgba(255,255,255,0.4);
}
.farway__stay-style {
	display: grid;
	grid-template-columns: max-content 1fr;
}
.farway__stay-style dt::after {
	content: "";
	display: inline-block;
	vertical-align: middle;
	width: 1px;
	height: 1.0em;
	background: currentcolor;
	margin: 0 1.0em;
	transform: translateY(-.1em);
}
.farway__stay-style dd {
	font-weight: normal;
}

/*accessible*/
.accessible .foryou__bg {
	background-color: #788e48;
	background-image: none;
}
.accessible .foryou__heading .u-ft-min {
	background-image: url("../images/access/icon_accessible.png");
}
.accessible__list {
	width: min(100%,1218px);
	margin-inline: auto;
	display: flex;
    justify-content: center;
    flex-wrap: wrap;
	text-align: left;
	font-size: var(--fs-24);
	font-weight: bold;
	line-height: 1.4em;
	gap: var(--gap-50) 5.9%;
}
.accessible__list li {
	width: 29.4%;
}
.accessible__list p {
	margin-top: .8em;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
.foryou__bg {
	background-size: 100% auto;
}

/*ope*/
.ope__list {
	gap: 2vw 2%;
}
.ope__list li {
	width: 49%;
}

/*farway*/
.farway__stay .c-list-dotto {
	column-count: 1;
}
.farway__stay-style {
	grid-template-columns: 200px 1fr;
}
.farway__stay-style dt {
	position: relative;
}
.farway__stay-style dt::after {
	position: absolute;
	display: block;
	right: 1.0em;
	top: .2em;
	margin: 0;
	transform: none;
	opacity: 0.5;
}

/*accessible*/
.accessible__list {
	column-gap: 2%;
}
.accessible__list li {
	width: 32%;
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.foryou__bg {
	background-size: 120% auto;
}

.foryou__heading .u-ft-min {
	padding-top: 2.5em;
}
.foryou__heading .u-ft-min + .u-fw-bold {
	margin-top: 1.0em;
}

/*ope*/
.ope__list {
	gap: 2vw 2%;
	font-size: var(--fs-16);
}
.ope__list li {
	width: 49%;
	padding: 1.0em 0;
}
.ope__layout {
	display: block;
}
.ope__layout-img {
	width: 60%;
	margin: 0 auto 2.0rem;
}
.ope__layout-txt {
	width: 100%;
}

/*farway*/
.farway__point {
	padding: var(--gap-40) 6%;
}
.farway__stay-lead {
	line-height: 1.6em;
	margin-bottom: 1.0em;
}
.farway__stay .c-list-dotto {
	column-count: 1;
}
.farway__stay .c-list-dotto > li {
	margin-bottom: .8em;
}
.farway__stay .c-list-dotto > li:last-child {
	margin-bottom: 0;
}
.farway__stay-style {
	display: block;
}
.farway__stay-style dt::after {
	display: none;
}

.farway .c-link-list .c-link-btn a {
	display: flex;
	padding-left: .5em;
	padding-right: 2.0em;
}
.farway .c-link-list .c-link-btn a::before,
.farway .c-link-list .c-link-btn a::after {
	right: .2em;
}

/*accessible*/
.accessible__list {
	display: block;
	text-align: center;
}
.accessible__list li {
	width: 100%;
	margin-bottom: var(--gap-40);
}
.accessible__list li:last-child {
	margin-bottom: 0;
}
.accessible__list div {
	width: 80%;
	margin-inline: auto;
}
.accessible__list p {
	margin-top: .5em;
}
}



/*first
-----------------------------------------------*/
.first h2 {
	width: min(100%,1044px);
	margin-inline: auto;
	font-size: var(--fs-32);
	letter-spacing: normal;
	line-height: 1.4em;
	padding-top: 2.2em;
	background: url("../images/access/icon_first.png") no-repeat center top;
	background-size: auto 1.3em;
	text-align: center;
	padding-bottom: 1.0em;
	border-bottom: solid 1px var(--color-border);
	margin-bottom: 1.0em;
}
.first__items {
	width: min(100%,1000px);
	margin: var(--gap-40) auto;
}
.first__items > dt {
	text-align: center;
	font-size: var(--fs-24);
	font-weight: bold;
	line-height: 1.4em;
	padding: .5em 1.5em;
	background: #f0f0f0;
	border-radius: 100vmax;
	margin-bottom: 1.5em;
}
.first__items > dd {
	width: 88%;
	margin-inline: auto;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.first h2 {
	padding-top: 1.8em;
	padding-bottom: .8em;
	margin-bottom: .8em;
}
.first__items > dt {
	font-size: var(--fs-20);
	margin-bottom: 1.0em;
}
}



/*contact
-----------------------------------------------*/
.contact__layout {
	width: min(100%,916px);
	margin: var(--gap-60) auto;
	display: flex;
    justify-content: space-between;
}
.contact__layout > div {
	width: min(48%,416px);
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
.contact .c-tel {
	font-size: var(--fs-44);
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.contact__layout {
	display: block;
}
.contact__layout > div {
	width: 100%;
	margin-bottom: var(--gap-60);
}
.contact__layout > div:last-child {
	margin-bottom: 0;
}
}



/*
-----------------------------------------------*/

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
}