@charset "utf-8";
/*
 detail.css
*/
/* -----------------------------------------------
= breadcrumbs
----------------------------------------------- */
@media print, screen and (min-width: 751px) {/* PC */
.breadcrumbs {
	display: flex;
	justify-content: space-between;
	position: fixed;
	top: 44px;
	left: 0;
	z-index: 6;
	width: 100%;
	line-height: 27px;
}
.tokyo .breadcrumbs {
	background: #d596fd;
}
.tama .breadcrumbs {
	background: #c8fd55;
}
.island .breadcrumbs {
	background: #38fffd;
}
.breadcrumbs ul {
	display: flex;
	padding: 0 20px;
}
.breadcrumbs li {
	font-size: 14px;
}
.breadcrumbs li + li {
	margin-left: 5px;
}
.breadcrumbs li + li::before {
	content: '＞';
	margin-right: 5px;
}
.breadcrumbs li a:hover {
	text-decoration: underline;
}
.breadcrumbs .area {
	padding: 0 20px;
	font-family: bebas-neue-pro-semiexpanded, sans-serif;
	font-size: 24px;
	font-weight: 700;
}
}/* @media */
/* -----------------------------------------------
= fv
----------------------------------------------- */
.fv .course_main .img_slide {
	padding-bottom: 0;
}
.fv .course_main .img_slide img {
	height: min(480px, calc(480 / 750 * 100vw));
}
@media print, screen and (min-width: 751px) {/* PC */
.fv {
	margin-top: 70px;
}
.fv .logo_excitetokyo {
	top: 15px;
}
}/* @media */
/* -----------------------------------------------
= course_main
----------------------------------------------- */
.course_main {
	background: #f3f5f6;
}
.course_main .movie {
	display: block;
	position: relative;
	transition: opacity .3s;
}
.course_main .movie:hover {
	opacity: .8;
}
.course_main .movie::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: min(64px, calc(64 / 750 * 100vw));
	height: min(64px, calc(64 / 750 * 100vw));
	transform: translate(-50%,-50%);
}
.tokyo .course_main .movie::after {
	background: url(../images/shared/tokyo_slide_arrow.png) no-repeat 50% / 100% auto;
}
.tama .course_main .movie::after {
	background: url(../images/shared/tama_slide_arrow.png) no-repeat 50% / 100% auto;
}
.island .course_main .movie::after {
	background: url(../images/shared/island_slide_arrow.png) no-repeat 50% / 100% auto;
}
.fv .course_main .set {
	top: min(260px, calc(260 / 750 * 100vw));
}
.course_main .img_caption {
	display: block;
	position: absolute;
	top: min(230px, calc(230 / 750 * 100vw));
	right: min(20px, calc(20 / 750 * 100vw));
	z-index: 1;
}
/* -----------------------------------------------
= detail
----------------------------------------------- */
.detail {
	padding: 70px 10px 60px;
	background: #f3f5f6;
}
.detail .inner {
	max-width: 580px;
	margin: 0 auto;
}
.detail .title {
	margin-bottom: 30px;
	font-family: nitalago-ruika, sans-serif;
	font-weight: 100;
	font-size: 2.2rem;
	line-height: 3.2rem;
	text-align: center;
}
.detail .text {
	padding: 0 10px;
	font-size: 1.4rem;
	line-height: 2.3rem;
}
/* -----------------------------------------------
= spot
----------------------------------------------- */
.spot {
	padding: 0 0 60px;
	background: #f3f5f6;
}
.spot .title {
	margin-bottom: 3rem;
	font-family: nitalago-ruika, sans-serif;
	font-weight: 100;
	font-size: 2.2rem;
	line-height: 3.2rem;
	text-align: center;
}
.spot_slide_wrap {
	overflow: hidden;
}
.spot_slide {
	margin: 0 0 60px;
}
.spot_slide .slick-list {
	overflow: visible;
	padding: 0;
}
.spot_slide > div {
	margin-bottom: 20px;
}
.spot_slide a {
	display: block;
}
.spot_slide .slick-arrow {
	top: calc(124 / 750 * 100vw);
	z-index: 1;
	width: calc(64 / 750 * 100vw);
	height: calc(64 / 750 * 100vw);
	transform: translate(0);
}
.spot_slide .slick-arrow::before {
	display: block;
	content: '';
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #fff;
	border-radius: 50%;
	opacity: 0;
	transition: opacity .3s;
}
.spot_slide .slick-arrow:hover::before {
	opacity: .3;
}
.tokyo .spot_slide .slick-arrow {
	background: url(../images/shared/tokyo_slide_arrow.png) no-repeat 50% / cover;
}
.tama .spot_slide .slick-arrow {
	background: url(../images/shared/tama_slide_arrow.png) no-repeat 50% / cover;
}
.island .spot_slide .slick-arrow {
	background: url(../images/shared/island_slide_arrow.png) no-repeat 50% / cover;
}
.spot_slide .slick-prev {
	left: calc(20 / 750 * 100vw);
	transform: rotate(180deg);
}
.spot_slide .slick-next {
	right: calc(20 / 750 * 100vw);
}
.spot_slide .slick-slide {
	width: calc(580 / 750 * 100vw);
	margin: 0 calc(15 / 750 * 100vw);
}
.spot_slide .slick-arrow {
	top: calc(124 / 750 * 100vw);
}
.spot_slide img {
	border-radius: 10px;
}
.spot_slide a img {
	transition: opacity .3s;
}
.spot_slide a:hover img {
	opacity: .7;
}
.spot_slide p {
	margin: calc(30 / 750 * 100vw) 0 0;
	font-family: nitalago-ruika, sans-serif;
	font-weight: 100;
	font-size: 1.6rem;
	text-align: center;
}
.spot_slide p.caption {
	width: 100%;
	overflow: hidden;
	display: -webkit-box;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	max-height: 13px;
	margin: calc(3 / 750 * 100vw) 0 calc(-15 / 750 * 100vw);
	font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", san-serif;
	font-size: 10px;
	line-height: 1.3;
	text-align: right;
}
@media print, screen and (min-width: 751px) {/* PC */
.spot_slide_wrap {
	max-width: 1000px;
	margin: 0 auto;
}
.spot_slide .slick-arrow {
	top: 124px;
	width: 64px;
	height: 64px;
}
.spot_slide .slick-prev {
	left: auto;
}
.spot_slide .slick-next {
	right: auto;
}
.spot_slide .slick-prev {
	right: calc(50% + 294px);
}
.spot_slide .slick-next {
	left: calc(50% + 294px);
}
.spot_slide .slick-slide {
	width: 580px;
	margin: 0 15px;
}
.spot_slide .slick-arrow {
	top: 124px;
}
.spot_slide p {
	margin: 30px 0 0;
}
.spot_slide p.caption {
	margin: 3px 0 -15px;
}
}/* @media */
/* -----------------------------------------------
= area_info
----------------------------------------------- */
.area_info {
	margin-top: -60px;
}
.area_info .spot_slide {
	margin-bottom: 0;
}
.area_info .spot_slide {
	padding: 0 calc(40 / 750 * 100vw);
}
.area_info .spot_slide .slick-slide {
	margin: 0 min(20px, calc(20 / 750 * 100vw));
}
.area_info .spot_slide img {
	border-radius: 10px 10px 0 0;
}
.area_info .spot_slide .set {
	padding: 1px calc(20 / 750 * 100vw) calc(20 / 750 * 100vw);
	background: #fff;
	border-radius: 0 0 10px 10px;
}
.area_info .spot_slide h4 {
	margin: calc(40 / 750 * 100vw) 0 calc(20 / 750 * 100vw);
	font-family: nitalago-ruika, sans-serif;
	font-weight: 700;
	font-size: 1.6rem;
	line-height: 2.4rem;
}
.area_info .spot_slide p {
	width: 100%;
	overflow: hidden;
	display: -webkit-box;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	max-height: 6.9rem;
	margin: 0;
	font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", san-serif;
	font-size: 1.4rem;
	line-height: 2.3rem;
	text-align: left;
}
.area_info .spot_slide p.caption {
	max-height: 13px;
	margin: calc(6 / 750 * 100vw) 0;
	font-size: 10px;
	line-height: 1.3;
	text-align: right;
}
.area_info .spot_slide p.caption + h4 {
	margin-top: 0;
}
.area_info .spot_slide .more {
	position: relative;
	margin-top: calc(20 / 750 * 100vw);
	padding-right: 20px;
	font-size: 2rem;
	font-family: bebas-neue-pro-semiexpanded, sans-serif;
	font-weight: 700;
	text-align: right;
}
.area_info .spot_slide .more::after {
	content: '';
	position: absolute;
	top: 3px;
	right: 0;
	width: 12px;
	height: 14px;
	background: #000;
	clip-path: polygon(0 0, 100% 50%, 0 100%);
	transition: right .3s;
}
.area_info .spot_slide a:hover .more::after {
	right: -2px;
}
@media print, screen and (min-width: 751px) {/* PC */
.area_info .spot_slide {
	padding: 0 190px;
}
.area_info .spot_slide .set {
	padding: 1px 20px 20px;
}
.area_info .spot_slide h4 {
	margin: 40px 0 20px;
}
}/* @media */
/* -----------------------------------------------
= spot_content
----------------------------------------------- */
.tokyo .spot_content .rental_title {
	background: #d596fd;
}
.tama .spot_content .rental_title {
	background: #c8fd55;
}
.island .spot_content .rental_title {
	background: #38fffd;
}
.tokyo .spot_content .spot_link a {
	color: #ae35fb;
}
.tama .spot_content .spot_link a {
	color: #7db502;
}
.island .spot_content .spot_link a {
	color: #02b5b3;
}

