@charset "utf-8";
.bg01 { background-color: rgba(109, 121, 120, .7);}
.circle_light {
    position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	pointer-events: none;
	transition-delay: 1.25s;
	transition-duration: 1.75s, 2.75s;
}
.notes {
    font-size: 1rem;
    letter-spacing: 0.1em;
}
.info_time {
    font-size: clamp(1.4rem, 1.0714vw, 1.8rem);
	letter-spacing: 0.06em;
    line-height: 1.2;
    align-items: center;
}
.info_time .lg { font-size: 189%;}
.info_time .md { font-size: 89%;}
.info_time .sm { font-size: 67%;}
.info_estimate,
.info_estimate small,
.info_name { letter-spacing: 0.1em;}
.info_name { 
    font-size: clamp(1.8rem, 1.4286vw, 2.4rem);
    line-height: 1.6;
}
.info_name .sm { font-size: 83%;}
.info_estimate {
    font-size: clamp(2.2rem, 2.0238vw, 3.4rem);
    line-height: 1.2;
    letter-spacing: 0.05em;
}
.info_estimate small { font-size: 48%;}
.info_estimate .md { font-size: 59%;}
.info_estimate .sm { 
    font-size: 47%;
    display: inline-block;
}
.info_text {
    font-size: clamp(1rem, 0.7143vw, 1.2rem);
    line-height: 1.5;
    margin-top: clamp(5px, 0.5952vw, 10px);
}
/* sec_city */
.sec_city {
    background-color: rgba(109, 121, 120, .7) ;
    color: #fff;
    padding-bottom: clamp(40px, 4.7619vw, 80px);
}
.sec_city .line_right {
    top: calc(clamp(200px, 22.619vw, 380px)*-1);
    bottom: 0;
}
.headline {
    text-align: center;
}
.headline .ttl {
    font-size: clamp(2.6rem, 3.0952vw, 5.2rem);
    letter-spacing: 0.06em;
    line-height: 1.6;
}
.headline .ttl_sub {
    font-size: clamp(1.6rem, 1.4286vw, 2.4rem);
    letter-spacing: 0.06em;
    line-height: 1.75;
}
.city_block {
    position: relative;
    max-width: 795px;
    margin: auto;
}
.city_txt {
    font-size: clamp(1.2rem, 0.8929vw, 1.5rem);
    letter-spacing: 0.1em;
    line-height: 2.4;
    position: absolute;
    top: calc(clamp(0px, 0.7738vw, 13px)*-1);
    left: calc(clamp(15px, 2.1429vw, 36px)*-1);
}
@media only screen and (max-width: 1023px) {
    .city_txt { left: 0;}
}
@media screen and (max-width: 767px) {
    .city_txt {
        position: static;
        text-align: center;
        margin-bottom: 20px;
    }
}
.block_head {
	padding-top: clamp(70px, 9.8214vw, 165px);
	position: relative;
	z-index: 0;
    max-width: 1030px;
    margin: 0 auto clamp(40px, 3.869vw, 65px);
}
.block_head .circle_light01 {
	width: 50.2%;
    right: 9%;
    left: auto;
}
.block_head .circle_light02 {
	width: 50.2%;
    right: 9%;
    left: auto;
}
.block_head .circle_light03 {
	width: 50.2%;
    left: 10%;
}
.block_head .circle_light04 {
	width: 50.2%;
    right: 9%;
    left: auto;
}
.block_head .block_wrap {
    display: flex;
    gap: clamp(10px, 2.6786vw, 45px);
    position: relative;
    margin: auto;
}
.block_head .cont {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-top: calc(clamp(20px, 2.0833vw, 35px)*-1);
    width: 39%;
}
.block_head .cont .box {
	background: #3a4246;
	padding: clamp(20px, 3.869vw, 65px) 15px clamp(20px, 2.6786vw, 45px);
	text-align: center;
	transition: all 0.25s linear;
    z-index: 2;
    position: relative;
}
.block_head .cont .pos_link {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: 1;
}
.block_head .cont .ttl {
	color: #d8d3cb;
	font-size: clamp(1.6rem,1.30952381vw,2.2rem);
	font-weight: 500;
	letter-spacing: 0.2em;
	line-height: 1.2;
}
.block_head .cont .ttl::after {
    content: "";
    background: url(../../common/imgs/icon_line.png) no-repeat center center/contain;
    width: 8px;
    height: 28px;
    margin: auto;
    display: block;
    margin: clamp(3px, 0.5952vw, 10px) auto clamp(3px, 0.5952vw, 10px);
}
.block_head .cont .ttl_sub {
    font-size: clamp(1.2rem, 1.3095vw,2.2rem);
    line-height: 2;
    letter-spacing: 0.15em;
    color: #fff;
}
.block_head .cont .txt {
	font-size: clamp(1.2rem,0.833333vw,1.4rem);
	line-height: 2.2;
    margin-top: 10px;
    color: #f0f0f0;
    padding-right: 35.5%;
}
.block_head .img {
	position: relative;
	z-index: 0;
    flex: 1;
    margin-left: -14%;
}
.block_head .img img {
    -webkit-mask-image: url(../imgs/cate_mask.png);
	mask-image: url(../imgs/cate_mask.png);
	mask-repeat: no-repeat;
	mask-size: 100% 100%;
}
.block_head .img .pos_rel { 
    width: calc(100% + (100vw - 1030px)/2 - 8px );
	margin-right: calc(-1*(100vw - 1030px)/2 );
}
.block_head .img .mv {
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: all 0.25s linear;
	overflow: hidden;
}
.block_head .img .mv img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.block_head.revert .block_wrap { flex-direction: row-reverse;}
.block_head.revert .img .pos_rel { 
    width: calc(100% + (100vw - 1030px)/2 );
    margin-right: auto;
	margin-left: calc(-1*(100vw - 1030px)/2 );
}
.block_head.revert .img {
    margin-right: -14%;
    margin-left: 0;
}
.block_head.revert .img img {
    -webkit-mask-image: url(../imgs/cate_mask_rev.png);
	mask-image: url(../imgs/cate_mask_rev.png);
}
.block_head.revert .cont .box {
    margin-right: 0;
}
.block_head.revert .img .pic_cap { right: 4.7%;}
.block_head.revert .cont .txt { 
    padding-left: 35.5%;
    padding-right: 0;
}
@media screen and (max-width: 1200px) {
    .block_head .img .pos_rel {
        width: calc(100% + 15px)!important;
        margin-right: -15px;
        margin-left: auto;
    }
	.block_head.revert .img .pos_rel {
        margin-left: -15px;
        margin-right: auto;
    }
}
@media screen and (max-width: 1024px) {
    .block_head .cont { width: 42%;}
    .block_head .circle_light01 {
        width: 38%;
    }
    .block_head .circle_light04 {
	    width: 35.2%;
    }
}

