@charset "utf-8";

.main_wrap {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}

.main_img {
	width: -webkit-calc(100% - 100px);
	width: calc(100% - 100px);
}

.sc_box {
	width: 100px;
}

.scroll_txt {
	position: absolute;
	top: -webkit-calc(100vh - 350px);
	top: calc(100vh - 350px);
	right: 39px;
	writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	width: 20px;
	height: 80px;
	-webkit-animation: scroll-text 3.5s cubic-bezier(.455, .03, .515, .955) infinite;
	animation: scroll-text 3.5s cubic-bezier(.455, .03, .515, .955) infinite;
	color:#5a3a5a;
}

.scroll_bar_clip {
	position: absolute;
	overflow: hidden;
	width: 1px;
	height: 255px;
	top: -webkit-calc(100vh - 255px);
	top: calc(100vh - 255px);
	right: 50px;
	background-color: #ccc;
}

.pindex_scroll_bar {
	position: absolute;
	width: 1px;
	height: 255px;
	top: -255px;
	right: 0;
	background-color:#5a3a5a;
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	-webkit-animation: scroll-bar 3.5s cubic-bezier(.455, .03, .515, .955) infinite;
	animation: scroll-bar 3.5s cubic-bezier(.455, .03, .515, .955) infinite;
}

@keyframes scroll-text {
	0% {
		-webkit-transform: translateY(0);
		transform: translateY(0)
	}

	40%, 50% {
		-webkit-transform: translateY(10px);
		transform: translateY(10px)
	}

	100% {
		-webkit-transform: translateY(0);
		transform: translateY(0)
	}
}

@-webkit-keyframes scroll-bar {
	0%, 5% {
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0)
	}

	100% {
		-webkit-transform: translate3d(0, 510px, 0);
		transform: translate3d(0, 510px, 0)
	}
}

@keyframes scroll-bar {
	0%, 5% {
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0)
	}

	100% {
		-webkit-transform: translate3d(0, 510px, 0);
		transform: translate3d(0, 510px, 0)
	}
}

.c01 {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}

.c01 .ani_img {
	width: 50%;
}

.a_cap {
	width: 80%;
    margin: auto;
	margin-top: 30px;
	letter-spacing: 0;
	font-size: 1.1rem;
}

.c02 {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}

.c02 div {
	width: 48.5%;
}

.c02 div .titl {
	margin-bottom: 20px;
	font-size: 1.6rem;
	font-weight: bold;
}

.c03 {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}

.c03 .box01 {
	width: 48.5%;
}

.c03 .box01 .box02 {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}

.c03 .box01 .sub_titl_p {
    margin: 10px 0;
    font-weight: bold;
    font-size: 1.4em;
}

.c03 .box01 .box02 .deco {
	width: 5px;
	margin-right: 10px;
	background-color:#5a3a5a;
}

.c03 .box01 .box02 .titl {
	font-size: 1.6rem;
	font-weight: bold;
}

.c03 .box01 .box02 .titl span {
	font-size: 2.2rem;
}

.c03 .box01 .txt {
	margin: 20px auto 30px auto;
}

.c03 .box01 .cap {
	margin-bottom: 160px;
	font-size: 1.0rem;
}

.taxi_titl {
	text-align: center;
	margin-bottom: 30px;
	font-size: 1.6rem;
	font-weight: bold;
}
.rosen{
	display: block;
	margin: auto;
	width: 100%;
}
.mr60{
	margin-right: 60px;
}
.train{
	width: 80%;
	margin:auto;
	}
.access_list{
	margin: auto;
	font-size: 2.1rem;
	font-weight: bold;
	display: flex;
	justify-content: center;
	align-items: baseline;
	gap: 16px;
}
.haneda{
	font-size: 1.5rem;
}
.access_list small{
	font-size: 1rem;
	display: block;
}
.access_list dl{
	display: flex;
	flex-wrap: wrap;
	widows: 100%
}
.access_list dt{
	width: 70%;
	padding-right: 10px;
	margin-bottom: 20px;
}
.access_list dd{
	width: 30%;
	margin-bottom: 20px;
	text-align: right;
}
.access_list img{
	width: 2.1rem;
	padding-right: 5px;
}
.access_list p{
	color:#2a4e92;
	padding-bottom:5px;
	margin-bottom: 20px;
	border-bottom: #2a4e92 solid 2px;
}
.access_list .shinyoko{
	color:#8b5080;
	padding-bottom:5px;
	margin-bottom: 20px;
	border-bottom: #8b5080 solid 2px;
}
.access_list_inner{
	width: 50%;
}

@media screen and (max-width:1200px) {
    .c03 .box01 .cap {
		margin-bottom: 20px;
	}
}

@media screen and (max-width:850px) {
	.access_list{
	width: 90%;
	display: block;
	margin: auto;
}
	.access_list_inner{
	width: 100%;
	margin-bottom: 30px;
}
}

@media screen and (max-width:767px) {
	.main_img {
		width: -webkit-calc(100% - 30px);
		width: calc(100% - 30px);
	}

	.sc_box {
		width: 30px;
	}

	.scroll_txt {
		top: -webkit-calc(100vh - 320px);
		top: calc(100vh - 320px);
		right: 5px;
	}

	.scroll_bar_clip {
		right: 15px;
	}

	.c01 .ani_img {
		width: 100%;
		margin-bottom: 20px;
	}

	.a_cap {
		width: 100%;
		font-size: 1.0rem;
	}

	.c02 div {
		width: 100%;
		margin-bottom: 20px;
	}

	.c02 div .titl {
		font-size: 1.4rem;
	}
    
    .c03 .box01 {
		width: 100%;
	}

	.c03 .box01 .box02 .titl {
		font-size: 1.4rem;
	}

	.c03 .box01 .box02 .titl span {
		font-size: 1.8rem;
	}

	.taxi_titl {
		font-size: 1.4rem;
	}
	.rosen{
		width: 100%;
	}
	.mr60{
		margin: 0 0 60px;
	}
	.train{
		width: 90%;
	}
	.access_list{
		font-size: 1.8rem;
	}

}