/* -----------------------------------------------
= google_map
----------------------------------------------- */
.google_map {
	position: relative;
	padding: 0 10px;
}
.google_map::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 230px;
	background: #f3f5f6;
}
.google_map .inner {
	position: relative;
	max-width: 1000px;
	margin: 0 auto;
}
.google_map .title {
	padding: 0 10px 10px;
	font-family: nitalago-ruika, sans-serif;
	font-weight: 100;
	font-size: 1.6rem;
	line-height: 2.2rem;
	text-align: center;
}
.google_map iframe {
	width: 100%;
	height: 400px;
}
.google_map .btn {
	position: absolute;
	right: 20px;
	bottom: 40px;
}
.google_map .btn a {
	display: inline-block;
	position: relative;
	padding: 10px 50px 10px 40px;
	background: #000;
	border-radius: 3em;
	font-size: 1.4rem;
	font-family: nitalago-ruika, sans-serif;
	font-weight: 100;
	transition: background .3s;
}
.google_map .btn a:hover {
	background: #333;
}
.tokyo .google_map .btn a {
	color: #d596fd;
}
.tama .google_map .btn a {
	color: #c8fd55;
}
.island .google_map .btn a {
	color: #38fffd;
}
.google_map .btn a::after {
	content: '';
	position: absolute;
	top: calc(50% - 7px);
	right: 10px;
	width: 12px;
	height: 14px;
	clip-path: polygon(0 0, 100% 50%, 0 100%);
	transition: right .3s;
}
.google_map .btn a:hover::after {
	right: 8px;
}
.tama .google_map .btn a::after {
	background: #c8fd55;
}
.island .google_map .btn a::after {
	background: #38fffd;
}
.tokyo .google_map .btn a::after {
	background: #d596fd;
}
@media print, screen and (min-width: 751px) {/* PC */
.google_map .btn {
	bottom: 30px;
}
#mymap {
	position: relative;
}
#mymap::before {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: calc(100% - 67px);
	background: rgba(0,0,0,.6);
	opacity: 0;
	transition: opacity .3s;
}
#mymap::after {
	content: '地図を操作するには、一度クリックしてください';
	display: grid;
	place-content: center;
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: calc(100% - 67px);
	color: #fff;
	font-family: nitalago-ruika, sans-serif;
	font-weight: 100;
	font-size: 2.2rem;
	opacity: 0;
	transition: opacity .3s;
}
#mymap:hover::before,
#mymap:hover::after {
	opacity: 1;
}
#mymap.is-active::before,
#mymap.is-active::after {
	display: none;
}
}/* @media */

