@charset "UTF-8";

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	}

/* 大枠 */
html,
body {
	height: 100%;
	-webkit-font-smoothing: antialiased;
	-webkit-text-size-adjust: none;
	}
body {
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 1.6;
	}
#wrapper {
	width: 100%;
	margin: 0 auto;
	position: relative;
	}
body > #wrapper {
	height: auto;
	}
.clearfix:after {
    visibility: hidden;
    display: block;
    content: " ";
    clear: both;
    height: 0;
    }

@media print {
	html,
	html body{overflow: visible !important;}
	}

/* アクセシビリティ */
.guidance {
	left:-999px;
	position:absolute;
	width:990px;
	}
img {max-width: 100%;height: auto;vertical-align: bottom;} /* レスポンシブ対応 */
img {
	vertical-align: bottom;
	box-shadow: #000 0 0 0; /* ロールオーバー対応 */
	}
img, x:-moz-any-link, x:default {
    box-shadow: #000 0 0 0; /* IE7対応 */
	}

/* リンク */
a{display: block;color: #333;}
a:link    {color: #333;text-decoration: none;}
a:visited {color: #333;text-decoration: none;}
a:hover   {color: #333;opacity: .7;}


.mincho{
	/* font-family: "FOT-筑紫明朝 Pr6 L","TsukuMinPr6-L","ヒラギノ明朝 Pro W3","Hiragino Mincho Pro","TakaoEx明朝",TakaoExMincho,"MotoyaLCedar","Droid Sans Japanese","HGS明朝E","ipamin","ＭＳ Ｐ明朝",serif; */
	font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
	position: relative;
	font-weight: normal;
	}

/* CLEARFIX */
.container:after,
.row:after,
.col:after {content: "";display: table;clear: both;}

.container {width: 100%;max-width: 1000px;margin: 0 auto;position: relative;}

/* ブロック関係 */
.row {padding-bottom: 0em;}
.col {display: block;float: left;width: 100%;line-height: 1.5;}
.col:first-child {margin-left: 0;}
.col:last-child {margin-right: 0;}

/* グリッドの設定 */
.span_1 {width: 6.25%;}
.span_2 {width: 15%;}
.span_3 {width: 23.5%;}
.span_4 {width: 32%;}
.span_5 {width: 40.5%;}
.span_6 {width: 49%;}
.span_7 {width: 57.5%;}
.span_8 {width: 64%;}
.span_9 {width: 74.5%;}
.span_10 {width: 83%;}
.span_11 {width: 91.5%;}
.span_12 {width: 100%;}

.pc {display: block;}
.sp {display: none;}

/* ボーダー */
header::before,#main::before {
	display: block;
	content: "";
	width: 100%;
	height: 20px;
	background: url(../img/main_border.png)repeat-x top center;
	background-size: 100px;
	margin-bottom: 15px;
}

h2 {
	margin-bottom: 20px;
	color: #8B272B;
	font-size: 24px;
	text-align: center;
}
h2 img{
	display: block;
	width: 62px;
	height: 57px;
	margin: 0 auto 5px;
}
section {
	border-bottom: 1px solid #848383;
	padding: 45px 0 80px;
	overflow: hidden;
}
section .sp_box > p{
	max-width: 650px;
	margin: 0 auto 30px;
}
section .sp_box > p.color_range{
	text-align: center;
	font-weight: 600;
}
section .sp_box > p.color_range span{
	font-weight: 400;
	position: relative;
	margin: 0 30px;
}
section .sp_box > p.color_range span.orange_range{
	margin: 0 10px;
}
section .sp_box > p.color_range span.yellow_range::before{
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	transform: translate(-25px,-50%);
	background-color: #FFFF00;
	width: 20px;
	height: 20px;
}
section .sp_box > p.color_range span.orange_range::before{
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	transform: translate(-25px,-50%);
	background-color: #FF9632;
	width: 20px;
	height: 20px;
}
/* section .sp_box > p span{
	font-weight: bold;
} */
section .sp_box > p span.red{
	color: #e91c24;
}
section .calender{
	display: flex;
	justify-content: space-between;
}
section .calender .calender_left{
	width: 100%;
	margin-right: 20px;
}
section .calender .calender_right{
	width: 100%;
	margin-left: 20px;
}
/* ▼▼▼ ヘッダー
=====================================*/
header {
	width: 100%;
	overflow: hidden;
}
header .header_bg {
	background: #8B272B;
}
header .container {
	position: relative;
}
header #site_title {
	padding: 50px 15px 35px;
	text-align: center;
}
header #site_title img{
	width: 670px;
}
header .header_link {
	position: absolute;
	top: -45px;
	right: 0;
}
header .header_link ul{
	width: 170px;
	background: #fff;
	border-radius: 5px;
	padding: 15px 20px;
	margin-bottom: 10px;
	overflow: hidden;
}
header .header_link ul li {
	float: left;
}
header .header_link ul li:first-child {
	margin-right: 15px;
}
header .header_link p a{
	display: block;
	float: right;
	width: 110px;
	height: 40px;
	background: url(../img/navicorn_top.png);
	background-size: contain;
	background-repeat: no-repeat;
	text-indent: -999999px;
}
header .header_link p a:hover{
	opacity: 1;
	background: url(../img/navicorn_top_on.png);
	background-size: contain;
	background-repeat: no-repeat;
}
/* メイン */
#mainVisual {
	background: url(../img/main_bg_pc.webp)no-repeat bottom;
	background-size: cover;
	padding: 80px 0 130px;
	position: relative;
} 
	/* 終了表示 */
	/* #mainVisual::after {
		display: block;
		content: "終日対面通行規制は終了しました。\Aご協力ありがとうございました。";
		background: rgba(51, 51, 51,.8);
		width: 100%;
		height: 70%;
		padding-top: 150px;
		color: #fff;
		font-size: 40px;
		text-align: center;
		font-weight: bold;
		white-space: pre;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 9;
		} */

