@charset "utf-8";
.notes {
	font-size: 1rem;
	letter-spacing: 0.1em;
	line-height: 1.5;
	max-width: 970px;
	margin: auto;
	color: #505050;
}
.info_image { position: relative;}
.info_wrapper {
	position: absolute;
	top: 15px;
	color: #fff;
	width: auto;
	right: 20px;
	margin: auto;
}
.info_place {
	font-size: clamp(1.4rem, 1.4286vw, 2.4rem);
	letter-spacing: 0;
	line-height: 1.3;
	margin-bottom: 15px;
}
.info_time {
	font-size: clamp(3.4rem, 3.4524vw, 5.8rem);
	letter-spacing: 0;
	line-height: 0.9;
	text-align: right;
}
.info_time .md { font-size: 50%;}
.info_time .sm { font-size: 45%;}
.info_time .sm .md { font-size: 10px;}
.info_estimate, .info_estimate small, .info_name { letter-spacing: 0.05em;}
.info_name { font-size: clamp(1.5rem, 1.4286vw, 2.4rem);}
.info_name .sm { font-size: 75%;}
.info_estimate { font-size: clamp(2.3rem, 2.0238vw, 3.4rem); line-height: 1.2; }
.info_estimate .lg { font-size: 59%;}
.info_estimate .md { font-size: 47%; display: inline-block; }
.info_text {
	font-size: clamp(1rem, 0.7143vw, 1.2rem);
	letter-spacing: 0.01em;
	line-height: 1.5;
	margin-top: 5px;
}
@media only screen and (max-width: 767px) {
    .info_wrapper { left: 20px; right: auto; }
    .info_estimate,
    .info_estimate small,
    .info_name { letter-spacing: 0.01em;}
}
.is_on .line_area .line_x { animation: lineX 2s cubic-bezier(0.16, 1, 0.3, 1) 0s forwards;}
.is_on .line_area .line_y { animation: lineY 2s cubic-bezier(0.16, 1, 0.3, 1) 0.5s forwards;}
.note_block { padding: clamp(60px, 4.7619vw, 80px) 0; background-color: #fff;}

/* sec_train */
.sec_train { overflow: hidden;}
.train_img {
	max-width: 1030px;
	margin: 0 auto clamp(40px, 4.7619vw, 80px);
}
.train_info {
	display: grid;
	grid-template-columns: 1fr 38.5%;
	gap: 20px;
}
.train_info .info_detail li {
	display: grid;
	grid-template-columns: clamp(115px, 10.7143vw, 180px) 1fr;
}
.train_info .info_detail li + li { margin-top: clamp(10px, 1.1905vw, 20px);}
.train_info .info_detail .info_name { position: relative;}
.train_info .info_detail .info_name::after {
	content: "";
	width: 1px;
	height: 105%;
	transform: rotate(30deg);
	position: absolute;
	right: clamp(20px, 2.0833vw, 35px);
	background-color: #4d4d4d;
	top: 3px;
}
.train_list {
	position: relative;
	overflow: hidden;
}
.train_list::before { 
	content: "";
	background-color: #fff;
	width: 100%;
	height: 100%;
	top: 0;
	bottom: 0;
	position: absolute;
}
.train_list .line_area {
	max-width: 1030px;
	margin: 0 auto 0;
	padding: 0 clamp(15px, 3.869vw, 65px) 0;
}
.train_list .train_info .info_detail .info_name::after {
    height: 105%;
	top: 3px;
	right: clamp(26px, 2.2024vw, 37px);
	transform: rotate(27deg);
}
.train_list .train_info .info_detail li { grid-template-columns: clamp(130px, 11.9048vw, 200px) auto;}
.train_list .train_info .info_detail li + li { margin-top: clamp(10px, 3.5714vw, 60px);}
.train_list .line_area .info_wrapper { text-shadow: 0px 0px 10px rgba(0, 0, 0, 1);}
.train_list .line_area.reverse .info_wrapper { left: 20px; right: auto; }
.train_list .train_info {
	grid-template-columns: 37.2% 1fr;
	gap: clamp(30px, 3.5714vw, 60px);
	align-items: center;
	position: relative;
}
.train_list .line_area.reverse .head_box .ttl .en.sm { margin-right: 0; }
.train_list .line_area .head_box .ttl .group {  margin-left: calc(-1*clamp(10px, 3.5714vw, 60px));}
.train_list .line_area.reverse .head_box .ttl .group { margin-right: calc(-1*clamp(10px, 3.5714vw, 60px)); margin-left: auto; }
.train_list .item {
    position: relative;
    height: 100vh;
    width: 100%;
    z-index: 0;
}
.train_list .item .item_wrap {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    opacity: 0;
    visibility: hidden;
    transition: all 0.5s ease-in-out;
    z-index: 0;
}
.train_list .item:nth-child(1) .item_wrap { opacity: 1; visibility: visible; }
.train_list.is_start .item .item_wrap { position: fixed; }
.train_list .item.is_on .item_wrap { opacity: 1; visibility: visible; }
.train_list .item.is_out .item_wrap { opacity: 0; visibility: hidden; }
.train_list.is_end .item .item_wrap { position: absolute; top: auto; bottom: 0; }
.train_list .item:last-child { height: 130vh;}
.train_list .line_area.icon_water  .head_box .ttl::before { right: calc(-1 * (clamp(15px, 3.869vw, 65px) + 578px)); }
.train_list .line_area.reverse.icon_water .head_box .ttl::before { left: calc(-1 * (clamp(15px, 3.869vw, 65px) + 578px)); }
.bullet_block.bg_block { padding-bottom: clamp(60px, 5.9524vw, 100px);}
.bullet_block::before {
	content: "";
	background: url(../imgs/bullet_map.svg) no-repeat top center/contain;
	max-width: 765px;
	width: 45.5%;
	position: absolute;
	right: 0;
	height: 100%;
}
.bullet_block .train_info { margin-top: clamp(20px, 5.9524vw, 100px); }
.bullet_block .train_info .head_box { padding-top: 0; margin-top: calc(-1*clamp(0px, 0.5952vw, 10px)); }
@media only screen and (min-width: 768px) {
	.bullet_block .train_info .info_image {order: 1;}
	.bullet_block .train_info .info_detail { order: 0;}
}
@media only screen and (max-width: 1600px) {
	.train_list .head_box { padding-top: 50px;}
	.train_list .train_info { grid-template-columns: 30% 1fr;}
}
@media only screen and (max-width: 1145px) {
	.train_list .line_area.reverse .line_x {
		width: calc(100% + 30px + 10%);
		left: calc(-1 * (30px + 10%));
	}
	.train_list .line_area .line_x { width: calc(100% + clamp(15px, 3.869vw, 65px) + 5vw);}
	.train_list .line_area.reverse .line_x {
		width: calc(100% + clamp(15px, 3.869vw, 65px) + 5vw);
		left: calc(-1*(clamp(15px, 3.869vw, 65px) + 5vw));;
	}
}
@media only screen and (max-width: 1000px) {
	.train_list::before,
    .train_list .item .item_wrap { top: 80px; }
}
@media only screen and (max-width: 767px) {
	.train_list .head_box { 
        padding-top: 40px;
        margin-bottom: 10px;
    }
	.train_list .train_info {
		gap: 0;
		display: block;
	}
	.train_info { grid-template-columns: 1fr !important;}
	.train_list .line_area .info_detail {
		background-color: #fff;
		margin-left: -15px;
		padding: 20px 15px;
		width: 100vw;
        overflow: hidden;
        z-index: 2;
	}
	.train_list .line_area.reverse .info_detail {
		margin-left: -90px;
		margin-right: 0;
	}
	.train_list .item:last-child .line_area { padding-bottom: 0;}
    .train_list .line_area .head_box .ttl .group { margin: 0!important;}
	.train_list::before,
    .train_list .item .item_wrap { top: 55px; }
    .train_list .train_info .info_detail li + li { margin-top: 5px;}
	.bullet_block::before { width: 100%;}
	.bullet_block .head_box { padding-top: 20px;}
	.bullet_block .head_box .ttl { margin-bottom: 32%;}
    .bullet_block .info_image { width: 73%;}
}

/* sec_car */
.sec_car .note_block { background-color: #d1d8dc;}
.sec_car .bg_block { padding: clamp(60px, 9.2262vw, 155px) 0 clamp(60px, 4.7619vw, 80px);}
.sec_car .note_block .notes { color: #3e3a39;}
.sec_car .headline { margin-bottom: clamp(30px, 2.0833vw, 35px);}
.car_img { max-width: 430px; margin: auto;}
.ani_line {
	position: relative;
	height: clamp(15px, 1.7857vw, 30px);
	width: 1px;
	overflow: hidden;
	left: 50%;
	margin-left: -1px;
	display: block;
}
.ani_line .line_move {
	animation: line_move 2s both cubic-bezier(0.15, 0.31, 0.24, 0.88) infinite;
	background: #fff;
	position: absolute;
	width: 100%;
	height: 100%;
	bottom: 0;
	left: 0;
	text-indent: -999px;
}
@keyframes line_move {
	0% {
		height: 0;
		bottom: 100%;
	}
	50% {
		height: 100%;
		bottom: 0;
	}
	100% {
		height: 100%;
		bottom: -100%;
	}
}
.car_list { 
	display: grid;grid-template-columns: repeat(4, 1fr);
	color: #fff;
}
.car_list li { position: relative;}
.car_list .cont {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 100%;
	text-align: center;
}
.car_list .ttl {
	font-size: clamp(1.6rem, 1.4286vw, 2.4rem);
	letter-spacing: 0.045em;
	line-height: 1.35;
	margin-bottom: clamp(5px, 0.5952vw, 10px);
}
.car_list .info_name {margin-top: clamp(5px, 1.1905vw, 20px);}
.car_list .info_estimate .sm { font-size: 40%;}
@media only screen and (min-width: 768px) {
	.car_list .info_name { font-size: clamp(1.5rem, 1.1905vw, 2rem);}
	.car_list .info_name .sm { font-size: 70%;}
	.car_list .info_estimate {font-size: clamp(2.3rem, 2.2619vw, 3.8rem);;line-height: 1;}
	.car_list .info_estimate .md { font-size: 43%;}
}
@media only screen and (max-width: 767px) {
	.car_list { grid-template-columns: repeat(2, 1fr);}
	.car_list .info_estimate .sm { font-size: 47%;}
}

/* sec_airport */
.sec_airport .bg_block { 
	padding: clamp(60px, 7.7381vw, 130px) 0 clamp(60px, 5.9524vw, 100px);
	color: #fff;
}
.sec_airport .notes { color: #fff;}
.airport_img {max-width: 525px;margin: 0 auto clamp(40px, 5.0595vw, 85px);}

/* */
.ttl2{
    margin-top: 100px;
    padding-bottom: 70px;
    text-align: center;
    font-size: clamp(1.6rem, 1.6857vw, 23px);
    position: relative;
}
.ttl2 p span{font-size: 80%;}
.ttl2:after{
    position: absolute;
    content: "";
    width: 1px;
    height: 30px;
    background: #3e3a39;
    left: 50%;
    bottom: 30px;
    transform: translateX(-50%);
}
@media screen and (max-width: 767px) {       
    .ttl2 {
        margin-top: 60px;
        padding-bottom: 50px;
    }
    .ttl2:after{                     
        position: absolute;
        content: "";
        width: 1px;
        height: 20px;
        background: #3e3a39;
        left: 50%;
        bottom: 20px;
        transform: translateX(-50%);
    }
}