/* -----------------------------------------------
= course_info
----------------------------------------------- */
.course_info {
	padding: 0 10px 60px;
}
.course_info .img {
	position: relative;
	top: -14px;
	z-index: 1;
	width: 154px;
	margin: 0 auto;
}
.course_info .link .link_title {
	margin: 0 0 30px;
	font-family: nitalago-ruika, sans-serif;
	font-weight: 700;
	font-size: 2.2rem;
	line-height: 3.2rem;
	text-align: center;
}
.course_info .data {
	display: flex;
	justify-content: center;
	margin: 0 0 30px;
	text-align: center;
}
.course_info .data p {
	margin: 0 20px;
	font-size: 1.6rem;
	font-family: bebas-neue-pro-semiexpanded, sans-serif;
	font-weight: 700;
	line-height: 2rem;
}
.course_info .data p span {
	display: block;
	font-size: 2.2rem;
}
.course_info .data p img {
	display: block;
	margin: 3px auto 0;
}
.course_info .link .btn {
	max-width: 520px;
	margin: 0 auto 35px;
	text-align: center;
}
.course_info .link .btn a {
	display: block;
	position: relative;
	padding: 25px 0;
	background: #000;
	border-radius: 3em;
	font-size: 2.4rem;
	font-family: nitalago-ruika, sans-serif;
	font-weight: 100;
	transition: background .3s;
}
.course_info .link .btn a:hover {
	background: #333;
}
.tokyo .course_info .link .btn a {
	color: #d596fd;
}
.tama .course_info .link .btn a {
	color: #c8fd55;
}
.island .course_info .link .btn a {
	color: #38fffd;
}
.course_info .link .btn a::after {
	content: '';
	position: absolute;
	top: calc(50% - 8.5px);
	right: 20px;
	width: 17px;
	height: 19px;
	clip-path: polygon(0 0, 100% 50%, 0 100%);
	transition: right .3s;
}
.course_info .link .btn a:hover::after {
	right: 18px;
}
.tokyo .course_info .link .btn a::after {
	background: #d596fd;
}
.tama .course_info .link .btn a::after {
	background: #c8fd55;
}
.island .course_info .link .btn a::after {
	background: #38fffd;
}
.course_info .link li {
	margin-bottom: 20px;
}
.course_info .link li .btn {
	display: block;
	position: relative;
	max-width: 340px;
	margin: 0 auto;
	padding: 10px 0;
	color: #000;
	border-radius: 3em;
	font-size: 1.4rem;
	font-family: nitalago-ruika, sans-serif;
	font-weight: 100;
	text-align: center;
	transition: opacity .3s;
}
.course_info .link li .btn:hover {
	opacity: .7;
}
.tokyo .course_info .link li .btn {
	background: #d596fd;
}
.tama .course_info .link li .btn {
	background: #c8fd55;
}
.island .course_info .link li .btn {
	background: #38fffd;
}
.course_info .link li .btn::after {
	content: '';
	position: absolute;
	top: calc(50% - 7px);
	right: 10px;
	width: 13px;
	height: 14px;
	background: #000;
	clip-path: polygon(0 0, 100% 50%, 0 100%);
	transition: right .3s;
}
.course_info .link li .btn:hover::after {
	right: 8px;
}
.course_info .map iframe {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	border-radius: 10px;
}