#mainVisual .mv_wrap{
	display: flex;
	align-items: flex-start;
	gap: 30px;
	max-width: 800px;
	margin: 0 auto;
}
#mainVisual .mv_main{
	position: relative;
	max-width: 490px;
}
#mainVisual .mv_main.end::before{
	content: "工事は終了しました。";
    position: absolute;
    inset: 0;
    z-index: 10;
    width: 340px;
    height: 130px;
    display: grid;
    place-content: center;
	background: rgba(0, 0, 0, 0.4);
    padding: 10px;
    margin: auto;
    font-size: 24px;
    font-weight: bold;
    color: #fff;
    text-align: center;
    letter-spacing: 0.05em;
}
.mv_status{
	max-width: 280px;
	margin: 0 auto;
	background-color: #FAEE2B;
	border-radius: 15px;
	padding: 30px 20px 20px 20px;
	display: flex;
	flex-direction: column;
    align-self: stretch;
    justify-content: space-between;
    position: relative;
}
.mv_status::before{
	content: "";
	width: 157px;
	height: 124px;
	background: url(../img/icon_caution.svg) no-repeat center center / contain;
	margin: auto;
	position: absolute;
	top: 10px;
	left: 0;
	right:0;
}
.mv_status .status_txt,.mv_status .status_box{
	position: relative;
}
.mv_status .status_txt{
	font-size: 16px;
	font-weight: 600;
	line-height: 1.8;
}
.mv_status .status_box{
	width: 100%;
}
.mv_status .status_box .status_sub{
	margin-bottom: 5px;
	font-size: 14px;
	color: #009CE0;
	font-weight: 500;
	text-align: center;
}


