@charset "utf-8";
/* CSS Document */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, button{margin:0;padding:0;border:0;font:inherit;vertical-align:baseline;}

body, html{width:100%;box-sizing:border-box;}

body{
	font-size:100%;
	font-weight:500;
	line-height:1.8;
	font-family:"Noto Sans JP";
}

p{margin-bottom:16px;}
ol, ul{list-style:none;}
table{border-collapse:collapse;border-spacing:0;}
caption, th, td{font-weight:normal;text-align:left;}
blockquote:before, blockquote:after,q:before, q:after {content: "";content:none;}
blockquote, q{quotes:none;}
a{font-size:100%;vertical-align:baseline;background:transparent;text-decoration:none;}
img{max-width: 100%;height: auto;width /***/:auto;vertical-align:bottom;}
a img{border: 0;}
a:hover img,a:active img{-moz-opacity:0.8;opacity:0.8;filter:alpha(opacity=80);}
input, select{vertical-align:middle;}

/* パンくずリスト */
.bread_crumbs{margin:0 0 40px;font-size:12px;clear:both;}
.bread_crumbs li{margin-right:3px;display:inline;color:#333333;letter-spacing:1.5px;}
.bread_crumbs li a{color:#333333;}
.box{margin-bottom:64px;}

/* 注意 */
.red{color:#FF0000;}
/* coming_soon */
.coming_soon{font-size:18px;letter-spacing:0.1em;}

/* text */
.txt_r{text-align:right;}
.txt_c{text-align:center;}
.alignleft{margin:0 16px 16px 0;float:left;}
.alignright{margin:0 0 16px 16px;float:right;}

/* ===== 全体 ===== */
.wrap{max-width:1024px;margin:0 auto;}
.pc{display: block;}
.sp{display: none;}
.clear:after{content:"";display:block;clear:both;}

.flex_box{margin-bottom:40px;display:flex;justify-content:space-between;flex-wrap:wrap;}
.two_flex .item{width:48%;position:relative;}
.three_flex .item{width:32%;position:relative;}
.three_flex::after{content:"";display: block;width:32%;}
.four_flex .item{width:24%;position:relative;}
.four_flex::before{content:"";display: block;width:24%;order:1;}
.four_flex::after{content:"";display: block;width:24%;}
.box_link{width:100%;height:100%;position:absolute;top:0;left:0;text-indent:-9999px;white-space:nowrap;overflow:hidden;}
.list_center{display:block;text-align:center;}
.list_center li{display:inline-block;}
/* youtube埋め込みレスポンシブ */
.movie{height:0;padding-bottom:56.25%;position:relative;overflow: hidden;}
.movie iframe{width:100%;height:100%;position:absolute;top:0;left:0;}
/* Google mapの下余白&レスポンシブ */
.map iframe{vertical-align:bottom;}
/* ※ */
.kome > li{margin-left:0!important;padding-left:24px;list-style:none!important;position:relative;}
.kome > li:before{content:"※";position:absolute;top:0;left:0;}
/* 丸文字 */
.maru{margin:0;padding:0;counter-reset:my-counter;}
.maru > li{margin-left:0!important;padding-left:30px;list-style:none!important;position:relative;}
.maru > li::before{width:18px;height:18px;content:counter(my-counter);counter-increment:my-counter;border:1px solid;border-radius:50%;box-sizing:border-box;display:flex;justify-content:center;align-items:center;font-size:85%;line-height:1;position:absolute;top:4px;left: 0;}

.arrow{position:relative;display:inline-block;padding:10px;}
.arrow::before{content:'';width:10px;height:10px;border-top:solid 2px #FFFFFF;border-right:solid 2px #FFFFFF;position:absolute;left:48%;bottom:8px;transform:translateX(-48%);transition:0.4s;}
.arrow:hover::before{bottom:0;}
.arrow.arrow-bottom::before{transform:rotate(135deg);}.btn_dsn2{width:240px;text-align:center;}

.stickarrow::after{width:60px;height:4px;margin-left:12px;content:"";display:inline-block;border-bottom:1px solid #000;border-right:1px solid #000;transform:skew(45deg);transition:0.2s;}

#page-top{position:fixed;bottom:0;right:16px;}

/* ===== header ===== */
#header{padding:40px 10% 0;position: relative;background:url("image/main_bg.svg") no-repeat right bottom;}
#logo{position:absolute;right:10%;top:40px;z-index:999;}
#logo a:hover img{opacity:1 !important;}
/* main_image */
.main_image{position:relative;}
.main_image .m_img{width:100%;height:84vh;}
.main_image .m_img img{width:100%;height:100%;object-fit:cover;}
.main_image .catch_wrap{width:100%;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);}
.main_image .catch_copy{margin:0 auto 24px;display:flex;justify-content:center;align-items:center;font-size:48px;color:#FFFFFF;text-align:center;letter-spacing:0.05em;}
.main_image .catch_copy span.e55{margin:8px 12px 0 0;padding:4px 24px 8px;display:inline-block;background:#006c2b;border:2px solid #FFFFFF;border-radius:4px;box-sizing:border-box;font-size:32px;line-height:1;}
.main_image .countdown_box{position:relative;font-size:48px;color:#FFFFFF;text-align:center;letter-spacing:0.1em;}
.main_image .count_down_number span{margin:8px 8px;padding:16px 8px 40px 12px;position:relative;background:#fc901a;display:inline-block;border-radius:12px;font-size:180px;font-weight:500;color:#FFFFFF;line-height:1;}
.main_image .count_down_number span::after{width:100%;height:1px;background:#FFFFFF;content:"";position:absolute;left:0;top:50%;}
.main_image .countdown_box .count_down_days{position:absolute;left:62%;bottom:-12px;font-size:48px;}
/* infomation */
.infomation{padding:24px 0;font-size:18px;font-weight:700;text-align:center;}
.infomation span{margin-right:8px;padding:0 8px;background:#006c2b;border-radius:2px;font-size:15px;font-weight:900;color:#FFFFFF;letter-spacing:0.05em;}
/* scroll_bar */
.scroll_bar{width:calc(100% - 84%);height:70vh;padding:0 0 0 24px;background:#00b3c9;position:absolute;left:0;bottom:0;z-index:-1;color:#FFFFFF;}
.scroll_bar span{height:100%;padding-bottom:180px;display:inline-block;position:relative;box-sizing:border-box;writing-mode:vertical-rl;text-align:right;}
.scroll_bar span::after{width:1px;height:160px;content:"";position:absolute;left:14px;bottom:0;background:#FFFFFF;}

/* ===== global_menu ===== */
#global_menu , #construction_menu{padding:4px 0;background:#fc901a;}
#global_menu ul{display:flex;justify-content:space-between;flex-wrap:wrap;}
#global_menu ul li , #construction_menu ul li{width:calc(20% - 2px);font-size:15px;font-weight:700;text-align:center;}
#global_menu ul li a , #construction_menu ul li a{padding:16px 12px;background:#FFFFFF;display:block;color:#000000;transition:0.4s;}
#global_menu ul li span , #construction_menu ul li span{padding:8px 0 8px 48px;background:no-repeat left center / 40px;transition:0.4s;}
#global_menu ul li:nth-of-type(1) span{background-image:url("image/menu_icon01.svg");}
#global_menu ul li:nth-of-type(2) span{background-image:url("image/menu_icon02.svg");}
#global_menu ul li:nth-of-type(3) span{background-image:url("image/menu_icon03.svg");}
#global_menu ul li:nth-of-type(4) span{background-image:url("image/menu_icon04.svg");}
#global_menu ul li:nth-of-type(5) span{background-image:url("image/menu_icon05.svg");}

#global_menu ul li a:hover, #global_menu ul li.active a{background:#ffc000;color:#FFFFFF;}
#global_menu ul li:nth-of-type(1) a:hover span, #global_menu ul li.active:nth-of-type(1) a span{background-image:url("image/menu_icon01_ov.svg");}
#global_menu ul li:nth-of-type(2) a:hover span, #global_menu ul li.active:nth-of-type(2) a span{background-image:url("image/menu_icon02_ov.svg");}
#global_menu ul li:nth-of-type(3) a:hover span, #global_menu ul li.active:nth-of-type(3) a span{background-image:url("image/menu_icon03_ov.svg");}
#global_menu ul li:nth-of-type(4) a:hover span, #global_menu ul li.active:nth-of-type(4) a span{background-image:url("image/menu_icon04_ov.svg");}
#global_menu ul li:nth-of-type(5) a:hover span, #global_menu ul li.active:nth-of-type(5) a span{background-image:url("image/menu_icon05_ov.svg");}

/* === local_menu === */
.local_menu{margin-bottom:64px;padding:4px;background:#fc901a;display:flex;justify-content:space-between;box-sizing:border-box;font-size:15px;}
.local_menu > li{width:19.8%;position:relative;text-align:center;}
.local_menu a.menu_link{padding:16px 20px;display:block;background:#FFFFFF;color:#333333;text-align:center;text-decoration:none;transition:background-color 0.3s ease;}
.local_menu a.menu_link:hover{background-color:#FFC000;color:#FFFFFF;}

.dropdown{min-width:200px;margin:0;padding:0;position:absolute;top:100%;left:0;background:#FFFFFF;list-style:none;opacity:0;visibility:hidden;transform:translateY(-10px);transition: all 0.3s ease;box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);border:2px solid #ffc000;box-sizing:border-box;z-index:999;}
.has_dropdown:hover .dropdown{opacity:1;visibility:visible;transform: translateY(0);}
.dropdown_link{padding:12px 20px;display:block;border-bottom:1px solid #ffc000;transition: background-color 0.3s ease;color:#333333;text-decoration:none;}
.dropdown_link:hover{background:#ffc000;color:#FFFFFF;}
.dropdown li:last-child .dropdown_link{border-bottom:none;}

/* ===== contents ===== */
#contents{margin-bottom:40px;}
#contents section{padding:40px 0;}
#contents h2.page_title{margin-bottom:24px;padding-left:52px;background:no-repeat left top 4px / 48px;font-size:28px;font-weight:700;line-height:1.4;}
#contents h2.page_title:first-letter{color:#fc901a}
#contents h2.page_title small{display:block;font-size:14px;color:#fc901a;}

/* === news === */
#news{background:#ffc000;}
#news h2.page_title{color:#FFFFFF;background-image:url("image/icon_news.svg");}
#news ul{height:240px;padding-right:24px; overflow-y:scroll;}
#news ul::-webkit-scrollbar{width:12px;}
#news ul::-webkit-scrollbar-track{background:#ffc000;border:1px solid #FFFFFF;border-top:none;border-bottom:none;}
#news ul::-webkit-scrollbar-thumb{background:#FFFFFF;border-radius:4px;}
#news ul li{width:100%;margin-bottom:8px;padding:12px 24px;position:relative;display:flex;justify-content:space-between;background:#FFFFFF;box-sizing:border-box;font-size:14px;}
#news ul li:last-of-type{margin-bottom:0;}
#news ul li .news_date{width:80px;margin-right:20px;}
#news ul li .news_cat{width:100px;margin-right:40px;background:#fc901a;border-radius:2px;color:#FFFFFF;text-align:center;}
#news ul li .news_title{width:calc(100% - 240px);}
/* === links === */
#links h2.page_title{background-image:url("image/icon_links.svg");background-size:40px;}
#links ul{display:flex;justify-content:space-between;flex-wrap:wrap;}
#links ul li{width:18%;}

/* ===== footer ===== */
#footer{padding:16px 0;clear:both;color:#fc901a;}
#footer div.copy{text-align:center;font-size:11px;}

/* === 事業概要 === */
#products h2.page_title{background-image:url("image/icon_products.svg");}

/* === 整備効果 === */
#maintenance h2.page_title{background-image:url("image/icon_maintenance.svg");}

/* === 工事写真 === */
#construction .sub_image{margin-bottom:24px;}
#construction h2.page_title{background-image:url("image/icon_construction.svg");}
#construction .construction_wrap h3{margin-bottom:16px;padding:2px 12px 2px 20px;background:#fc901a;border-left:6px solid #fccf00;font-size:18px;font-weight:700;color:#FFFFFF;letter-spacing:0.05em;}
#construction .construction_wrap .construction_box{margin-bottom:24px;}
#construction .construction_wrap .construction_box h4{width:100%;margin-bottom:12px;padding-left:36px;background:url("image/h4_bg_icon.svg") no-repeat left center / 30px;font-size:16px;font-weight:700;}
#construction .construction_wrap .construction_item{margin-bottom:16px;}
#construction .construction_wrap .construction_item img{border-radius:2px;width:330px;height:180px;;object-fit:cover;}
/* === 開通メッセージ === */
#message h2.page_title{background-image:url("image/icon_message.svg");}


@media screen and (min-width: 1025px) {
	#global_menu{display:block !important;}
}
@media screen and (min-width: 741px) {
	a[href^="tel:"]{pointer-events:none;cursor:default;text-decoration: none;}
}

@media screen and (max-width: 1300px) {
	#header{padding:40px 5% 0;}
	#logo{right:5%;}
	.scroll_bar{padding-left:12px;}
	
	.main_image .catch_copy{font-size:3.2vw;}
	.main_image .catch_copy span.e55{font-size:1.6vw;}
	.main_image .countdown_box{font-size:3.2vw;}
	.main_image .count_down_number span{font-size:15vw;}
	.main_image .countdown_box .count_down_days{left:64%;}
}

@media screen and (max-width: 1024px) {
	.pc{display: none;}
	.sp{display:block;}
	.wrap{width:90%;}
	
	.three_flex .item{width:48%;}
	
	/* === overlayMenuBtn === */
	.overlayMenuBtn{height:32px;position:absolute;top:12px;right:2%;cursor:pointer;z-index:100001;}
	.overlayMenuBtn span{width:32px;position:relative;display:block;border:2px solid #00b3c9;transition:.5s;background-color:#00b3c9;}
	.overlayMenuBtn span:nth-child(1){top: 0;}
	.overlayMenuBtn span:nth-child(2){top: 6px;}
	.overlayMenuBtn small{margin-top:8px;font-size:12px;display:block;}
	/* overlayMenu */
	.overlayMenu{width:100%;height:100vh;display:none;position:fixed;overflow:auto;background:#FFFFFF;z-index:100000;color:#333333;top:0;left:0;}
	.overlayMenuInner{padding:64px 4% 40px;}
	/* overlayMenuItem */
	.overlayMenuItem ul.sp_menu{margin:20px 0 40px;padding:0;list-style-type:none;}
	.overlayMenuItem ul.sp_menu li{border-top:1px solid #CCC;}
	.overlayMenuItem ul.sp_menu li:last-child{border-bottom:1px solid #CCC;}
	.overlayMenuItem ul.sp_menu li a{width:100%;padding:12px 24px;display:block;box-sizing:border-box;color:#333333;text-decoration:none;transition:.5s;}
	.overlayMenuItem ul.sp_menu li a:hover{background-color:#fc901a;color:#FFFFFF;}
	/* ===== global_menu ===== */
	#global_menu{display:none;}
}

@media screen and (max-width: 920px) {
	#news ul li{flex-wrap:wrap;justify-content:flex-start;}
	#news ul li .news_cat{height:16px;margin-top:4px;display:flex;justify-content:center;align-items:center;font-size:12px;}
	#news ul li .news_title{width:100%;}
}

@media screen and (max-width: 860px) {
/* === local_menu === */
	.local_menu{font-size:14px;}
}

@media screen and (max-width: 800px) {
/* main_image */
	.main_image .m_img{height:70vh;}
	.main_image .catch_wrap{padding-top:24px;}
	.main_image .catch_copy{margin-bottom:0;flex-wrap:wrap;}
	.main_image .catch_copy{width:100%;font-size:4.2vw;}
	.main_image .catch_copy span.e55{font-size:24px;}
	.main_image .countdown_box{font-size:4.2vw;}
	.main_image .countdown_box .count_down_days{left:74%;bottom:-6px;font-size:32px;}
	.main_image .count_down_number span{padding:8px 8px 28px 12px;font-size:24vw;}
	.scroll_bar{height:50vh;padding-left:4px}
/* === links === */
	#links ul::after{width:31%;content:"";display:block;}
	#links ul li{width:31%;margin:2% 0;}
/* === local_menu === */
	.local_menu{flex-wrap:wrap;font-size:15px;}
	.local_menu > li{width:100%;margin-bottom:4px;}
	.local_menu > li:last-of-type{margin-bottom:0;}
	.dropdown{position:inherit;top:inherit;left:inherit;opacity:1;visibility:inherit;transform:none;border:none;display:flex;justify-content:space-between;flex-wrap:wrap;}
	.dropdown li{width:33.1%;}
	.dropdown.wide li{width:49.8%;}
	.dropdown li a{background:rgba(255,195,0,0.2);border:none;}
}

@media screen and (max-width: 740px) {
	.table_scroll{overflow: auto;white-space: nowrap;display:block;}
	.table_scroll::-webkit-scrollbar{height: 5px;}
	.table_scroll::-webkit-scrollbar-track{background: #333;}
	.table_scroll::-webkit-scrollbar-thumb {background: #999;}
	.table-scroll table{width:100%;}
	a[href^="tel:"]{text-decoration:none;color:#000000;}
	
	.two_flex .item{width:100%;margin:0 0 40px;}
	.three_flex .item{width:100%;}
	.four_flex .item{width:48%;}
	.four_flex::before{content:"";display: block;width:48%;order:1;}
	.four_flex::after{content:"";display: block;width:48%;}
}

@media screen and (max-width: 640px) {
	#header{padding:48px 5% 0;}
	#logo{width:280px;right:0;top:46px;}
	#contents h2.page_title{font-size:24px;}
/* main_image */
	.main_image .m_img{height:62vh;}
	.main_image .catch_copy{margin:0 auto;padding-top:24px;}
	.main_image .countdown_box .count_down_days{left:76%;}
	.scroll_bar span{display:none;}
/* === links === */
	#links ul::after{width:31%;content:"";display:block;}
	#links ul li{width:48%;margin:2% 0;}
/* === local_menu === */
	.local_menu > li, .local_menu > li > a{text-align:left !important;}
	.dropdown li{width:100%;}
	.dropdown li a{padding-left:32px}
	.dropdown.wide li{width:100%;}
}