@charset "UTF-8";

.layer_rich_main figure::after{background: linear-gradient(to right,rgba(22,58,156,0.8) 20%,transparent 50%);}

#contents{}
.train_item{display: grid;grid-template-columns: 24em 24em;justify-content: space-between;gap: 2em 0;grid-template-rows: max-content 1fr;}
.train_item > *{animation-name: fadeInUp;}
.train_item .rosen_map{grid-row: 1/3;grid-column: 2/3;}
.train_item .noriire{background: #a80028;color: #fff;font-size: 0.8em;padding: 0.2em 1.5em;display: inline-block;margin-bottom: 0.5em;}
.train_item_tit > small{font-size: 0.7em;display: block;margin-bottom: -1em;}
.train_item_tit > div{line-height: 1;}
.train_item_tit > div big{font-size: 1.4em;}
.train_item_tit > div span{font-size: 1.2em;}
.train_item_tit > div small{font-size: 0.9em;}
.train_item_tit > div strong{font-size: 2.5em;color: #690000;vertical-align: -0.05em;line-height: 1;}
.train_item_tit > div strong:nth-of-type(2){font-size: 1.8em;vertical-align: -0.03em;}
.train_item_tit + p{margin-top: 0.4em;font-size: 0.8em;}
.train_item_tit + p + figure{margin-top: 0.8em;}

.slide_wrap{background: #f7f7f7;padding: 2.5em 0;margin-top: 2.5em;animation-name: fadeInUp;}
.slide_img .slick-dots{bottom: -2em;}
.slide_img .slick-dots li{background: #a29da0;width: 2em;height: 0.4em;}
.slide_img .slick-dots li.slick-active{background: #4e4449;}
.slide_img .slick-dots li button{height: 100%;width: 100%;}
.slide_img .slick-dots li button::before{height: 100%;width: 100%;}

#ryokuchikoen{margin-top: 2.5em;}
.ryokuchikoen_tit{padding-bottom: 0.3em;}
.ryokuchikoen_tit span{font-size: 0.7em;animation-name: fadeIn;}
.ryokuchikoen_tit i{width: 100%;height: 1px;position: absolute;bottom: 0;left: 0;background: #000;animation-name: scale_x_l;animation-delay: 0.2s;}
.ryokuchikoen_item{display: flex;align-items: center;line-height: 1;animation-name: fadeInUp;margin-top: 1.5em;}
.ryokuchikoen_item .station{width: 11em;}
.ryokuchikoen_item .station > big{font-size: 1.4em;}
.ryokuchikoen_item .station > big span{width: 4em;display: inline-block;text-align-last: justify;}
.ryokuchikoen_item .station > span{font-size: 1.2em;}
.ryokuchikoen_item .time{width: 16.5em;}
.ryokuchikoen_item .time i{display: inline-block;font-size: 1.4em;padding: 0.2em 0;background: #690000;color: #fff;width: 30%;text-align: center;}
.ryokuchikoen_item .time span{font-size: 1.4em;text-align: right;width: 50%;letter-spacing: 0.1em;margin-left: 0.5em;}
.ryokuchikoen_item .time span strong{font-size: 1.3em;color: #690000;vertical-align: -0.05em;}
.ryokuchikoen_item .time small{font-size: 0.65em;}
.ryokuchikoen_item .comment{margin-left: 3em;}
.ryokuchikoen_item .comment::before{content: "";width: 0.6em;height: 1.7em;background: url("../img/arrow.svg") no-repeat center center/contain;display: block;position: absolute;top: 50%;transform: translateY(-50%);left: -1.7em;}
.ryokuchikoen_tit + .ryokuchikoen_item{margin-top: 1em;}

#etc_access{margin-top: 3.5em;}
.etc_access_item{display: flex;justify-content: space-between;}
.etc_access_item > li{width: 24em;animation-name: fadeInUp;}
.etc_access_tit{background: #7a86b2;padding: 0.2em;text-align: center;}
.etc_access_tit span{font-size: 1.2em;color: #fff;display: inline-block;letter-spacing: 0.1em;}
.airport .etc_access_tit span::before{content: "";width: 1.625em;height: 1.167em;background: url("../img/airport_i.svg") no-repeat center bottom/contain;display: inline-block;vertical-align: -0.25em;margin-right: 0.4em;}
.shinkansen .etc_access_tit span::before{content: "";width: 1.29em;height: 1.08em;background: url("../img/shinkansen_i.svg") no-repeat center bottom/contain;display: inline-block;vertical-align: -0.2em;margin-right: 0.5em;}
.etc_access_info{display: inline-block;margin-top: 0.7em;text-align: right;}
.etc_access_info dl{display: inline-flex;align-items: flex-end; text-align: left;}
.etc_access_info dl dt{font-size: 0.7em;line-height: 1.2;}
.etc_access_info dl dd big{font-size: 1.4em;}
.etc_access_info dl dd span{font-size: 1.2em;}
.etc_access_info dl dd strong{font-size: 1.8em;color: #690000;vertical-align: -0.05em;line-height: 1;}
.etc_access_lead{font-size: 0.8em;margin-top: 0.4em;}
.etc_access_lead + figure{margin-top: 0.8em;}


@media screen and (min-width: 769px) {
.train_item .rosen_map{animation-delay: 0.3s;}
.train_item > dt:nth-of-type(3){animation-delay: 0.3s;}
.etc_access_item > li:nth-of-type(2){animation-delay: 0.3s;}
}

@media screen and (max-width: 768px) {
.train_item{display: flex;flex-wrap: wrap;gap: 1.7em 0;}
.train_item_tit{font-size: 3.7vw;}

#ryokuchikoen{margin-top: 2.5em;}
.ryokuchikoen_item{flex-wrap: wrap;justify-content: center; margin-top: 1.5em;font-size: 3.7vw;}
.ryokuchikoen_item .comment{margin: 1.5em 0 0 0;}
.ryokuchikoen_item .comment::before{top: -1.7em;transform: rotate(90deg) translateY(0);left: 0;right: 0;margin-inline: auto;}
.ryokuchikoen_tit + .ryokuchikoen_item{margin-top: 0.7em;}
.ryokuchikoen_item .station{margin-bottom: 0.5em;}

#etc_access{margin-top: 2.5em;}
.etc_access_item{flex-wrap: wrap;gap: 2em 0;}
.etc_access_item > li{width: 100%;}
.etc_access_tit{font-size: 3.7vw;}
.etc_access_info{font-size: 3.7vw;}
}