/* 更新情報 */
.news_inner{
	background: #FAEE2B;
	padding: 2px 0;
	overflow: hidden;
}
.news_inner .span_12 dl{
	overflow: hidden;
	margin: 5px 40px 5px 0;
}
.news_inner .span_12 dl dt{
	float: left;
	width: 80px;
	background: #FAEE2B;
	position: relative;
	font-weight: 700;
	z-index: 2;
}
.news_inner .span_12 dl dd{
	float: left;
	width: 400px;
}
.marquee {
	float: left;
	width: auto;
	padding:0 50px;
	white-space: nowrap;
	animation-name: marquee;
	animation-duration: 15s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	overflow: hidden;
	}
	@keyframes marquee {
	from    { transform: translate(0%); }
	100%,to { transform: translate(-100%); }
}

/* ▼▼▼ メイン 「コンテンツとサイドを囲む要素」
=====================================*/
#main {
	margin: 0 auto;
	clear: both;
	overflow: hidden;
	}
/* nav */
.nav {
	background: #8B272B;
	transition: .3s;
}
.nav ul {
	max-width: 900px;
	margin: 0 auto;
	overflow: hidden;
	display: flex;
	justify-content: center;
}
.nav ul li{
	width: 17%;
	position: relative;
}
.nav ul li::after{
	content: "";
	width: 2px;
	height: 65px;
	background: #fff;
	margin: auto;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
}
.nav ul li:nth-child(5)::before{
	content: "";
	width: 2px;
	height: 65px;
	background: #fff;
	margin: auto;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
}
.nav ul li a{
	display: block;
	padding: 17px 10px;
	color: #fff;
	font-size: 17px;
	font-weight: bold;
	text-align: center;
}
.nav ul li a:hover{
	background: #6a0000;
	opacity: 1;
}
.nav ul li img{
	display: block;
	width: 35px;
	height: 30px;
	margin: 0 auto 5px;
}
.nav ul li.scroll_block{
	display: none;
}
/* nav 動き */
#home .nav.is-fixed  ul {
	max-width: 1000px;
}
#home .nav.is-fixed  ul li {
	width: 15%;
}
#home .nav.is-fixed  ul li a {
	padding: 15px 10px;
	font-size: 15px;
}
#home .nav.is-fixed  ul li img{
	display: block;
	width: 30px;
	height: 30px;
	margin: 0 auto 5px;
}
#home .nav.is-fixed ul li.scroll_block{
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 250px;
	padding-left: 20px;
	font-size: 14px !important;
	color: #fff;
}
#home .nav.is-fixed ul li.scroll_block a{
	padding: 0;
	margin: 0;
}
#home .nav.is-fixed ul li.scroll_block .img{
	max-width: 220px;
	width: 100%;
	margin-top: 6px;
}
#home .nav.is-fixed ul li.scroll_block .img img{
	width: 100%;
	height: auto !important;
}
#home .nav.is-fixed ul li.scroll_block .img img:hover{
	opacity: .7;
}
.is-fixed {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 200;
	width: 100%;
}
.is-hide {
	transform: translateY(-100%);
}
/* ▼▼▼ 工事内容 */
#sec1 h3,#sec2 h3,#sec3 h3 {
	background: #0062B1;
	padding: 5px;
	margin-bottom: 30px;
	border-radius: 100vmax;
	font-size: 22px;
	font-weight: 600;
	color: #fff;
	text-align: center;
}
@media all and (-ms-high-contrast:none) {
	#sec1 h3,#sec2 h3,#sec3 h3{
		height: 32px;
		padding: 3px 6px 0;
	}
}
#sec1 p.photo {
	max-width: 858px;
	text-align: center;
	position: relative;
}
#sec1 p.photo.end::before{
	content: "工事は終了しました。";
	position: absolute;
	z-index: 10;
	font-size: 58px;
	width: 80%;
	font-weight: bold;
	color: #ffffff;
	text-align: center;
	letter-spacing: 0.05em;
	background: rgba(0, 0, 0, 0.5);
	padding: 120px;
	top: 50%;
	left: 50%;
	translate: -50% -50%;
}
#sec1 p.photo2 {
	max-width: 567px;
	text-align: center;
}
#sec1 .inner {
	max-width: 530px;
	margin: 0 auto 30px;
	overflow: hidden;
}
#sec1 .inner p.icon{
	float: left;
	margin-right: 20px;
}
#sec1 .inner p.icon img{
	width: 100px;
}
#sec1 .inner p span {
	font-weight: bold;
}
#sec1 ul.info {
	display: flex;
	gap: 30px;
}
#sec1 ul.info li{
	width: calc((100% / 3) - 15px);
}
#sec1 ul.info li p:first-child{
	width: 100%;
	margin: 0 auto 20px;
	height: 150px;
	display: flex;
	align-items: center;
	justify-content: center;
}
#sec1 ul.info li p:first-child img{
	width: 100%;
}
#sec1 ul.info li:nth-child(1) img{
	max-width: 168px;
}
#sec1 ul.info li:nth-child(3) img{
	max-width: 143px;
}
#sec1 ul.info li p:nth-child(2){
	margin-bottom: 5px;
	font-size: 18px;
	font-weight: 600;
	color: #0098DC;
}
#sec1 ul.info li p:nth-child(3){
	font-size: 16px;
}
#sec1 ul.note{
	background: #D6F4FF;
	padding: 30px 50px;
	margin: 70px auto;
}
#sec1 ul.note li{
	font-size: 24px;
	text-indent: -1em;
	padding-left: 1em;
}
#sec1 ul.note li:not(:last-of-type){
	margin-bottom: 30px;
}
#sec1 ul.note li span{
	color:#FF0014;
}