@media screen and (max-width: 767px) {
    .block_head .block_wrap { flex-wrap: wrap;}
    .block_head .cont {
        width: 100%;
        order: 1;
        margin-top: 0;
        flex-direction: initial;
        justify-content: center;
	}
    .block_head .img { 
        width: 100%;
        margin: 0!important;
    }
   .block_head .img .pos_rel { width: 100%!important;}
    .block_head .cont .box {
        position: absolute;
        height: max-content;
        left: 0;
		bottom: 15px;
        margin: 0!important;
        top: -20px;
        min-width: 200px;
    }
	.block_head .img img {
		-webkit-mask-image: url(../imgs/cate_mask_sp.png);
		mask-image: url(../imgs/cate_mask_sp.png);
	}
	.block_head .cont .ttl_sub { line-height: 1.8;}
	.block_head .cont .ttl { letter-spacing: 0.1em; }
	.block_head .cont .txt { 
        line-height: 1.7;
        padding: 0!important;
    }
    .block_head .circle_light01 {
        width: 45%;
        right: 27%;
    }
    .block_head .circle_light03 {
        left: 18%;
        width: 60%;
    }
    .block_head .circle_light04 {
        width: 70%;
        right: 10%;
    }
    .block_head.revert .cont .box{
		right: 0;
        left: auto;
		bottom: 15px;
	}
    .block_head.revert .img img {
		-webkit-mask-image: url(../imgs/cate_mask_rev_sp.png);
		mask-image: url(../imgs/cate_mask_rev_sp.png);
	}
    .block_head.revert .img .pic_cap { right: 7.5%;}
}
/* sec_train */
.sec_train { padding: 0 0 clamp(60px, 5.0595vw, 85px);}
.sec_train .line_left {
    bottom: 31%;
    top: calc(clamp(40px, 14.2857vw, 240px)*-1);
}
.sec_train .line_right {
    top: 57%;
    bottom: calc(clamp(80px, 11.9048vw, 200px)*-1);
}
.train_img {
    max-width: 1000px;
    margin: 0 auto clamp(40px, 5.3571vw, 90px);
}
.train_place {
	max-width: 975px;
	margin: 0 auto clamp(50px, 4.4643vw, 75px);
	position: relative;
    padding: clamp(30px, 2.9762vw, 50px) clamp(15px, 2.9762vw, 50px) clamp(30px, 2.9762vw, 50px) 0;
}
.train_place::before {
    content: "";
    background-color: rgba(58, 66, 70, .6);
    position: absolute;
    width: calc(100% + (100vw - 925px)/2);
    margin-left: calc(-1*(100% + (100vw - 925px)/2));
    height: 100%;
    left: auto;
    right: 0;
    top: 0;
}
.train_place .place_head {
	position: absolute;
    left: 54%;
}
.train_place .place_head .ttl {
	color: #fff;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    font-size: clamp(1.2rem,1.3095vw, 2.2rem);
    line-height: 2;
    letter-spacing: 0.1em;
    white-space: nowrap;
    width: auto;
    height: auto;
    display: inline-block;
}
.train_place .place_list {
	display: grid;
	grid-template-columns: 69.5% 1fr;
	grid-template-rows: auto 1fr;
	gap: 0 clamp(15px,1.4881vw, 25px);
    position: relative;
    z-index: 2;
}
.train_place .place_list .cont { position: relative;}
.train_place .place_list .txt_pos {
	font-size: clamp(1.5rem, 1.7857vw, 3rem);
    line-height: 1;
	letter-spacing: 0.1em;
	color: #d8d3cb;
    position: relative;
    top: calc(clamp(5px, 0.7738vw, 13px)*-1);
}
.train_place .place_list .txt_pos .en { font-weight: 500;}
.train_place .place_list .txt_pos .sm { font-size: 53%;}
.train_place .place_list .item:nth-child(1){
    width: 73%;
	grid-column: 1/2;
	grid-row: 1/2;
}
.train_place .place_list .item:nth-child(2){
    grid-row: 1/3;
    margin-top: clamp(55px, 3.869vw, 65px);
}
.train_place .place_list .item:nth-child(3){
	grid-column: 1/2;
	grid-row: 2/3;
    width: 48%;
    margin-left: auto;
    margin-top: calc(clamp(0px, 0.5952vw, 10px)*-1);
}
.train_place .circle_light {
	width: 102%;
    left: -22%;
    z-index: 1
}
.train_info {
    max-width: 980px;
    margin: auto;
}
.train_info .row {
    gap: clamp(30px, 2.67857143vw, 45px) 0;
    margin-bottom: clamp(20px, 2.381vw, 40px);
}
@media only screen and (max-width: 950px) {
    .train_place::before {
        left: -15px;
        width: calc(100% + 15px);
        margin-left: 0;
    }
}
@media only screen and (max-width: 767px) {
    .sec_train .block_head { padding-top: 115px;}
    .sec_train .line_left { bottom: 37%;}
    .sec_train .block_head .cont .box { top: -80px;}
    .train_place .place_list {
        grid-template-columns: 61.5% 1fr;
        gap: 10px 15px;
    }
    .train_place .place_head { left: 45.5%;}
    .train_place .place_list .item:nth-child(3) {
        width: 68%;
        margin-top: 0;
    }
    .train_place .circle_light {
        width: 85%;
        left: -6%;
    }
    .train_info .row { margin: 0 -5px 20px;}
    .train_info .row > [class^="col"]{ padding: 0 5px;}
}
/* sec_airport */
.sec_airport {
    padding: 0 0 clamp(60px, 5.9524vw, 100px);
    overflow: hidden;
}
.sec_airport .line_left { 
    top: 20%;
    z-index: 0;
}
.airport_list {
    display: grid;
    grid-template-columns: 48% auto;
    gap: 25px clamp(40px, 4.7619vw, 80px);
    max-width: 1030px;
    margin: clamp(40px, 4.4643vw, 75px )auto 0;
}
@media only screen and (max-width: 767px) {
    .airport_list { grid-template-columns: 1fr;}
    .sec_airport .line_left { top: 10%;}
}
/* sec_highway */
.sec_highway { padding-bottom: clamp(60px, 6.5476vw, 110px);}
.sec_highway .line_right {
    top: 15%;
}
.highway_block {
    max-width: 950px;
    margin: clamp(40px, 7.4405vw, 125px) auto 0;
}
.highway_list {
    text-align: center;
    margin-bottom: clamp(20px, 2.381vw, 40px);
    gap: 30px 0;
}
.highway_list .tag {
    font-size: clamp(1rem, 0.8333vw, 1.4rem);
    line-height: 1.4;
    background-color: rgba(255, 255, 255, .3);
    padding: clamp(5px, 0.5952vw, 10px);
    
    margin-bottom: clamp(20px, 2.381vw, 40px);
    color: #d7dad5;
    border: 1px solid #ffffff;
}
.highway_list .ttl {
    font-size: clamp(1rem, 0.8333vw, 1.4rem);
    letter-spacing: 0.1em;
    line-height: 1.5;
    margin-bottom: clamp(10px, 0.8929vw, 15px);
    color: #d7dad5;
}
.highway_list .ttl .md { font-size: 143%;}
.highway_list .ttl .lg { font-size: 186%;}
.highway_list .ttl .sm { font-size: 129%;}
.highway_list .sub_list.row { 
    margin: 0 -5px;
    gap: 15px 0;
    padding: 0 10px;
    color: #f0f0f0;
}
.highway_list .sub_list.row > [class^="col"]{ padding: 0 5px;}