/* -----------------------------------------------
= recommend
----------------------------------------------- */
.recommend {
	padding: 60px 0 85px;
	background: #f3f5f6;
}
.recommend_title {
	margin-bottom: 55px;
	font-family: nitalago-ruika, sans-serif;
	font-weight: 100;
	font-size: 2.2rem;
	line-height: 3.2rem;
	text-align: center;
}
.recommend .course_detail {
	display: block;
	max-width: 1000px;
	margin: 0 auto;
	overflow: hidden;
}
.recommend .course_detail_slide {
	padding: 0 calc(40 / 750 * 100vw);
}
.recommend .course_detail_slide .slick-list {
	overflow: visible;
	padding: 0;
}
.recommend .course_detail_slide .slick-slide {
	margin: 0 min(20px, calc(20 / 750 * 100vw));
}
.recommend .area {
	font-family: bebas-neue-pro-semiexpanded, sans-serif;
	font-weight: 700;
	font-size: 1.6rem;
	line-height: 2.2rem;
	text-align: center;
}
.recommend .area.tokyo {
	background: #d596fd;
}
.recommend .area.tama {
	background: #c8fd55;
}
.recommend .area.island {
	background: #38fffd;
}
.recommend .course_detail .logo {
	float: none;
	display: grid;
	place-content: center;
	margin: 15px auto 0;
	padding: 0;
}
.recommend .course_detail .slick-arrow {
	top: min(195px, calc(195 / 750 * 100vw));
	z-index: 1;
	width: min(64px, calc(64 / 750 * 100vw));
	height: min(64px, calc(64 / 750 * 100vw));
	transform: translate(0);
}
.tokyo .recommend .course_detail .slick-arrow {
	background: url(../images/shared/tokyo_slide_arrow.png) no-repeat 50% / cover;
}
.tama .recommend .course_detail .slick-arrow {
	background: url(../images/shared/tama_slide_arrow.png) no-repeat 50% / cover;
}
.island .recommend .course_detail .slick-arrow {
	background: url(../images/shared/island_slide_arrow.png) no-repeat 50% / cover;
}
.recommend .course_detail .slick-arrow::before {
	display: block;
	content: '';
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #fff;
	border-radius: 50%;
	opacity: 0;
	transition: opacity .3s;
}
.recommend .course_detail .slick-arrow:hover::before {
	opacity: .3;
}
.recommend .course_detail .slick-prev {
	left: auto;
	right: calc(50% + calc(290 / 750 * 100vw));
	transform: rotate(180deg);
}
.recommend .course_detail .slick-next {
	right: auto;
	left: calc(50% + calc(290 / 750 * 100vw));
}
@media print, screen and (min-width: 751px) {/* PC */
.recommend .course_detail_slide {
	padding: 0 200px;
}
.recommend .course_detail .slick-prev {
	right: calc(50% + 290px);
}
.recommend .course_detail .slick-next {
	left: calc(50% + 290px);
}
}/* @media */
@media print, screen and (max-width: 1000px) and (min-width: 751px) {/* TABLET */
.recommend .course_detail_slide {
	padding: 0 calc(85 / 750 * 100vw);
}
}/* @media */