/* 安全なご利用 */
#sec3 {
	overflow: hidden;
}
#sec3 ul.square{
	display: table;
	margin: 0 auto 30px;
}
#sec3 ul.square li{
	text-indent: -1em;
	padding-left: 1em;
	font-weight: bold;
}
#sec3 ul.square li .red {
	color: #cf000e;
}
#sec3 .sp_box > p{
	margin: 0 auto 25px;
	text-align: center;
}
#sec3 .sp_box > p.safety_txt{
	text-align: start;
	max-width: 705px;
}
#sec3 .sp_box > p:nth-child(4){
	max-width: 730px;
	margin: 0 auto 25px;
	text-align: left;
}
#sec3 .sp_box > p:last-child{
	max-width: 230px;
}
/* お問い合わせ */
#sec4 {
	overflow: hidden;
	border-bottom:none;
}
#sec4 .sp_box > p{
	margin-bottom: 30px;
	font-size: 24px;
	font-weight: 500;
	text-align: center;
}
#sec4 .sp_box > p span{
	border-bottom: 2px solid #bd272d;
}
#sec4 .box{
	margin-bottom: 20px;
	border-bottom: 1px solid #959595;
}
#sec4 .box:last-child{
	margin-bottom: 0;
	border-bottom: none;
}
#sec4 .sp_box > dl.contact{
	margin-bottom: 35px;
	overflow: hidden;
}
#sec4 .sp_box > dl.contact.mb_con{
	margin-bottom: 64px;
}
#sec4 .sp_box > dl dt{
	float: left;
	width: 25%;
	background: #0062B1;
	padding: 75px 25px;
	color: #fff;
	font-weight: 500;
	text-align: center;
	font-size: 20px;
}
#sec4 .sp_box > dl dd{
	float: left;
	width: 75%;
	border:1px solid #0062B1;
	padding: 30px 40px;
}
#sec4 .box h3{
	margin-bottom: 20px;
	font-size: 20px;
	font-weight: 400;
}
p.mb10 {
	clear: both;
}
#sec4 .sp_box > dl dd h3 span{
	font-size: 15px;
	font-weight: normal;
}
#sec4 dl ul {
	margin-bottom: 20px;
	overflow: hidden;
}
#sec4 dl .box:last-child ul {
	margin-bottom: 0;
}
#sec4 dl ul li{
	display: inline-block;
	width: 30%;
	vertical-align: middle;
}
#sec4 .box .mb20{
	font-size: 15px;
}
#sec4 .box .center_ttl{
	font-size: 18px;
}
img[src*="tel_img02_02.svg"] {
	margin-left: 20px;
}
#sec4 .box .line_h{
	line-height: 1;
}
#sec4 .box span.line{
	text-decoration: underline;
}
#sec4 dl ul li.span_2{
	width: 20%;
	font-size: 15px;
	text-align: center;
}
#sec4 dl ul li.span_auto{
	width: auto;
}
#sec4 dl ul li.span_5{
	width: 49%;
}
#sec4 dl ul li.span_5 p{
	font-size: 15px;
	color: #0062B1;
	line-height: 1.7;
}

#sec5{
	background-color: #E1F1F5;
	padding: 71px 0px 112px;
}
#sec5 h2{
	color: #0062B1;
	margin-bottom: 62px;
}
#sec5 .library_wrap{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 56px 78px;
	margin-bottom: 40px;
}
#sec5 .library_wrap .library_box{
	width: calc(50% - 39px);
}
#sec5 .library_wrap .library_box .library_txt{
	font-size: 24px;
	color: #0062B1;
	font-weight: 500;
	margin-top: 15px;
}
#sec5 .library_wrap .library_box .movie{
	aspect-ratio: 16/9;
}
#sec5 .library_wrap .library_box .movie.coming{
	background-color: #fff;
	position: relative;
}
#sec5 .library_wrap .library_box .movie.coming::before{
	content: 'coming soon……';
	position: absolute;
	font-size: 24px;
	color:#0062B1 ;
	text-align: center;
	left: 50%;
	top: 50%;
	translate: -50% -50%;
}
#sec5 .library_wrap .library_box .movie iframe{
	width: 100%;
	height: 100%;
}
#sec5 .library_wrap .library_box .leaflet{
	background-color: #fff;
	padding: 0px 48px;
}

#sec5 .library_btn{
	position: relative;
	color: #000;
	width: 461px;
	height: 65px;
	background-color: #FAEE2B;
	border-radius: 9px;
	margin: 0 auto;
	text-align: center;
	line-height: 65px;
	font-size: 24px;
	font-weight: 700;
	box-shadow:0px 7px 0px #B0C2D6 ;
}
#sec5 .library_btn::after{
	content: '';
	position: absolute;
	background: url(../img/icon_dl.svg)no-repeat center/contain;
	width: 27px;
	height: 24px;
	left: 58px;
	top: 50%;
	translate: 0 -50%;
}

/* ▼▼▼ フッター
=====================================*/
footer {
	border-top: 1px solid #959595;
	width: 100%;
	padding: 20px 0;
	clear: both;
	overflow: hidden;
}
#footer_inner {
	max-width: 1000px;
	margin: 0 auto;
	overflow: hidden;
}
#footer_inner ul.f_nav{
	margin-bottom: 30px;
	text-align: center;
}
#footer_inner ul.f_nav li{
	display: inline-block;
	font-size: 12px;
	text-align: center;
}


/* ▼ ページ上部へ戻る */
.pagetop {
	position: fixed;
	bottom: 20px;
	right: 20px;
	z-index: 2000;
	cursor: pointer;
}

/* ▼ コピーライト */
#copyright {
	font-size: 10px;
	text-align: center;
}



/* ▼▼▼ 1024px
=====================================*/
@media screen and (max-width: 1024px) {
	#mainVisual {
		background: url(../img/main_bg_pc.webp)no-repeat center;
		background-size: cover;
		overflow: hidden;
}
#mainVisual::after {
height: 57%;
padding-top: 45vw;
font-size: 20px;
}
section {
padding: 45px 20px 30px;
}
.mr20 {
margin-right: 15px;
}
}

/* ▼▼▼ 480px〜768px
=====================================*/
@media screen and (max-width: 768px) {
	body {
	font-size: 14px;
	}
	#wrapper {width: 100%;}
	.span_1,.span_2,.span_3,.span_4,.span_5,.span_6,.span_7,.span_8,.span_9,.span_10,.span_11,.span_12{width: 100%;}
	.col {margin: 0;}
	
	.pc {display: none;}
	.sp {display: block;}
	
	/* ボーダー */
	header::before,#main::before {
	height: 10px;
	background-size: 19%;
	}
	#main::before {
	margin-bottom: 17px;
	}
	h2 {
	background: #8B272B;
	width: 100%;
	padding: 10px 0 10px 10px;
	margin-bottom: 1px;
	font-size: 19px;
	color: #fff;
	position: relative;
	}
	h2 img{
	width: 25px;
	height: 25px;
	position: absolute;
	top: 28%;
	left: 60px;
	}
	h2::after {
	content: "";
	width: 20px;
	height: 12px;
	background: url(../img/h2_arrow.svg)no-repeat top center;
	background-size: cover;
	position: absolute;
	top: 45%;
	right: 30px;
	-webkit-transform: rotate(180deg);
	transform: rotate(180deg);
	}
	h2.close::after{
	top: 40%;
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
	}
	section {
	border-bottom: 1px solid #959595;
	padding: 0;
	}
	section .sp_box > p{
	margin: 0 auto 20px;
	}
	section .sp_box {
	display: none;
	padding: 30px 15px;
	}
	/* ▼▼▼ ヘッダー
	=====================================*/
	body.wrap {overflow: hidden;}
	
	header {
	width: 100%;
	}
	header #site_title {
	padding: 30px 15px 25px;;
	}
	header #site_title img{
	width: 100%;
	}
	header .header_link {
	width: 100%;
	top: -30px;
	}
	header .header_link ul{
	float: right;
	width: 130px;
	padding: 10px 15px;
	}
	header .header_link ul li {
	float: left;
	width: 39%;
	}
	header .header_link ul li:nth-child(2) {
	float: left;
	width: 51%;
	}
	header .header_link ul li:first-child {
	margin-right: 10px;
	}
	header .header_link p a{
	float: left;
	margin: 18px;
	width: 85px;
	height: 31px;
	}
	/* ▼▼▼ メイン 「コンテンツとサイドを囲む要素」
	=====================================*/
	#header_inner,
	#main,#contents,#side,
	footer,#footer_inner {
	float: none;
	width: 100%;
	}
	/* メイン */
	#mainVisual {
		background: url(../img/main_bg_sp.webp)no-repeat bottom;
		background-size: cover;
		padding: 45px 0 110px;
		position: relative;
	} 
		/* 終了表示 */
		/* #mainVisual::after {
			display: block;
			content: "終日対面通行規制は終了しました。\Aご協力ありがとうございました。";
			background: rgba(51, 51, 51,.8);
			width: 100%;
			height: 70%;
			padding-top: 150px;
			color: #fff;
			font-size: 40px;
			text-align: center;
			font-weight: bold;
			white-space: pre;
			position: absolute;
			top: 0;
			left: 0;
			z-index: 9;
			} */

	#mainVisual .mv_wrap{
		flex-direction: column;
		gap: 20px;
		max-width: 295px;
	}
	#mainVisual .mv_main{
		max-width: 100%;
	}
	#mainVisual .mv_main.end::before{
		content: "工事は終了しました。";
		position: absolute;
		inset: 0;
		z-index: 10;
		width: 100%;
		height: 162px;
		padding: 0;
		font-size: 18px;
	}
	.mv_status{
		max-width: 100%;
		padding: 10px 30px 15px 30px;
		align-self: flex-start;
	}
	.mv_status::before{
		width: 71px;
		height: 56px;
		top: 5px;
	}
	.mv_status .status_txt,.mv_status .status_box{
		position: relative;
	}
	.mv_status .status_txt{
		font-size: 10px;
		line-height: 1.4;
		text-align: center;
	}
	.mv_status .status_box{
		width: 100%;
	}
	.mv_status .status_box .status_sub{
		margin-top: 10px;
		margin-bottom: 5px;
		font-size: 12px;
	}

	
	/* 更新情報 */
	.news_inner{
		padding: 5px 0;
		margin-bottom: 20px;
	}
	.news_inner .span_12 dl{
		margin: 0px 10px;
	}
	.news_inner .span_12 dl dt{
	float: left;
	width: 60px;
	font-size: 12px;
	}
	.news_inner .span_12 dl dd{
	float: left;
	width: calc(100% - 60px);
	font-size: 12px;
	}
	
	/* スライダー */
	#mainVisual .span_4 {
		width: 100%;
	}
	#mainVisual .span_4 .bx-wrapper{
	width: 85%;
	margin: 0 auto;
	}
	#mainVisual .span_4 .bx-wrapper img{
	width: 100%;
	}
	#mainVisual a.bx-prev {
	left: 0px;
	}
	#mainVisual a.bx-next {
	right: 0px;
	}
	
	/* nav */
	.nav {
		display: none;
		}
	
	/* ▼▼▼ 工事内容 */
	#sec1 h3,#sec3 h3 {
		padding: 6px;
		margin-bottom: 20px;
		font-size: 14px;
		line-height: 1.4;
	}
	#sec1 h3:not(:first-of-type){
		margin-top: 45px;
	}
	#sec1 p.photo {
		max-width: 100%;
		text-align: left;
	}
	#sec1 p.photo.end::before,#sec1 p.photo.end::after{
		font-size: 18px;
	}
	#sec1 ul.kome li{
	font-size: 12px;
	}
	#sec1 ul.kome li:last-child{
	margin-bottom: 0;
	}
	#sec1 .inner {
	margin: 0 auto 10px;
	}
	#sec1 .inner p.icon{
	margin-right: 15px;
	}
	#sec1 .inner p.icon img{
	width: 70px;
	}
	#sec1 .inner .txt {
	font-size: 12px;
	}
	#sec1 ul.info {
		flex-wrap: wrap;
	}
	#sec1 ul.info li{
		width: 100%;
	}
	#sec1 ul.info li:first-child{
	margin: 30px auto;
	}
	#sec1 ul.info li p:first-child{
		margin: 0 auto 20px;
		height: auto;
	}
	#sec1 ul.info li p:nth-child(2) {
		font-size: 14px;
		font-weight: 500;
	}
	#sec1 ul.info li p:nth-child(3) {
		font-size: 11px;
	}
	#sec1 ul.info li p:first-child img{
		width: 100%;
	}
	#sec1 ul.info li:nth-child(2) img{
		max-width: 248px;
	}
	#sec1 ul.note{
		padding: 15px;
		margin: 45px auto;
	}
	#sec1 ul.note li{
		font-size: 12px;
		text-indent: -1em;
		padding-left: 1em;
	}
	#sec1 ul.note li:not(:last-of-type){
		margin-bottom: 15px;
	}
	/* 工事箇所 */
	#sec2 .sp_box {
		padding: 0;
	}
	/* 安全なご利用 */
	#sec3 .sp_box > p:last-child {
	margin: 0 auto;
	}
	#sec3 .sp_box > p:last-child a{
	float: none;
	margin: 0 auto;
	}
	/* お問い合わせ */
	#sec4 .sp_box > p{
	margin-bottom: 20px;
	font-size: 20px;
	line-height: 1.4;
	}
	#sec4 .sp_box > p:last-child {
	margin-bottom: 0;
	font-size: 95%;
	line-height: 1.9;
	}
	#sec4 .box{
	margin-bottom: 20px;
	border-bottom: 1px solid #959595;
	}
	#sec4 .box:last-child{
	margin-bottom: 0;
	border-bottom: none;
	}
	#sec4 .sp_box > dl.contact{
		margin-bottom: 25px;
	}
	#sec4 .sp_box > dl.contact.mb_con{
		margin-bottom: 25px;
	}
	#sec4 .sp_box > dl dt{
	float: none;
	width: 100%;
	padding: 10px;
	font-size: 15px;
	}
	#sec4 .sp_box > dl dd{
	float: none;
	width: 100%;
	padding: 20px 15px;
	}
	#sec4 .box h3{
	font-size: 14px;
	text-align: center;
	border: 1px solid #333;
	padding: 10px;
	display: table;
	margin: 0 auto 20px;
	}
	#sec4 .sp_box > dl dd h3 span {
	font-size: 10px;
	}
	#sec4 .box h3.col {
	float: none;
	width: 83%;
	margin: 0 auto 5px;
	}
	#sec4 .box h3 + span {
	display: block;
	margin-bottom: 15px;
	text-align: center;
	}
	#sec4 dl ul li{
	width: 48%;
	}
	#sec4 dl ul li p{
	text-align: center;
	}
	img[src*="ihighway_QR.jpg"] {
	margin-left: 100%;
	transform: translateX(-50%);
	margin-top: 20px;
	}
	#sec4 .box .mb20 {
	font-size: 11px;
	}
	img[src*="tel_img02_02.svg"] {
		width: 60%!important;
		margin: 15px auto 0;
	}
	#sec4 .box .mb10{
	font-size: 15px;
	text-align: center;
	font-weight: bold;
	}
	#sec4 .box .mb30{
	margin-bottom: 20px;
	text-align: center;
	font-size: 12px;
	}
	#sec4 .box .tel-link {
	text-align: center;
	}
	#sec4 .box .tel-link img{
	width: 85%;
	}
	#sec4 .box:last-child p.txt,#sec4 .box .line_h {
	line-height: 1.5;
	text-align: center;
	font-size: 11px;
	}
	#sec4 .box .line_h img{
	vertical-align: sub;
	}
	#sec4 .box span.line{
	text-decoration: underline;
	}
	#sec4 dl ul li.span_2{
	display: block;
	width: 30%;
	margin: 0 auto 10px;
	text-align: center;
	}
	#sec4 dl ul li a{
	font-size: 13px;
	}
	#sec4 dl ul li.span_auto{
	display: block;
	width: 95%;
	margin: 0 auto;
	}
	#sec4 dl .box:last-child ul {
	width: 90%;
	margin: 0 auto;
	}
	#sec4 .box .tel-link img[src*="tel_img04.svg"]{
	width: 100%;
	}
	#sec4 dl ul li.span_5{
	display: block;
	width: 90%;
	margin: 0 auto;
	font-size: 14px;
	}
	#sec4 dl ul li.span_5:first-child{
	width: 100%;
	margin-bottom: 10px;
	}
	#sec4 dl ul li.span_5 p {
	font-size: 14px;
	text-align: left;
	}
	#sec4 .box:last-child p.tel-link{
	margin-bottom: 30px;
	}
	#sec4 .box:last-child p.tel-link.mb10{
	margin-bottom: 10px;
	margin-top: 15px;
	}
	#sec4 p.sp {
	margin-bottom: 0;
	font-size: 14px;
	}
	.font_size_11{
		font-size: 11px;
	}
	
	#sec5{
		padding:0;
	}
	#sec5 h2{
		color: #fff;
		margin-bottom: 0;
	}
	#sec5 .sp_box{
		padding: 35px 63px 50px;
	}
	#sec5 .library_wrap{
		flex-direction: column;
		gap: 20px;
		margin-bottom: 25px;
	}
	#sec5 .library_wrap .library_box{
		width: 100%;
	}
	#sec5 .library_wrap .library_box .library_txt{
		font-size: 16px;
		text-align: center;
		margin-top: 10px;
	}
	#sec5 .library_wrap .library_box .movie.coming::before{
		font-size: 14px;
	}
	#sec5 .library_wrap .library_box .leaflet{
		padding: 0px 25px;
	}
	#sec5 .library_btn{
		width: 100%;
		height: 42px;
		line-height: 42px;
		font-size: 18px;
	}
	#sec5 .library_btn::after{
		width: 20px;
		height: 18px;
		left: 28px;
	}
	
	
	/* ▼▼▼ フッター
	=====================================*/
	footer {padding: 15px 0;}
	#footer_inner ul.f_nav li {
		font-size: 11px;
	}
	
	/* ▼ ページ上部へ戻る */
	.pagetop {
		width: 50px;
		right: 10px;
		}
}