@charset "UTF-8";

:root {
	--link-color: #116ff7;
    --text-color: #333333;
    --text-alert-color: #e83820;
    --bg-color-gray: #efefef;

    --theme-blue-color: #75b5de;
    --theme-pink-color: #e46d74;

    --line-color-light: #dcdcdc;
    --line-color-dark: #333333;
    --top-news-content-height: 460px;

    /* --light-button-color-dark: #dcdcdc; */

    --contents-width: 94%;
    --max-contents-width: 1200px;
    --min-contents-width: 950px;

    /*各カラー*/
    --jimusyo-primary-color: #75b5de;
    --jimusyo-primary-color-dark: #3182bc;
    --jimusyo-deep-color: #1d7fbb;
    --jimusyo-deep-color-dark: #006daf;
    --bousai-primary-color: #ea5532;
    --bousai-primary-color-dark: #e83820;
    --bousai-light-color: #f8c5ac;
    --kasen-primary-color: #497ab9;
    --kasen-primary-color-dark: #2d65ab;
    --douro-primary-color: #84be6a;
    --douro-primary-color-dark: #66b149;
    --chiiki-primary-color: #ee8f40;
    --chiiki-primary-color-dark: #eb7a2e;
    --chiiki-light-color: #fcd7a1;
    --other-deep-color: #736451;
    --other-deep-color-dark: #5c5041;
}

a:link {
    color: var(--link-color);
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

a:visited {
    color: var(--link-color);
	text-decoration: none;
}

a:hover img{
	border: none;
	opacity: 0.8;
	filter: alpha(opacity=70);
}

html {
	font-size: 62.5%;
	scroll-behavior: smooth;
    scroll-padding-top: 140px;
}

strong {
	font-weight: 700;
}

i {
	font-style: italic;
}

img{
	vertical-align:top;
}

iframe {
    vertical-align: bottom;
}

body {
    color: var(--text-color);
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 1.6rem;
    line-height: 3.2rem;
    font-weight: 400;
    font-feature-settings: "palt";
}

div.head_area_fixed {
    margin: 0 auto;
    width: 100%;
    background: #ffffff;
    position: fixed;
    top: 0;
    z-index: 100;
}

div.head_area {
    margin: 0 auto;
    width: 100%;
    height: 100px;
}

div.head {
    margin: 0 auto;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
    height: 100px;
    display: flex;
    justify-content: space-between;
}

div.head_logo {
    margin: 10px 0 0 0;
    width: 320px;
}

div.head_logo img {
    width: 100%;
    height: auto;
}

div.head_google_search_area {
    margin: 20px 0 0 auto;
    width: 330px;
    display: flex;
    justify-content: space-between;
}

div.head_google_search_logo {
    margin: 0;
    width: 108px;
}

div.head_google_search_logo img {
    width: 100%;
    height: auto;
}

div.head_google_search {
    margin: 0;
    width: 210px;
}

div.head_google_search_input_area {
    margin: 0 auto 10px;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

div.head_google_search_input {
    margin: 0;
    width: 165px;
    background: #ffffff;
}

div.head_google_search_input input[type="text"] {
    padding: 0 10px;
    width: 100%;
    background-color: #ffffff;
    font-size: 1.6rem;
    line-height: 30px;
    border: 1px solid #dddddd;
    border-radius: 4px;
    box-shadow: 1px 1px 3px rgba(0,0,0,.1) inset;
}

div.head_google_search_submit {
    margin: 0;
    width: 40px;
}

div.head_google_search_submit input[type="submit"] {
    margin: 0 auto;
    width: 100%;
    font-size: 1.6rem;
    line-height: 30px;
    text-align: center;
    background: #8e8e8e url(../images/common/head_search_button.png) center center no-repeat;
    background-size: 40px;
    color: #ffffff;
    cursor: pointer;
    border: none;
    border-radius: 4px;
}

div.head_google_search_radio {
    margin: 0 auto;
    width: 100%;
}

.radioItem {
    display: inline-flex;
    align-items: center;
    column-gap: 4px;
    line-height: 1;
    cursor: pointer;
}

.radioItem:not(:last-of-type) {
    margin-right: 16px;
}

.radioButton {
    appearance: none;
    position: relative;
    width: 20px;
    height: 20px;
    border: 1px solid #75b5de;
    border-radius: 9999px;
    cursor: pointer;
}

.radioButton:checked::after {
    content: "";
    position: absolute;
    inset: 0;
    width: 12px;
    height: 12px;
    margin: auto;
    border-radius: 9999px;
    background-color: #75b5de;
}

div.head_menu_area {
    margin: 0 auto;
    width: 100%;
    border-bottom: 1px solid var(--line-color-light);
}

div.head_menu {
    margin: 0 auto;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.head_menu ul {
    margin: 0 auto;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

div.head_menu ul li {
    margin: 0;
    width: 16.6%;
    border-right: 1px solid var(--line-color-light);
    position: relative;
}

div.head_menu ul li:first-child {
    width: 16.6%;
}

div.head_menu ul li:last-child {
    margin: 0;
    width: 16.6%;
    border-right: none;
}

div.head_menu ul li ul li:first-child {
    width: 100%;
}

div.head_menu ul li ul li:last-child {
    width: 100%;
}

/* メインメニューのスタイル */
div.head_menu ul li a {
    margin: 0 auto;
    color: #676666;
    width: 100%;
    font-size: 2.0rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    display: block;
    transition: background-color 0.3s; /* ホバーアニメーション追加 */
}

div.head_menu ul li a.active {
    background: url(../images/common/hm_bg_active.jpg) center bottom no-repeat;
    background-size: 300px;
    color: #3182bc;
}

div.head_menu ul li a:hover {
    background: url(../images/common/hm_bg_active.jpg) center bottom no-repeat;
    background-size: 300px;
    color: #3182bc;
}

/* サブメニューの基本スタイル */
div.head_menu ul li ul {
    display: block;
    position: absolute;
    top: 100%; /* メインメニューの下に配置 */
    left: 50%; /* 親要素の中央を基準点にする */
    width: 270px; /* 指定の幅に変更 */
    transform: translateX(-50%) translateY(-10px); /* 中央揃え + 初期位置オフセット */
    background: rgba(103, 102, 102, 0.9); /* 背景色を半透明に */
    flex-direction: column;
    padding: 0;
    
    /* 非表示状態の初期設定 */
    opacity: 0;
    visibility: hidden;
    
    /* アニメーション設定 */
    transition: all 0.3s ease-in-out;
    z-index: 100; /* 他の要素より前面に */
}

/* ホバー時のサブメニュー表示 */
div.head_menu ul li:hover > ul {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0); /* 中央揃えを維持したままY軸のみ移動 */
}

/* サブメニューの各項目 */
div.head_menu ul li ul li {
    width: 100%;
    margin: 0;
}

div.head_menu ul li ul li a {
    background: rgba(103, 102, 102, 0.9);
    color: #ffffff;
    line-height: 40px; /* メインメニューより低く */
    font-size: 1.4rem; /* メインメニューより小さく */
    border-right: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    transition: background-color 0.2s;
}

div.head_menu ul li ul li a:hover {
    background: rgba(255, 255, 255, 0.1); /* ホバー時の背景を少し明るく */
    color: #ffffff;
}

/*TOPメイン*/

div.top_slider {
    margin: 0 auto;
    padding: 150px 0 0;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.top_slider div img {
    width: 100%;
    height: auto;
}

div.top_main {
    margin: 0 auto;
    padding: 30px 0 50px;
    width: 100%;
}

div.top_bousai_banner {
    margin: 0 auto 40px;
    width: 800px;
}

div.top_bousai_banner img {
    width: 100%;
    height: auto;
}

div.top_road {
    margin: 0 auto 50px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.top_road_title {
    margin: 0 auto;
    padding: 10px 0;
    width: 100%;
    background: #d93924;
    border-radius: 10px 10px 0 0;
}

div.top_road_title h2 {
    margin: 0 auto;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 500;
    text-align: center;
    color: #ffffff;
}

div.top_road_content_area {
    margin: 0 auto;
    padding: 20px 20px;
    border-left: 1px solid #d93924;
    border-right: 1px solid #d93924;
    border-bottom: 1px solid #d93924;
    border-radius: 0 0 10px 10px;
}

div.top_road_content {
    margin: 0 auto 20px;
}

div.top_road_content p {
    margin: 0 auto 20px;
}

div.top_road_content p:last-child {
    margin: 0 auto;
}

div.top_road_content p a {
    color: #116ff7;
    text-decoration: underline;
}

div.top_road_link {
    margin: 0 auto;
    width: 270px;
}

div.top_road_link a {
    margin: 0;
    width: 100%;
    background: #9f4b4d;
    color: #ffffff;
    font-size: 1.6rem;
    line-height: 40px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    display: block;
    border-radius: 20px;
}

div.top_news {
    margin: 0 auto 50px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.top_news_title_area {
    margin: 0 auto;
    padding: 10px 0;
    width: 100%;
    background: #bdb39b;
    border-radius: 10px 10px 0 0;
    display: flex;
    justify-content: space-between;
}

div.top_news_title {
    margin: 0 0 0 25px;
    width: calc(63.3% - 25px);
}

div.top_news_title h2 {
    margin: 0 auto;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 500;
    color: #ffffff;
}

div.top_news_more {
    margin: 0 25px 0 0;
    width: calc(16.6% - 25px);
}

div.top_news_more a {
    margin: 0 auto;
    background: #676666;
    color: #ffffff;
    width: 100%;
    font-size: 1.4rem;
    line-height: 30px;
    text-align: center;
    text-decoration: none;
    display: block;
    border-radius: 15px;
    border: 1px solid #ffffff;
}

div.top_news_content {
    margin: 0 auto;
    padding: 20px 20px;
    background: #f0e4e5;
    width: 100%;
    height: var(--top-news-content-height);
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    border-radius: 0 0 10px 10px;
}

div.top_news_content a, 
div.news_content a {
	display: inline-block;
	font-size:.9em;
	padding-left: .5rem;
}

div.top_news_content a:before, 
div.news_content a:before {
    content:"◆";
}

div.top_news_content p {
	font-size: 1.6rem;
	margin-bottom: 10px;
}

div.top_news_content p:last-child {
    margin-bottom: 0;
}

div.top_news_content p a {
    color: #116ff7;
    text-decoration: none;
}

div.top_news_content p a:hover {
    color: #116ff7;
    text-decoration: underline;
}
div.top_news_content p img {
    vertical-align: middle;
}

.category_oshirase {
    width: 100px;
    background: #4a9162;
    color: #ffffff;
    font-size: 1.4rem;
    line-height: 2.1rem;
    font-weight: 700;
    text-align: center;
    display: inline-block;
}

.category_kisha {
    width: 100px;
    background: #e76437;
    color: #ffffff;
    font-size: 1.4rem;
    line-height: 2.1rem;
    font-weight: 700;
    text-align: center;
    display: inline-block;
}

.news_date {
    font-weight: 700;
}

.icon_kisya, 
.icon_osirase {
	display: block;
	padding-left: 30px;
}
.icon_kisya {
	min-height: 20px;
	background: url("../images/common/icon_kisya.png") left center no-repeat ;
	background-size: 20px;
}
.icon_osirase {
	min-height: 20px;
	background: url("../images/common/icon_osirase.png") left center no-repeat ;
	background-size: 20px;
}
div.top_news_content .icon_kisya {
	background: url("../images/common/icon_kisya.png") left center no-repeat ;
	background-size: 20px;
}
div.top_news_content .icon_osirase {
	background: url("../images/common/icon_osirase.png") left center no-repeat ;
	background-size: 20px;
}

div.top_pickup {
    margin: 0 auto;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.top_pickup h2 {
    margin: 0 auto 20px;
    padding: 12px 0 12px;
    background: linear-gradient(to bottom, #ffffff 0%, #efefef 100%);
    color: #676666;
    font-size: 2.4rem;
    line-height: 3.2rem;
    font-weight: 500;
    text-align: center;
    border-top: 1px solid #bdb39b;
    border-bottom: 1px solid #bdb39b;
}

div.top_pickup h2 i {
    color: #75b5de;
}

div.top_pickup ul {
    margin: 0 auto;
    width: 100%;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}

div.top_pickup ul li {
    margin: 0 0 20px 2%;
    width: 15%;
}

div.top_pickup ul li:nth-child(6n+1) {
    margin: 0 0 20px 0;
}

div.top_pickup ul li img {
    width: 100%;
    height: auto;
}

/*フッター*/
div.foot_menu {
    margin: 0 auto 10px;
    width: 100%;
    text-align: center;
}

div.foot_menu ul {
    margin: 0 auto;
    width: auto;
    display: inline-block;
}

div.foot_menu ul li {
    margin: 0;
    display: inline;
    border-right: 1px solid #676666;
}

div.foot_menu ul li:last-child {
    border-right: none;
}

div.foot_menu ul li a {
    padding: 0 15px;
    color: #676666;
    font-size: 1.4rem;
    line-height: 2.7rem;
    text-decoration: none;
}

div.foot_menu ul li a:hover {
    text-decoration: underline;
}

div.foot_area {
    margin: 0 auto;
    width: 100%;
    background-color: #676666;
}

div.foot {
    margin: 0 auto;
    padding: 10px 0;
    width: 100%;
}

div.foot p {
    margin: 0 auto;
    color: #ffffff;
    font-size: 1.4rem;
    line-height: 2.7rem;
    text-align: center;
}

div.foot p a {
    color: #ffffff;
    text-decoration: none;
}

div.back_to_top {
    position: fixed;
    bottom: 15px;
    right: 30px;
    width: 60px;
    height: 60px;
    z-index: 1000;
}

div.back_to_top img {
    width: 100%;
    height: auto;
}

/*下層ページ*/

div.main_area {
    margin: 0 auto;
    padding: 150px 0 0;
    width: 100%;
}

div.bread_crumb {
    margin: 8px auto 0;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.bread_crumb ul {
    margin: 0 auto;
    width: 100%;
    display: flex;
    justify-content: flex-start;
}

div.bread_crumb ul li {
    font-size: 1.2rem;
    line-height: 2.4rem;
}

div.bread_crumb ul li a {
    color: var(--text-color);
    text-decoration: none;
}

div.bread_crumb ul li a:hover {
    color: var(--text-color);
    text-decoration: underline;
}

div.bread_crumb ul li a:visited {
    color: var(--text-color);
    text-decoration: none;
}

div.page_main {
    margin: 0 auto;
    padding: 12px 0 50px;
    width: 100%;
}

div.page_title {
    margin: 0 auto 30px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.page_title h2 {
    margin: 0 auto;
    padding: 0 0 30px;
    background: url(../images/common/h2_title_bg.png) center bottom no-repeat;
    background-size: 42px;
    font-size: 3.0rem;
    line-height: 3.6rem;
    font-weight: 500;
    text-align: center;
}

div.page_visual {
    margin: 0 auto;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.page_visual img {
    width: 100%;
    height: auto;
}

div.list_page_content_area {
    margin: 0 auto 50px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.list_page_content {
    margin: 0 auto;
    padding: 24px 0;
    border-bottom: 1px dotted var(--line-color-dark);
}

div.list_page_content h3 {
    margin: 0 auto 12px;
}

div.list_page_content h3 a {
    margin: 0 auto;
    padding: 12px 40px;
    background: linear-gradient(to bottom, var(--jimusyo-primary-color) 0%, var(--jimusyo-primary-color-dark) 100%);
    color: #ffffff;
    font-size: 1.8rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    border-radius: 12px;
}

.bousai_page div.list_page_content h3 a {
    background: linear-gradient(to bottom, var(--bousai-primary-color) 0%, var(--bousai-primary-color-dark) 100%);
}

.kasen_page div.list_page_content h3 a {
    background: linear-gradient(to bottom, var(--kasen-primary-color) 0%, var(--kasen-primary-color-dark) 100%);
}

.douro_page div.list_page_content h3 a {
    background: linear-gradient(to bottom, var(--douro-primary-color) 0%, var(--douro-primary-color-dark) 100%);
}

.chiiki_page div.list_page_content h3 a {
    background: linear-gradient(to bottom, var(--chiiki-primary-color) 0%, var(--chiiki-primary-color-dark) 100%);
}

div.list_page_content_box_wrap {
    margin: 0 auto;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

div.list_page_content_box {
    margin: 0;
    width: 40%;
}

div.banner_gounokawa {
    margin: 0;
    width: 58%;
}

div.banner_gounokawa img {
    width: 100%;
    height: auto;
}

div.back_to_home {
    margin: 0 auto;
    width: 240px;
}

div.back_to_home a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--line-color-light);
    display: block;
    border-radius: 25px;
}

div.back_to_home a i {
    color: #75b5de;
}

/*第三層*/

div.page_navigation {
    margin: 0 auto;
    width: 500px;
}

div.page_navigation ul {
    margin: 0 auto;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

div.page_navigation ul li {
    margin: 0;
    width: 49%;
}

div.page_navigation ul li a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--line-color-light);
    display: block;
    border-radius: 25px;
}

div.page_navigation ul li a i {
    color: #75b5de;
}

div.page_navigation ul li.jimusho a i {
    color: var(--jimusyo-deep-color);
}

div.page_navigation ul li.douro a i {
    color: --var(--douro-primary-color);
}

div.page_navigation ul li.chiiki a i {
    color: var(--chiiki-primary-color);
}

/*事業概要*/

div.outline_content {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.outline_content p {
    margin: 0 auto 30px;
    text-align: center;
}

div.outline_panf_image {
    margin: 0 auto 40px;
    width: 94%;
    max-width: 600px;
    text-align: center;
    border: 1px solid var(--line-color-light);
}

div.outline_panf_image img {
    width: 100%;
    height: auto;
}

div.button_outline {
    margin: 0 auto;
    width: 360px;
}

div.button_outline a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--line-color-light);
    display: block;
    border-radius: 25px;
}

div.button_outline a i {
    color: var(--jimusyo-deep-color) ;
}

div.button_outline a:hover {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, var(--jimusyo-deep-color) 0%, var(--jimusyo-deep-color-dark) 100%);
    color: #ffffff;
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--jimusyo-deep-color-dark);
    display: block;
    border-radius: 25px;
}

div.button_outline a:hover i {
    color: #ffffff;
}

div.page_jimusho_main {
    margin: 0 auto 80px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.jimusho_content {
    margin: 0 auto 40px;
}

div.jimusho_content:last-child {
    margin: 0 auto;
}

div.jimusho_content h3 {
    margin: 0 auto 15px;
    padding: 10px 20px;
    background: 
    linear-gradient(to right, transparent 50%, #ffffff 95%),
    repeating-linear-gradient(
        to bottom,
        var(--jimusyo-deep-color) 0px,
        var(--jimusyo-deep-color) 2px,
        var(--jimusyo-deep-color-dark) 2px,
        var(--jimusyo-deep-color-dark) 4px
    );
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 700;
    border-radius: 10px;
    text-shadow: 0px 0px 8px #000000;
}

div.jimusho_content h4 {
    margin: 0 auto 12px;
    padding: 10px 20px;
    background: #bce2ec;
    font-size: 1.8rem;
    line-height: 2.7rem;
    font-weight: 500;
    border-radius: 10px;
}

div.jimusho_content h5 {
    margin: 0 auto 20px;
    padding: 10px 0;
    font-size: 1.8rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: left;
    border-top: 1px dotted var(--line-color-dark);
    border-bottom: 1px dotted var(--line-color-dark);
}

div.jimusho_content h4 i {
    color: var(--jimusyo-deep-color);
}

div.jimusho_content p {
    margin: 0 auto 20px;
}

div.jimusho_content span.underline {
    text-decoration: underline;
}

div.jimusho_content p:last-child {
    margin: 0 auto;
}

div.jimusho_contact_button {
    margin: 0 auto;
    width: 400px;
}

div.jimusho_contact_button a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--line-color-light);
    display: block;
    border-radius: 25px;
}

div.jimusho_contact_button a i {
    color: var(--jimusyo-deep-color);
}

div.jimusho_contact_button a:hover {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, var(--jimusyo-deep-color) 0%, var(--jimusyo-deep-color-dark) 100%);
    color: #ffffff;
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--jimusyo-deep-color-dark);
    display: block;
    border-radius: 25px;
}

div.jimusho_contact_button a:hover i {
    color: #ffffff;
}

div.jimusho_content table.office {
    margin: 0 auto 20px;
    width: 100%;
}

div.jimusho_content table.office th {
    padding: 8px 0;
    width: 320px;
    background: #efefef;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
    border: 1px solid #999999;
}

div.jimusho_content table.office td {
    padding: 8px 16px;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 400;
    text-align: left;
    border: 1px solid #999999;
}

div.jimusho_content table.department {
    margin: 0 auto 40px;
    width: 100%;
}

div.jimusho_content table.department th {
    padding: 8px 0;
    width: 200px;
    background: #efefef;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
    border: 1px solid #999999;
}

div.jimusho_content table.department td {
    padding: 8px 16px;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 400;
    text-align: center;
    border: 1px solid #999999;
}

div.office_photo_wrap {
    margin: 0 auto 60px;
    width: 480px;
    display: flex;
    justify-content: space-between;
}

div.office_photo {
    margin: 30px 0 0 0;
    width: 176px;
}

div.office_photo img {
    width: 100%;
    height: auto;
}

div.office_map {
    margin: 0;
    width: 250px;
}

div.office_map img {
    width: 100%;
    height: auto;
}

div.jimusho_content table.branch {
    margin: 0 auto 30px;
    width: 100%;
}

div.jimusho_content table.branch th {
    padding: 8px 0;
    width: 120px;
    background: #efefef;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
    border: 1px solid #999999;
}

div.jimusho_content table.branch td {
    padding: 8px 16px;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 400;
    text-align: center;
    border: 1px solid #999999;
}

div.jimusho_content table.branch td.address {
    width: 400px;
    text-align: left;
}

div.branch_photo_wrap {
    margin: 0 auto 30px;
    width: 620px;
    display: flex;
    justify-content: space-between;
}

div.branch_photo {
    margin: 30px 0 0 0;
    width: 240px;
}

div.branch_photo img {
    width: 100%;
    height: auto;
}

div.branch_map {
    margin: 0;
    width: 320px;
}

div.branch_map img {
    width: 100%;
    height: auto;
}

div.office_area {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
    display: flex;
    justify-content: space-between;
}

div.office_area_category {
    margin: 0;
    width: 110px;
}

div.office_area_category img {
    width: 100%;
    height: auto;
}

div.office_area_text {
    margin: 36px 0 0 0;
    width: 820px;
}

div.office_area_map {
    margin: 0 auto 80px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.office_area_map h4 {
    margin: 0 auto 20px;
    padding: 10px 0;
    font-size: 2.2rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
    border-top: 1px dotted var(--line-color-dark);
    border-bottom: 1px dotted var(--line-color-dark);
}

div.office_area_map_image {
    margin: 0 auto;
    width: 800px;
}

div.office_area_map_image img {
    width: 100%;
    height: auto;
}

div.organization_unit1 {
    margin: 0 auto 20px;
    padding: 12px 0;
    width: 920px;
    border: 1px solid var(--line-color-dark);
    border-radius: 10px;
}

div.organization_unit1 p {
    margin: 0 auto;
    font-size: 1.8rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
}

div.organization_unit2 {
    margin: 0 auto 20px;
    padding: 12px 0;
    width: 860px;
    border: 1px solid var(--line-color-dark);
    border-radius: 10px;
}

div.organization_unit2 p {
    margin: 0 auto;
    font-size: 1.8rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
}

div.organization_arrow {
    margin: 0 auto 12px;
    width: 80px;
}

div.organization_arrow img {
    width: 100%;
    height: auto;
}

div.jimusho_content table.organization {
    margin: 0 auto;
    width: 100%;
}

div.jimusho_content table.organization thead th {
    padding: 8px 0;
    background: #aad5e6;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
    border: 1px solid var(--line-color-dark);
}

div.jimusho_content table.organization thead th.name {
    width: 25%;
}

div.jimusho_content table.organization thead th.description {
    width: 65%;
}

div.jimusho_content table.organization tbody th {
    padding: 8px 10px;
    background: #efefef;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
    vertical-align: middle;
    border: 1px solid var(--line-color-dark);
}

div.jimusho_content table.organization tbody td {
    padding: 8px 16px;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 400;
    text-align: left;
    border: 1px solid var(--line-color-dark);
}

/*入札契約情報*/

div.bidding_content {
    margin: 0 auto 40px;
}

div.bidding_content:last-child {
    margin: 0 auto;
}

div.bidding_content h3 {
    margin: 0 auto 15px;
    padding: 10px 20px;
    background: 
    linear-gradient(to right, transparent 50%, #ffffff 95%),
    repeating-linear-gradient(
        to bottom,
        var(--jimusyo-deep-color) 0px,
        var(--jimusyo-deep-color) 2px,
        var(--jimusyo-deep-color-dark) 2px,
        var(--jimusyo-deep-color-dark) 4px
    );
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 700;
    border-radius: 10px;
    text-shadow: 0px 0px 8px #000000;
}

div.bidding_content ul {
    margin: 0 auto;
}

div.bidding_content ul li {
    margin: 0 auto 12px;
    font-size: 1.6rem;
    line-height: 2.7rem;
}

div.bidding_content ul li img {
    vertical-align: middle;
}

div.bidding_content ul li:last-child {
    margin: 0 auto;
}

div.bidding_content ul li i {
    color: #75b5de;
}

/*申請・手続き*/

table.application {
    margin: 0 auto 30px;
    width: 100%;
}

table.application th {
    padding: 12px 0;
    width: 220px;
    background: #efefef;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
    border: 1px solid #999999;
}

table.application td {
    padding: 12px 16px;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 400;
    text-align: left;
    border: 1px solid #999999;
}

table.application td img {
    vertical-align: middle;
}

table.application td p {
    margin: 0 auto 20px;
}

table.application td p:last-child {
    margin: 0 auto;
}

table.application td ul.buttons {
    margin: 0;
    width: 660px;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}

table.application td ul.buttons li {
    margin: 0 0 20px 20px;
    width: 320px;
}

table.application td ul.buttons li:nth-child(2n+1) {
    margin: 0 0 20px;
}

table.application td ul.buttons li a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #8dc556 0%, #6ca43f 100%);
    color: #ffffff;
    font-size: 2.0rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border-radius: 10px;
    display: block;
}

/*河川許可申請ガイド*/

div.shinsei2_illust {
    margin: 0 auto 40px;
    width: 400px;
}

div.shinsei2_illust img {
    width: 100%;
    height: auto;
}

div.shinsei3_illust {
    margin: 0 auto 40px;
    width: 495px;
}

div.shinsei3_illust img {
    width: 100%;
    height: auto;
}

table.shinsei_guide {
    margin: 0 auto 30px;
    width: 100%;
}

table.shinsei_guide th {
    padding: 12px 0;
    width: 220px;
    background: #efefef;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
    border: 1px solid #999999;
}

table.shinsei_guide td {
    padding: 12px 16px;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 400;
    text-align: left;
    border: 1px solid #999999;
}

/*資料館*/

div.shiryoukan_content {
    margin: 0 auto 40px;
}

div.shiryoukan_content:last-child {
    margin: 0 auto;
}

div.shiryoukan_content h3 {
    margin: 0 auto 15px;
    padding: 10px 20px;
    background: 
    linear-gradient(to right, transparent 50%, #ffffff 95%),
    repeating-linear-gradient(
        to bottom,
        var(--jimusyo-deep-color) 0px,
        var(--jimusyo-deep-color) 2px,
        var(--jimusyo-deep-color-dark) 2px,
        var(--jimusyo-deep-color-dark) 4px
    );
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 700;
    border-radius: 10px;
    text-shadow: 0px 0px 8px #000000;
}

div.shiryoukan_content p {
    margin: 0 auto 25px;
    text-align: center;
}

div.button_shiryoukan {
    margin: 0 auto;
    width: 320px;
}

div.button_shiryoukan a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--line-color-light);
    display: block;
    border-radius: 25px;
}

div.button_shiryoukan a i {
    color: var(--jimusyo-deep-color);
}

div.button_shiryoukan a:hover {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, var(--jimusyo-deep-color) 0%, var(--jimusyo-deep-color-dark) 100%);
    color: #ffffff;
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--jimusyo-deep-color-dark);
    display: block;
    border-radius: 25px;
}

div.button_shiryoukan a:hover i {
    color: #ffffff;
}

/*空から見た写真集*/

div.photo_river_content {
    margin: 0 auto 40px;
}

div.photo_river_content:last-child {
    margin: 0 auto;
}

div.photo_river_content h3 {
    margin: 0 auto 15px;
    padding: 10px 20px;
    background: 
    linear-gradient(to right, transparent 50%, #ffffff 95%),
    repeating-linear-gradient(
        to bottom,
        var(--jimusyo-deep-color) 0px,
        var(--jimusyo-deep-color) 2px,
        var(--jimusyo-deep-color-dark) 2px,
        var(--jimusyo-deep-color-dark) 4px
    );
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 700;
    border-radius: 10px;
    text-shadow: 0px 0px 8px #000000;
}

div.photo_river_content table {
    margin: 0 auto 30px;
    width: 100%;
}

div.photo_river_content table th {
    padding: 12px 0;
    width: 220px;
    background: #efefef;
    font-size: 1.6rem;
    line-height: 2.4rem;
    font-weight: 500;
    text-align: center;
    border: 1px solid #999999;
}

div.photo_river_content table th span {
    font-size: 1.2rem;
    line-height: 2.1rem;
    font-weight: 400;
    text-align: center;
}

div.photo_river_content table td {
    padding: 12px 16px;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 400;
    text-align: left;
    border: 1px solid #999999;
}

table.application td img {
    vertical-align: middle;
}

div.photo_road_content {
    margin: 0 auto 40px;
}

div.photo_road_content:last-child {
    margin: 0 auto;
}

div.photo_road_content h3 {
    margin: 0 auto 15px;
    padding: 10px 20px;
    background: 
    linear-gradient(to right, transparent 50%, #ffffff 95%),
    repeating-linear-gradient(
        to bottom,
        var(--douro-primary-color) 0px,
        var(--douro-primary-color) 2px,
        var(--douro-primary-color-dark) 2px,
        var(--douro-primary-color-dark) 4px
    );
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 700;
    border-radius: 10px;
    text-shadow: 0px 0px 8px #000000;
}

div.photo_road_content table {
    margin: 0 auto 30px;
    width: 100%;
}

div.photo_road_content table th {
    padding: 12px 0;
    width: 220px;
    background: #efefef;
    font-size: 1.6rem;
    line-height: 2.4rem;
    font-weight: 500;
    text-align: center;
    border: 1px solid #999999;
}

div.photo_road_content table th span {
    font-size: 1.2rem;
    line-height: 2.1rem;
    font-weight: 400;
    text-align: center;
}

div.photo_road_content table td {
    padding: 12px 16px;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 400;
    text-align: left;
    border: 1px solid #999999;
}

/*パンフレット*/

div.pamphlet_content {
    margin: 0 auto 40px;
}

div.pamphlet_content:last-child {
    margin: 0 auto;
}

div.pamphlet_content h3 {
    margin: 0 auto;
    padding: 10px 20px;
    background: 
    linear-gradient(to right, transparent 50%, #ffffff 95%),
    repeating-linear-gradient(
        to bottom,
        var(--jimusyo-deep-color) 0px,
        var(--jimusyo-deep-color) 2px,
        var(--jimusyo-deep-color-dark) 2px,
        var(--jimusyo-deep-color-dark) 4px
    );
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 700;
    border-radius: 10px;
    text-shadow: 0px 0px 8px #000000;
}

div.pamphlet_content dl {
    margin: 0 auto;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px dotted var(--line-color-dark);
}

div.pamphlet_content dl dt {
    margin: 0;
    padding: 15px 0;
    width: 71px;
}

div.pamphlet_content dl dt img {
    width: 100%;
    height: auto;
}

div.pamphlet_content dl dd {
    margin: 0;
    padding: 15px 0;
    width: calc(100% - 90px);
}

div.pamphlet_content dl dd img {
    vertical-align: middle;
}

div.pamphlet_content ul {
    margin: 0 auto;
}

div.pamphlet_content ul li {
    margin: 0 auto;
    padding: 12px 12px;
    border-bottom: 1px dotted var(--line-color-dark);
}

div.pamphlet_content ul li i {
    color: #75b5de;
}

div.pamphlet_content ul li img {
    vertical-align: middle;
}

div.pamphlet_past_content {
    margin: 0 auto 40px;
}

div.pamphlet_past_content:last-child {
    margin: 0 auto;
}

div.pamphlet_past_content h3 {
    margin: 0 auto;
    padding: 10px 20px;
    background: 
    linear-gradient(to right, transparent 50%, #ffffff 95%),
    repeating-linear-gradient(
        to bottom,
        #aeae5d 0px,
        #aeae5d 2px,
        #939249 2px,
        #939249 4px
    );
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 700;
    border-radius: 10px;
    text-shadow: 0px 0px 8px #000000;
}

div.pamphlet_past_content dl {
    margin: 0 auto;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px dotted var(--line-color-dark);
}

div.pamphlet_past_content dl dt {
    margin: 0;
    padding: 15px 0;
    width: 71px;
}

div.pamphlet_past_content dl dt img {
    width: 100%;
    height: auto;
}

div.pamphlet_past_content dl dd {
    margin: 0;
    padding: 15px 0;
    width: calc(100% - 90px);
}

div.pamphlet_past_content dl dd img {
    vertical-align: middle;
}

div.pamphlet_past_content ul {
    margin: 0 auto;
}

div.pamphlet_past_content ul li {
    margin: 0 auto;
    padding: 12px 12px;
    border-bottom: 1px dotted var(--line-color-dark);
}

div.pamphlet_past_content ul li i {
    color: #75b5de;
}

div.pamphlet_content ul li img {
    vertical-align: middle;
}

/*防災情報その他共通*/

div.page_bousai_main {
    margin: 0 auto 80px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.bousai_intro {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.bousai_intro p {
    margin: 0 auto 20px;
}

div.bousai_intro p:last-child {
    margin: 0 auto;
}

div.bousai_content {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.bousai_content h3 {
    margin: 0 auto 15px;
    padding: 10px 20px;
    background: 
    linear-gradient(to right, transparent 50%, #ffffff 95%),
    repeating-linear-gradient(
        to bottom,
        var(--bousai-primary-color) 0px,
        var(--bousai-primary-color) 2px,
        var(--bousai-primary-color-dark) 2px,
        var(--bousai-primary-color-dark) 4px
    );
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 700;
    border-radius: 10px;
    text-shadow: 0px 0px 8px #000000;
}

div.bousai_content ul {
    margin: 0 auto;
    border-top: 1px dotted var(--line-color-dark);
}

div.bousai_content ul li {
    margin: 0 auto;
    padding: 10px 0;
    font-size: 1.6rem;
    line-height: 2.7rem;
    border-bottom: 1px dotted var(--line-color-dark);
}

div.bousai_content ul li i {
    color: var(--bousai-primary-color);
}

/*各段階浸水想定区域図及び水害リスクマップ*/

table.risk1 {
    margin: 0 auto;
    width: 100%;
}

table.risk1 thead th {
    padding: 10px 0;
    background: var(--bousai-primary-color);
    color: #ffffff;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
    border: 1px solid var(--line-color-dark);
}

table.risk1 thead th.cell {
    padding: 10px 0;
    width: calc(100% / 13);
    background: var(--bousai-light-color);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
    border: 1px solid var(--line-color-dark);
}

table.risk1 tbody th {
    padding: 10px 0;
    background: var(--bg-color-gray);
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 400;
    text-align: center;
    border: 1px solid var(--line-color-dark);
}

table.risk1 tbody td {
    padding: 10px 0;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 400;
    text-align: center;
    border: 1px solid var(--line-color-dark);
}

table.risk2 {
    margin: 0 auto;
    width: 100%;
}

table.risk2 thead th {
    padding: 10px 0;
    background: var(--bousai-primary-color);
    color: #ffffff;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
    border: 1px solid var(--line-color-dark);
}

table.risk2 thead th.cell {
    padding: 10px 0;
    width: calc(100% / 10);
    background: var(--bousai-light-color);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
    border: 1px solid var(--line-color-dark);
}

table.risk2 tbody th {
    padding: 10px 0;
    background: var(--bg-color-gray);
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 400;
    text-align: center;
    border: 1px solid var(--line-color-dark);
}

table.risk2 tbody td {
    padding: 10px 0;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 400;
    text-align: center;
    border: 1px solid var(--line-color-dark);
}

/*重要水防箇所*/

div.bousai_page_intro {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
    display: flex;
    justify-content: space-between;
}

div.bousai_page_intro_content {
    margin: 0;
    width: 60%;
}

div.bousai_page_intro h3 {
    margin: 0 auto 15px;
    padding: 10px 20px;
    background: 
    linear-gradient(to right, transparent 50%, #ffffff 95%),
    repeating-linear-gradient(
        to bottom,
        var(--bousai-primary-color) 0px,
        var(--bousai-primary-color) 2px,
        var(--bousai-primary-color-dark) 2px,
        var(--bousai-primary-color-dark) 4px
    );
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 700;
    border-radius: 10px;
    text-shadow: 0px 0px 8px #000000;
}

div.bousai_page_intro p {
    margin: 0 auto 15px;
    vertical-align: middle;
}

div.bousai_page_intro p:last-child {
    margin: 0 auto;
}

div.bousai_page_intro p i {
    color: var(--bousai-primary-color);
}

div.bousai_page_intro ul {
    margin: 0 auto 15px;
    border-top: 1px dotted var(--line-color-dark);
}

div.bousai_page_intro ul:last-child {
    margin: 0 auto;
}

div.bousai_page_intro ul li {
    margin: 0 auto;
    padding: 10px 0;
    font-size: 1.6rem;
    line-height: 2.7rem;
    border-bottom: 1px dotted var(--line-color-dark);
}

div.bousai_page_intro ul li i {
    color: var(--bousai-primary-color);
}

div.bousai_page_intro_illust {
    margin: 0;
    width: 35%;
}

div.bousai_page_intro_illust img {
    width: 100%;
    height: auto;
}

div.bousai_page_content {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.bousai_page_content h3 {
    margin: 0 auto 15px;
    padding: 10px 20px;
    background: 
    linear-gradient(to right, transparent 50%, #ffffff 95%),
    repeating-linear-gradient(
        to bottom,
        var(--bousai-primary-color) 0px,
        var(--bousai-primary-color) 2px,
        var(--bousai-primary-color-dark) 2px,
        var(--bousai-primary-color-dark) 4px
    );
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 700;
    border-radius: 10px;
    text-shadow: 0px 0px 8px #000000;
}

div.bousai_page_content p {
    margin: 0 auto 15px;
    vertical-align: middle;
}

div.bousai_page_content p:last-child {
    margin: 0 auto;
}

div.bousai_page_content p i {
    color: var(--bousai-primary-color);
}

div.bousai_page_content ul {
    margin: 0 auto 15px;
    border-top: 1px dotted var(--line-color-dark);
}

div.bousai_page_content ul:last-child {
    margin: 0 auto;
}

div.bousai_page_content ul li {
    margin: 0 auto;
    padding: 10px 0;
    font-size: 1.6rem;
    line-height: 2.7rem;
    border-bottom: 1px dotted var(--line-color-dark);
}

div.bousai_page_content ul li i {
    color: var(--bousai-primary-color);
}

table.important1 {
    margin: 0 auto;
    width: 100%;
}

table.important1 thead th {
    padding: 10px 0;
    background: var(--bousai-primary-color);
    color: #ffffff;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
    border: 1px solid var(--line-color-dark);
}

table.important1 thead th:first-child {
    width: 20%;
}

table.important1 thead th:last-child {
    width: 20%;
}

table.important1 tbody th {
    padding: 10px 0;
    background: var(--bg-color-gray);
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 400;
    text-align: center;
    border: 1px solid var(--line-color-dark);
    vertical-align: middle;
}

table.important1 tbody td {
    padding: 10px 0;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 400;
    text-align: center;
    border: 1px solid var(--line-color-dark);
    vertical-align: middle;
}

table.important2 {
    margin: 0 auto;
    width: 100%;
}

table.important2 tbody th {
    padding: 10px 0;
    width: 30%;
    background: var(--bg-color-gray);
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 400;
    text-align: center;
    border: 1px solid var(--line-color-dark);
    vertical-align: middle;
}

table.important2 tbody td {
    padding: 10px 20px;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 400;
    text-align: left;
    border: 1px solid var(--line-color-dark);
    vertical-align: middle;
}

table.important2 tbody td i {
    color: var(--bousai-primary-color);
}

/*水防災意識社会再構築ビジョン*/

div.bousai_vision_content {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.bousai_vision_content h3 {
    margin: 0 auto 15px;
    padding: 10px 20px;
    background: 
    linear-gradient(to right, transparent 50%, #ffffff 95%),
    repeating-linear-gradient(
        to bottom,
        var(--bousai-primary-color) 0px,
        var(--bousai-primary-color) 2px,
        var(--bousai-primary-color-dark) 2px,
        var(--bousai-primary-color-dark) 4px
    );
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 700;
    border-radius: 10px;
    text-shadow: 0px 0px 8px #000000;
}

div.bousai_vision_content h4 {
    margin: 0 auto 15px;
    padding: 15px 20px;
    background: var(--bg-color-gray);
    color: var(--text-color);
    font-size: 1.9rem;
    line-height: 2.7rem;
    font-weight: 500;
    border-radius: 10px;
}

div.bousai_vision_content p {
    margin: 0 auto 15px;
    vertical-align: middle;
}

div.bousai_vision_content p:last-child {
    margin: 0 auto;
}

div.bousai_vision_content p i {
    color: var(--bousai-primary-color);
}

div.bousai_vision_content ul {
    margin: 0 auto 30px;
    border-top: 1px dotted var(--line-color-dark);
}

div.bousai_vision_content ul:last-child {
    margin: 0 auto;
}

div.bousai_vision_content ul li {
    margin: 0 auto;
    padding: 10px 0;
    font-size: 1.6rem;
    line-height: 2.7rem;
    border-bottom: 1px dotted var(--line-color-dark);
}

div.bousai_vision_content ul li i {
    color: var(--bousai-primary-color);
}

table.vision1 {
    margin: 0 auto 30px;
    width: 100%;
}

table.vision1 thead th {
    padding: 10px 0;
    width: 40%;
    background: var(--bousai-primary-color);
    color: #ffffff;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
    border: 1px solid var(--line-color-dark);
}

table.vision1 thead th:last-child {
    width: 20%;
}

table.vision1 tbody th {
    padding: 10px 0;
    background: var(--bg-color-gray);
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 400;
    text-align: center;
    border: 1px solid var(--line-color-dark);
    vertical-align: middle;
}

table.vision1 tbody td {
    padding: 10px 0;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 400;
    text-align: center;
    border: 1px solid var(--line-color-dark);
    vertical-align: middle;
}

/*江の川流域の雨量・河川水位*/

div.bousai_river_intro {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
    text-align: center;
}

div.bousai_river_intro p {
    margin: 0 auto 20px;
}

div.bousai_river_intro p:last-child {
    margin: 0 auto;
}

div.bousai_river_map {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
    text-align: center;
}

div.bousai_river_note {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
    text-align: center;
}

div.bousai_river_note p {
    margin: 0 auto 20px;
}

div.bousai_river_note p:last-child {
    margin: 0 auto;
}

/*川づくりその他共通*/

div.page_kasen_main {
    margin: 0 auto 80px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.river_intro {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.river_intro p {
    margin: 0 auto 20px;
}

div.river_intro p:last-child {
    margin: 0 auto;
}

div.river_content {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.river_content h3 {
    margin: 0 auto 20px;
    padding: 10px 20px;
    background: 
    linear-gradient(to right, transparent 50%, #ffffff 95%),
    repeating-linear-gradient(
        to bottom,
        var(--kasen-primary-color) 0px,
        var(--kasen-primary-color) 2px,
        var(--kasen-primary-color-dark) 2px,
        var(--kasen-primary-color-dark) 4px
    );
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 700;
    border-radius: 10px;
    text-shadow: 0px 0px 8px #000000;
}

div.river_content h4 {
    margin: 0 auto 15px;
    padding: 10px 0;
    width: 100%;
    background: var(--bg-color-gray);
    color: var(--text-color);
    font-size: 1.9rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
    border-radius: 10px;
}

div.river_content p {
    margin: 0 auto 30px;
}

div.river_content p:last-child {
    margin: 0 auto;
}

div.river_content ul {
    margin: 0 auto 30px;
    border-top: 1px dotted var(--line-color-dark);
}

div.river_content ul:last-child {
    margin: 0 auto;
}

div.river_content ul li {
    margin: 0 auto;
    padding: 10px 0;
    font-size: 1.6rem;
    line-height: 2.7rem;
    border-bottom: 1px dotted var(--line-color-dark);
}

div.river_content ul li i {
    color: #2d65ab;
}

div.river_shiryoukan_content_area {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.river_shiryoukan_content_area h3 {
    margin: 0 auto 20px;
    padding: 10px 20px;
    background: 
    linear-gradient(to right, transparent 50%, #ffffff 95%),
    repeating-linear-gradient(
        to bottom,
        var(--kasen-primary-color) 0px,
        var(--kasen-primary-color) 2px,
        var(--kasen-primary-color-dark) 2px,
        var(--kasen-primary-color-dark) 4px
    );
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 700;
    border-radius: 10px;
    text-shadow: 0px 0px 8px #000000;
}

div.river_shiryoukan_content {
    margin: 0 auto 30px;
    width: 94%;
    max-width: var(--min-contents-width);
    display: flex;
    justify-content: space-between;
}

div.river_shiryoukan_content div {
    margin: 0;
    width: 45%;
    text-align: center;
}

div.river_shiryoukan_content div h4 {
    margin: 0 auto 15px;
    padding: 10px 0;
    width: 100%;
    background: var(--bg-color-gray);
    color: var(--text-color);
    font-size: 1.9rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
    border-radius: 10px;
}

div.river_shiryoukan_content div img {
    width: auto;
    height: 240px;
}

div.river_shiryoukan_content_photo {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.river_shiryoukan_content_photo h3 {
    margin: 0 auto 15px;
    padding: 10px 20px;
    background: 
    linear-gradient(to right, transparent 50%, #ffffff 95%),
    repeating-linear-gradient(
        to bottom,
        var(--kasen-primary-color) 0px,
        var(--kasen-primary-color) 2px,
        var(--kasen-primary-color-dark) 2px,
        var(--kasen-primary-color-dark) 4px
    );
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 700;
    border-radius: 10px;
    text-shadow: 0px 0px 8px #000000;
}

div.river_shiryoukan_content_photo p {
    margin: 0 auto 20px;
}

/*江ノ川・高津川の水質状況*/

table.river_value {
    margin: 0 auto;
    width: 100%;
}

table.river_value td {
    padding: 10px 10px;
    width: 14%;
    text-align: center;
    vertical-align: middle;
    border: 1px solid var(--line-color-dark);
}

table.river_value td.type {
    width: 5%;
}

table.river_value td.title {
    width: 25%;
}

table.river_value_note {
    margin: 0 auto;
    width: 100%;
}

table.river_value_note td {
    padding: 5px 10px;
    text-align: left;
    vertical-align: middle;
}

table.river_value_note td.title {
    width: 15%;
}

div.river_status_image {
    margin: 0 auto 40px;
    width: 94%;
    max-width: 600px;
}

div.river_status_image img {
    width: 100%;
    height: auto;
}

div.river_value_image {
    margin: 0 auto;
    width: 94%;
    text-align: center;
}

/*環境基準値*/

div.river_status_map_image {
    margin: 0 auto;
    width: 94%;
    text-align: center;
}

/*水質用語解説*/

div.river_word_content {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.river_word_content h3 {
    margin: 0 auto 15px;
    padding: 10px 20px;
    width: 100%;
    background: var(--bg-color-gray);
    color: var(--text-color);
    font-size: 1.9rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: left;
    border-radius: 10px;
}

div.river_word_content p {
    margin: 0 auto 30px;
}

div.river_word_content p:last-child {
    margin: 0 auto;
}

/*江の川の自然*/

div.river_nature_content_image_wrap {
    margin: 0 auto 20px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
    display: flex;
    justify-content: space-between;
}

div.river_nature_content {
    margin: 0;
    width: 70%;
}

div.river_nature_content_image {
    margin: 0;
    width: 28%;
}

div.river_nature_content_image img {
    width: 100%;
    height: auto;
}

/*公募伐採*/

div.koubo_image {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.koubo_image img {
    width: 100%;
    height: auto;
}

/*高津川水系河川整備基本方針*/

div.river_guide_line_button {
    margin: 0 auto 30px;
    width: 360px;
}

div.river_guide_line_button a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--line-color-light);
    display: block;
    border-radius: 25px;
}

div.river_guide_line_button a i {
    color: #2d65ab;
}

div.river_guide_line_button a:hover {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, var(--kasen-primary-color) 0%, var(--kasen-primary-color-dark) 100%);
    color: #ffffff;
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid #006daf;
    display: block;
    border-radius: 25px;
}

div.button_kasen a:hover i {
    color: #ffffff;
}

div.river_guideline_content {
    margin: 0 auto 40px;
    width: 94%;
    max-width: var(--min-contents-width);
}

div.river_guideline_content p {
    margin: 0 auto 30px;
}

div.river_guideline_content p:last-child {
    margin: 0 auto;
    text-align: right;
}

/*30年のあゆみ*/

div.ayumi_title {
    margin: 0 auto 30px;
    padding: 24px 0;
    background: #bdb39b;
    border-radius: 20px;
}

div.ayumi_title h3 {
    margin: 0 auto 5px;
    color: #ffffff;
    font-size: 3.2rem;
    line-height: 4.0rem;
    font-weight: 700;
    text-align: center;
}

div.ayumi_title p {
    margin: 0 auto;
    color: #ffffff;
    font-size: 2.7rem;
    line-height: 3.2rem;
    font-weight: 700;
    text-align: center;
}

div.ayumi_title h3 + p {
    margin: 0 auto 20px;
    color: #ffffff;
    font-size: 2.4rem;
    line-height: 3.2rem;
    font-weight: 700;
    text-align: center;
}

div.ayumi_content {
    margin: 0 auto 30px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.ayumi_content h4 {
    margin: 0 auto;
    padding: 10px 20px;
    background: 
    linear-gradient(to right, transparent 50%, #ffffff 95%),
    repeating-linear-gradient(
        to bottom,
        var(--kasen-primary-color) 0px,
        var(--kasen-primary-color) 2px,
        var(--kasen-primary-color-dark) 2px,
        var(--kasen-primary-color-dark) 4px
    );
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 700;
    border-radius: 10px;
    text-shadow: 0px 0px 8px #000000;
}

div.ayumi_content ul {
    margin: 0 auto;
}

div.ayumi_content ul li {
    margin: 0 auto;
    padding: 20px 12px;
    font-size: 1.6rem;
    line-height: 2.7rem;
    border-bottom: 1px dotted var(--line-color-dark);
}

div.ayumi_content ul li ul {
    margin: 0 auto;
    width: 90%;
    display: flex;
    justify-content: flex-start;
}

div.ayumi_content ul li ul li {
    margin: 0;
    padding: 10px 12px 0 12px;
    width: 24%;
    border-bottom: none;
}

div.ayumi_content ul li i {
    color: #2d65ab;
}

div.button_kasen {
    margin: 0 auto;
    width: 360px;
}

div.button_kasen a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--line-color-light);
    display: block;
    border-radius: 25px;
}

div.button_kasen a i {
    color: #2d65ab;
}

div.button_kasen a:hover {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, var(--kasen-primary-color) 0%, var(--kasen-primary-color-dark) 100%);
    color: #ffffff;
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid #006daf;
    display: block;
    border-radius: 25px;
}

div.button_kasen a:hover i {
    color: #ffffff;
}

div.button_kasen_shiryoukan {
    margin: 0 auto 30px;
    width: 360px;
}

div.button_kasen_shiryoukan a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--line-color-light);
    display: block;
    border-radius: 25px;
}

div.button_kasen_shiryoukan a i {
    color: #2d65ab;
}

div.button_kasen_shiryoukan a:hover {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, var(--kasen-primary-color) 0%, var(--kasen-primary-color-dark) 100%);
    color: #ffffff;
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid #006daf;
    display: block;
    border-radius: 25px;
}

div.button_kasen_shiryoukan a:hover i {
    color: #ffffff;
}

/*道づくり*/

div.page_douro_main {
    margin: 0 auto 80px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

/*ビジョン*/

div.vision_content {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.vision_content p {
    margin: 0 auto 30px;
    text-align: center;
}

div.button_vision {
    margin: 0 auto;
    width: 360px;
}

div.button_vision a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--line-color-light);
    display: block;
    border-radius: 25px;
}

div.button_vision a i {
    color: #66b149;
}

div.button_vision a:hover {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, var(--douro-primary-color) 0%, var(--douro-primary-color-dark) 100%);
    color: #ffffff;
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid #006daf;
    display: block;
    border-radius: 25px;
}

div.button_vision a:hover i {
    color: #ffffff;
}

/*道づくりその他共通*/

div.road_intro {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.road_intro p {
    margin: 0 auto 20px;
}

div.road_intro p:last-child {
    margin: 0 auto;
}

div.road_intro_center {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.road_intro_center p {
    margin: 0 auto 20px;
    text-align: center;
}

div.road_intro_center p:last-child {
    margin: 0 auto;
}

div.road_content {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.road_content h3 {
    margin: 0 auto 15px;
    padding: 10px 20px;
    background: 
    linear-gradient(to right, transparent 50%, #ffffff 95%),
    repeating-linear-gradient(
        to bottom,
        var(--douro-primary-color) 0px,
        var(--douro-primary-color) 2px,
        var(--douro-primary-color-dark) 2px,
        var(--douro-primary-color-dark) 4px
    );
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 700;
    border-radius: 10px;
    text-shadow: 0px 0px 8px #000000;
}

div.road_content ul {
    margin: 0 auto;
    border-top: 1px dotted var(--line-color-dark);
}

div.road_content ul li {
    margin: 0 auto;
    padding: 10px 0;
    font-size: 1.6rem;
    line-height: 2.7rem;
    border-bottom: 1px dotted var(--line-color-dark);
}

div.road_content ul li i {
    color: #66b149;
}

div.road_content p {
    margin: 0 auto 20px;
}

div.road_content p:last-child {
    margin: 0 auto;
}

div.sanindou_content {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.sanindou_content h3 {
    margin: 0 auto 15px;
    padding: 10px 20px;
    background: 
    linear-gradient(to right, transparent 50%, #ffffff 95%),
    repeating-linear-gradient(
        to bottom,
        var(--douro-primary-color) 0px,
        var(--douro-primary-color) 2px,
        var(--douro-primary-color-dark) 2px,
        var(--douro-primary-color-dark) 4px
    );
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 700;
    border-radius: 10px;
    text-shadow: 0px 0px 8px #000000;
}

div.sanindou_content ul {
    margin: 0 auto;
    border-top: 1px dotted var(--line-color-dark);
}

div.sanindou_content ul li {
    margin: 0 auto;
    padding: 10px 0;
    font-size: 1.6rem;
    line-height: 2.7rem;
    border-bottom: 1px dotted var(--line-color-dark);
}

div.sanindou_content ul li i {
    color: #66b149;
}

div.sanindou_content dl {
    margin: 0 auto;
    padding: 10px 0;
    border-bottom: 1px dotted var(--line-color-dark);
    display: flex;
    justify-content: space-between;
}

div.sanindou_content dl + ul {
    border-top: none;
}

div.sanindou_content dl dt {
    margin: 0;
    width: 200px;
}

div.sanindou_content dl dt i {
    color: #66b149;
}

div.sanindou_content dl dd {
    margin: 0;
    width: calc(100% - 200px);
}

div.sanindou_banner {
    margin: 0 auto 40px;
    width: 420px;
}

div.sanindou_banner ul {
    margin: 0 auto;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

div.sanindou_banner ul li {
    margin: 0;
    width: 48%;
}

div.sanindou_banner ul li img {
    width: 100%;
    height: auto;
}

div.road_ledger_content {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.road_ledger_content h3 {
    margin: 0 auto;
    padding: 10px 20px;
    background: 
    linear-gradient(to right, transparent 50%, #ffffff 95%),
    repeating-linear-gradient(
        to bottom,
        var(--douro-primary-color) 0px,
        var(--douro-primary-color) 2px,
        var(--douro-primary-color-dark) 2px,
        var(--douro-primary-color-dark) 4px
    );
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 700;
    border-radius: 10px;
    text-shadow: 0px 0px 8px #000000;
}

div.road_ledger_content h4 {
    margin: 0 auto;
    padding: 10px 20px;
    font-size: 1.9rem;
    line-height: 3.2rem;
    font-weight: 700;
    border-top: 1px dotted var(--line-color-dark);
    border-bottom: 1px dotted var(--line-color-dark);
}

div.road_ledger_content h3 + h4 {
    border-top: none;
}

div.road_ledger_content ul {
    margin: 0 auto;
}

div.road_ledger_content ul li {
    margin: 0 auto;
    padding: 10px 0;
    font-size: 1.6rem;
    line-height: 2.7rem;
    border-bottom: 1px dotted var(--line-color-dark);
}

div.road_ledger_content ul li i {
    color: #66b149;
}

div.road_ledger_content p {
    margin: 15px auto 0;
}

div.road_ledger_button {
    margin: 0 auto 40px;
    width: 320px;
}

div.road_ledger_button a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--line-color-light);
    display: block;
    border-radius: 25px;
}

div.road_ledger_button a i {
    color: var(--douro-primary-color-dark);
}

div.road_ledger_button a:hover {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, var(--douro-primary-color) 0%, var(--douro-primary-color-dark) 100%);
    color: #ffffff;
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--douro-primary-color-dark);
    display: block;
    border-radius: 25px;
}

div.road_ledger_button a:hover i {
    color: #ffffff;
}

/*つなげよう山陰道*/

div.road_tsunage_box {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.road_tsunage_box h3 {
    margin: 0 auto 15px;
    padding: 10px 20px;
    width: 100%;
    background: var(--bg-color-gray);
    color: var(--text-color);
    font-size: 1.9rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: left;
    border-radius: 10px;
}

div.road_tsunage_content_area {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
    display: flex;
    justify-content: space-between;
}

div.road_tsunage_content_image {
    margin: 0;
    width: 30%;
    text-align: center;
}

div.road_tsunage_content_image img {
    width: 100%;
    max-height: 200px;
    object-fit: contain;
}

div.road_tsunage_content_text {
    margin: 0;
    width: 65%;
}

div.road_tsunage_content_text p {
    margin: 0 auto 20px;
}

div.road_tsunage_content_text p:last-child {
    margin: 0 auto 20px;
}

/*空撮動画*/

div.road_movie_intro  {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
    text-align: center;
}

div.road_movie_intro p  {
    margin: 0 auto 20px;
}

div.road_movie_intro p:last-child  {
    margin: 0 auto;
}

div.road_movie_content  {
    margin: 0 auto 40px;
    width: 94%;
    max-width: 560px;
    text-align: center;
}

div.road_movie_content img  {
    width: 100%;
    height: auto;
}

div.road_movie_info {
    margin: 0 auto 20px;
    padding: 20px 0;
    background: var(--bg-color-gray);
    width: 94%;
    max-width: 640px;
    text-align: center;
}

div.road_movie_info h3 {
    margin: 0 auto 20px;
    font-size: 2.0rem;
    font-weight: 700;
}

div.road_movie_info h3 span {
    font-size: 1.2rem;
}

div.road_movie_info p {
    margin: 0 auto 20px;
}

div.road_movie_info p:last-child {
    margin: 0 auto;
}

div.road_movie_button {
    margin: 0 auto 40px;
    width: 240px;
}

div.road_movie_button a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--line-color-light);
    display: block;
    border-radius: 25px;
}

div.road_movie_button a i {
    color: var(--douro-primary-color-dark);
}

div.road_movie_button a:hover {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, var(--douro-primary-color) 0%, var(--douro-primary-color-dark) 100%);
    color: #ffffff;
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--douro-primary-color-dark);
    display: block;
    border-radius: 25px;
}

div.road_movie_button a:hover i {
    color: #ffffff;
}

/*DX*/

div.road_dx_index_wrap {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

div.road_dx_index {
    margin: 0;
    width: 70%;
}

div.road_dx_index ul {
    margin: 0 auto;
    border-top: 1px dotted var(--line-color-dark);
}

div.road_dx_index ul li {
    margin: 0 auto;
    padding: 10px 0;
    font-size: 1.6rem;
    line-height: 2.7rem;
    border-bottom: 1px dotted var(--line-color-dark);
}

div.road_dx_index ul li i {
    color: #66b149;
}

div.road_dx_index_logo {
    margin: 0;
    width: 28%;
}

div.road_dx_index_logo img {
    width: 100%;
    height: auto;
}

div.road_dx_image {
    margin: 0 auto 40px;
    width: 94%;
    max-width: var(--min-contents-width);
}

div.road_dx_image img {
    width: 100%;
    height: auto;
}

div.road_dx_movie_content {
    margin: 0 auto 40px;
    width: 94%;
    max-width: var(--max-contents-width);
    min-width: var(--min-contents-width);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

div.road_dx_movie {
    margin: 0;
    width: 50%;
}

div.road_dx_movie_info {
    margin: 0 auto 20px;
    padding: 20px 0;
    background: var(--bg-color-gray);
    width: 40%;
    text-align: center;
}

/*安心・安全の道づくり*/

div.bousai_photo {
    margin: 0 auto 40px;
    width: 94%;
    max-width: 540px;
    display: flex;
    justify-content: space-between;
}

div.bousai_photo_l {
    margin: 0;
    width: 60%;
}

div.bousai_photo_l img {
    width: 100%;
    height: auto;
}

div.bousai_photo_l ul {
    margin: 0 auto;
}

div.bousai_photo_l ul li {
    margin: 0 auto 20px;
}

div.bousai_photo_r {
    margin: 0;
    width: 34%;
}

div.bousai_photo_r img {
    width: 100%;
    height: auto;
}



/*三隅・益田道路だより*/

div.road_button {
    margin: 0 auto 40px;
    width: 400px;
}

div.road_button a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--line-color-light);
    display: block;
    border-radius: 25px;
}

div.road_button a i {
    color: var(--douro-primary-color-dark);
}

div.road_button a:hover {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, var(--douro-primary-color) 0%, var(--douro-primary-color-dark) 100%);
    color: #ffffff;
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--douro-primary-color-dark);
    display: block;
    border-radius: 25px;
}

div.road_button a:hover i {
    color: #ffffff;
}


/*地域づくり*/

div.page_chiiki_main {
    margin: 0 auto 80px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.engumi_panf_button {
    margin: 0 auto 40px;
    width: 320px;
}

div.engumi_panf_button a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--line-color-light);
    display: block;
    border-radius: 25px;
}

div.engumi_panf_button a i {
    color: var(--chiiki-primary-color-dark);
}

div.engumi_panf_button a:hover {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, var(--chiiki-primary-color) 0%, var(--chiiki-primary-color-dark) 100%);
    color: #ffffff;
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--chiiki-primary-color-dark);
    display: block;
    border-radius: 25px;
}

div.engumi_panf_button a:hover i {
    color: #ffffff;
}

div.chiiki_content {
    margin: 0 auto 40px;
}

div.chiiki_content:last-child {
    margin: 0 auto;
}

div.chiiki_content h3 {
    margin: 0 auto 15px;
    padding: 10px 20px;
    background: 
    linear-gradient(to right, transparent 50%, #ffffff 95%),
    repeating-linear-gradient(
        to bottom,
        var(--chiiki-primary-color) 0px,
        var(--chiiki-primary-color) 2px,
        var(--chiiki-primary-color-dark) 2px,
        var(--chiiki-primary-color-dark) 4px
    );
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 700;
    border-radius: 10px;
    text-shadow: 0px 0px 8px #000000;
}

div.chiiki_content h4 {
    margin: 0 auto 20px;
    padding: 10px 20px;
    border-top: 1px dotted var(--line-color-dark);
    border-bottom: 1px dotted var(--line-color-dark);
    font-size: 1.8rem;
    line-height: 2.7rem;
    font-weight: 500;
}

div.chiiki_content h4 i {
    color: var(--chiiki-primary-color);
}

div.chiiki_content p {
    margin: 0 auto 15px;
}

div.chiiki_content p:last-child {
    margin: 0 auto;
}

div.engumi_photo {
    margin: 0 auto 40px;
    width: 920px;
}

div.engumi_photo ul {
    margin: 0 auto;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

div.engumi_photo ul li:first-child {
    margin: 0;
    width: 400px;
}

div.engumi_photo ul li:last-child {
    margin: 0;
    width: 500px;
}

div.engumi_photo ul li img {
    width: 100%;
    height: auto;
}

div.chiiki_content table.engumi {
    margin: 0 auto;
    width: 100%;
}

div.chiiki_content table.engumi thead th {
    padding: 8px 0;
    background: var(--chiiki-light-color);
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
    border: 1px solid var(--line-color-dark);
}

div.chiiki_content table.engumi thead th.name {
    width: 35%;
}

div.chiiki_content table.engumi thead th.number {
    width: 15%;
}

div.chiiki_content table.engumi thead th.place {
    width: 50%;
}

div.chiiki_content table.engumi tbody td {
    padding: 8px 16px;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 400;
    text-align: center;
    border: 1px solid var(--line-color-dark);
}

div.about_vsp_intro {
    margin: 0 auto 40px;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

div.about_vsp_intro_content {
    margin: 0;
    width: 500px;
}

div.vsp_dayori_button {
    margin: 0 0;
    width: 320px;
}

div.vsp_dayori_button a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--line-color-light);
    display: block;
    border-radius: 25px;
}

div.vsp_dayori_button a i {
    color: var(--chiiki-primary-color);
}

div.vsp_dayori_button a:hover {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, var(--chiiki-primary-color) 0%, var(--chiiki-primary-color-dark) 100%);
    color: #ffffff;
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--chiiki-primary-color-dark);
    display: block;
    border-radius: 25px;
}

div.vsp_dayori_button a:hover i {
    color: #ffffff;
}

div.about_vsp_intro_mark {
    margin: 0;
    width: 400px;
}

div.about_vsp_intro_mark img {
    width: 100%;
    height: auto;
}

div.chiiki_content table.volunteer {
    margin: 0 auto;
    width: 100%;
}

div.chiiki_content table.volunteer thead th {
    padding: 8px 0;
    background: var(--chiiki-light-color);
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
    border: 1px solid var(--line-color-dark);
}

div.chiiki_content table.volunteer thead th.name {
    width: 60%;
}

div.chiiki_content table.volunteer thead th.number {
    width: 15%;
}

div.chiiki_content table.volunteer thead th.date {
    width: 25%;
}

div.chiiki_content table.volunteer tbody td {
    padding: 8px 16px;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 400;
    text-align: center;
    border: 1px solid var(--line-color-dark);
}

/*VSPだより*/

div.vsp_dayori_intro {
    margin: 0 auto 50px;
    width: 100%;
}

div.vsp_dayori_intro p {
    margin: 0 auto;
    text-align: center;
}

div.vsp_dayori_list {
    margin: 0 auto;
    width: 540px;
}

div.vsp_dayori_list ul {
    margin: 0 auto;
    width: 100%;
    border-top: 1px dotted var(--line-color-dark);
}

div.vsp_dayori_list ul li {
    margin: 0 auto;
    padding: 10px 20px;
    border-bottom: 1px dotted var(--line-color-dark);
}

div.vsp_dayori_list ul li i {
    color: var(--chiiki-primary-color);
}

/*GOUP作戦*/

div.goup_logo {
    margin: 0 auto 40px;
    width: 180px;
}

div.goup_logo img {
    width: 100%;
    height: auto;
}

div.goup_map {
    margin: 0 auto 40px;
    width: 100%;
}

div.goup_map h4 {
    margin: 0 auto 15px;
    padding: 10px 20px;
    border-top: 1px dotted var(--line-color-dark);
    border-bottom: 1px dotted var(--line-color-dark);
    font-size: 1.8rem;
    line-height: 2.7rem;
    font-weight: 500;
}

div.goup_report {
    margin: 0 auto 60px;
    width: 100%;
}

div.goup_report h4 {
    margin: 0 auto 20px;
    color: #01608c;
    font-size: 1.8rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
}

div.goup_report_image {
    margin: 0 auto;
    width: 640px;
}

div.goup_report_image img {
    width: 100%;
    height: auto;
}

div.chiiki_content table.goup {
    margin: 0 auto;
    width: 100%;
}

div.chiiki_content table.goup thead th {
    padding: 8px 0;
    background: var(--chiiki-light-color);
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
    border: 1px solid var(--line-color-dark);
}

div.chiiki_content table.goup thead th.date {
    width: 20%;
}

div.chiiki_content table.goup thead th.place {
    width: 24%;
}

div.chiiki_content table.goup thead th.member {
    width: 56%;
}

div.chiiki_content table.goup tbody td {
    padding: 8px 16px;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 400;
    text-align: center;
    border: 1px solid var(--line-color-dark);
}

div.chiiki_content table.goup tbody td.member {
    text-align: left;
}

/*ゴミマップ*/

div.gomimap_map_area {
    margin: 0 auto 40px;
    width: 100%;
}

div.gomimap_map_area p {
    margin: 0 auto 20px;
    color: #01608c;
    font-size: 1.8rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
}

div.page_chiiki_main div.gomimap_map_area h3 {
    margin: 0 auto 15px;
    padding: 10px 0;
    background: var(--chiiki-primary-color-dark);
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 700;
    text-align: center;
    border-radius: 10px;
}

div.gomimap_image {
    margin: 0 auto;
    width: 499px;
}

div.gomimap_image img {
    width: 100%;
    height: auto;
}

div.gomimap_spot {
    margin: 0 auto 40px;
    width: 100%;
}

div.gomimap_spot h4 {
    margin: 0 auto 10px;
    padding: 10px 20px;
    border-top: 1px dotted var(--line-color-dark);
    border-bottom: 1px dotted var(--line-color-dark);
    font-size: 1.8rem;
    line-height: 2.7rem;
    font-weight: 500;
}

div.gomimap_spot h4 i {
    color: var(--chiiki-primary-color-dark);
}

/*夢街道ルネサンスとは*/

div.renaissance_logo {
    margin: 0 auto 40px;
    width: 140px;
}

div.renaissance_logo img {
    width: 100%;
    height: auto;
}

div.renaissance_intro {
    margin: 0 auto 40px;
    width: 100%;
}

div.renaissance_intro p {
    margin: 0 auto 20px;
}

div.renaissance_intro p:last-child {
    margin: 0 auto;
}

div.renaissance_spot {
    margin: 0 auto 40px;
    width: 100%;
}

div.renaissance_spot h3 {
    margin: 0 auto 15px;
    padding: 10px 20px;
    border-top: 1px dotted var(--line-color-dark);
    border-bottom: 1px dotted var(--line-color-dark);
    font-size: 1.8rem;
    line-height: 2.7rem;
    font-weight: 500;
}

div.renaissance_spot h3 i {
    color: var(--chiiki-primary-color-dark);
}

div.renaissance_spot p {
    margin: 0 auto 25px;
    width: 100%;
}

div.renaissance_spot p:last-child {
    margin: 0 auto;
}

div.renaissance_spot_photo {
    margin: 0 auto;
    width: 540px;
}

div.renaissance_spot_photo img {
    width: 100%;
    height: auto;
}

div.renaissance_spot div.renaissance_spot_photo p {
    margin: 20px auto 0;
    text-align: center;
}

div.renaissance_link_area {
    margin: 0 auto;
    padding: 40px 0 0;
    width: 100%;
    border-top: 1px dotted var(--line-color-dark);
}

div.renaissance_link_button {
    margin: 0 auto 40px;
    width: 420px;
}

div.renaissance_link_button a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--line-color-light);
    display: block;
    border-radius: 25px;
}

div.renaissance_link_button a i {
    color: var(--chiiki-primary-color-dark);
}

div.renaissance_link_button a:hover {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, var(--chiiki-primary-color) 0%, var(--chiiki-primary-color-dark) 100%);
    color: #ffffff;
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--chiiki-primary-color-dark);
    display: block;
    border-radius: 25px;
}

div.renaissance_link_button a:hover i {
    color: #ffffff;
}

/*川と道の出前講座*/

div.seminar_link_button {
    margin: 0 auto 40px;
    width: 420px;
}

div.seminar_link_button a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--line-color-light);
    display: block;
    border-radius: 25px;
}

div.seminar_link_button a i {
    color: var(--chiiki-primary-color-dark);
}

div.seminar_link_button a:hover {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, var(--chiiki-primary-color) 0%, var(--chiiki-primary-color-dark) 100%);
    color: #ffffff;
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--chiiki-primary-color-dark);
    display: block;
    border-radius: 25px;
}

div.seminar_link_button a:hover i {
    color: #ffffff;
}

div.chiiki_content h4.application {
    margin: 30px auto 5px;
    padding: 0;
    border-top: none;
    border-bottom: none;
    font-size: 1.8rem;
    line-height: 2.7rem;
    font-weight: 500;
}

div.chiiki_content table.seminar {
    margin: 0 auto 20px;
    width: 100%;
}

div.chiiki_content table.seminar thead th {
    padding: 8px 0;
    background: var(--chiiki-light-color);
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
    border: 1px solid var(--line-color-dark);
}

div.chiiki_content table.seminar thead th.name {
    width: 30%;
}

div.chiiki_content table.seminar thead th.content {
    width: 54%;
}

div.chiiki_content table.seminar thead th.target {
    width: 16%;
}

div.chiiki_content table.seminar tbody td {
    padding: 8px 0;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 400;
    text-align: center;
    border: 1px solid var(--line-color-dark);
}

/*その他ページ*/

div.page_other_main {
    margin: 0 auto 80px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

/*お問い合わせ*/

div.inquiry_content {
    margin: 0 auto 50px;
    width: 100%;
}

div.inquiry_content h3 {
    margin: 0 auto 30px;
    padding: 0 0 0 100px;
    font-size: 2.1rem;
    line-height: 80px;
    font-weight: 500;
    border-top: 1px dotted var(--line-color-dark);
    border-bottom: 1px dotted var(--line-color-dark);
}

div.inquiry_link2 {
    margin: 0 auto;
    width: 440px;
}

div.inquiry_link2 ul {
    margin: 0 auto;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

div.inquiry_link2 ul li {
    margin: 0;
}

div.inquiry_link2 ul li.button {
    width: 240px;
}

div.inquiry_link2 ul li.button a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 52px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--line-color-light);
    display: block;
    border-radius: 25px;
}

div.inquiry_link2 ul li.button a i {
    color: #5f67ae;
}

div.inquiry_link2 ul li.button a:hover {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #5f67ae 0%, #4653a2 100%);
    color: #ffffff;
    font-size: 1.6rem;
    line-height: 52px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid #4653a2;
    display: block;
    border-radius: 25px;
}

div.inquiry_link2 ul li.button a:hover i {
    color: #ffffff;
}

div.inquiry_link2 ul li.banner {
    width: 180px;
}

div.inquiry_link2 ul li.banner img {
    width: 100%;
    height: auto;
}


div.inquiry_link {
    margin: 0 auto;
    width: 240px;
}

div.inquiry_link a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--line-color-light);
    display: block;
    border-radius: 25px;
}

div.inquiry_link  a i {
    color: #5f67ae;
}

div.inquiry_link a:hover {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #5f67ae 0%, #4653a2 100%);
    color: #ffffff;
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid #4653a2;
    display: block;
    border-radius: 25px;
}

div.inquiry_link a:hover i {
    color: #ffffff;
}

div.inquiry_form_link_area {
    margin: 0 auto;
    padding: 40px 0 0;
    width: 100%;
    border-top: 1px dotted var(--line-color-dark);
}

div.inquiry_form_link {
    margin: 0 auto;
    width: 480px;
}

div.inquiry_form_link a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #f3994f 0%, #ed6d1f 100%);
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 80px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid #ed6d1f;
    display: block;
    border-radius: 25px;
}

div.inquiry_form_link  a i {
    color: #ffffff;
}

div.inquiry_form_link a:hover {
    background: linear-gradient(to bottom, #ed6d1f 0%, #ea5504 100%);
    color: #ffffff;
    border: 1px solid #ea5504;
}

div.inquiry_form_link a:hover i {
    color: #ffffff;
}

/*お問い合わせフォーム*/

div.form_intro {
    margin: 0 auto 30px;
    width: 100%;
}

div.form_intro p {
    margin: 0 auto 20px;
}

div.form_intro p.txt_red {
    margin: 0 auto;
    color: #ca3a28;
}

div.form_content {
    margin: 0 auto;
    width: 100%;
}

div.form_content p {
    margin: 0 auto 20px;
    text-align: center;
}

div.form_content table {
    margin: 0 auto 20px;
    width: 100%;
}

div.form_content table th {
    padding: 12px 0;
    width: 240px;
    background: #efefef;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
    vertical-align: middle;
    border: 1px solid #999999;
}

div.form_content table th .required {
    color: #ca3a28;
    font-weight: 700;
}

div.form_content table td {
    padding: 12px 16px;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 400;
    text-align: left;
    border: 1px solid #999999;
}

div.form_content table td input[type="text"] {
    padding: 0 10px;
    width: 100%;
    background-color: #ffffff;
    font-size: 1.6rem;
    line-height: 40px;
    border: 1px solid #dddddd;
    border-radius: 4px;
    box-shadow: 1px 1px 3px rgba(0,0,0,.1) inset;
}

div.form_content table td textarea {
    padding: 0 10px;
    width: 100%;
    background-color: #ffffff;
    font-size: 1.6rem;
    line-height: 2.7rem;
    border: 1px solid #dddddd;
    border-radius: 4px;
    box-shadow: 1px 1px 3px rgba(0,0,0,.1) inset;
}

div.form_button {
    margin: 0 auto;
    width: 420px;
}

div.form_button ul {
    margin: 0 auto;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

div.form_button ul li {
    margin: 0;
    width: 200px;
}

div.form_button ul li input[type="submit"], div.form_button ul li input[type="reset"]  {
    padding: 0 10px;
    width: 100%;
    background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%);
    font-size: 2.0rem;
    line-height: 50px;
    text-align: center;
    border: 1px solid var(--line-color-light);
    border-radius: 4px;
}

/*リンク集*/

div.link_content {
    margin: 0 auto 35px;
    padding: 0 0 35px;
    width: 100%;
    border-bottom: 1px dotted var(--line-color-dark);
}

div.link_title_button {
    margin: 0 auto 20px;
    width: 320px;
}

div.link_title_button a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #5f67ae 0%, #4653a2 100%);
    color: #ffffff;
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid #4653a2;
    display: block;
    border-radius: 25px;
}

div.link_title_button a i {
    color: #ffffff;
}

div.link_title_button a:hover {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #4653a2 0%, #2c4198 100%);
    color: #ffffff;
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid #2c4198;
    display: block;
    border-radius: 25px;
}

div.link_title_button a:hover i {
    color: #ffffff;
}

div.link_content p {
    margin: 0 auto;
    text-align: center;
}

div.link_content1 {
    margin: 0 auto 50px;
    width: 100%;
}

div.link_content1 h3 {
    margin: 0 auto 20px;
    padding: 10px 20px;
    background: #2c0658;
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 500;
    text-align: center;
    border-radius: 10px;
}

div.link_content_list {
    margin: 0 auto;
    width: 100%;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}

div.link_content_list dl {
    margin: 0 0 20px 2%;
    width: 49%;
}

div.link_content_list dl:nth-child(2n+1) {
    margin: 0 0 20px 0;
}

div.link_content_list dl dt {
    margin: 0 auto 2px;
    font-size: 1.6rem;
    line-height: 2.7rem;
    font-weight: 500;
}

div.link_content_list dl dd {
    margin: 0 auto;
    padding: 0 0 0 20px;
    font-size: 1.4rem;
    line-height: 2.7rem;
    font-weight: 400;
}

div.link_content2 {
    margin: 0 auto 25px;
    padding: 0 0 10px;
    width: 100%;
    border-bottom: 1px dotted var(--line-color-dark);
}

div.link_content2 h3 {
    margin: 0 auto 20px;
    padding: 10px 20px;
    background: #2c2d8a;
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 500;
    text-align: center;
    border-radius: 10px;
}

div.link_content2 h4 {
    margin: 0 auto 15px;
    color: #fc7826;
    font-size: 1.8rem;
    line-height: 2.7rem;
    font-weight: 500;
}

div.link_content3 {
    margin: 0 auto 25px;
    padding: 0 0 10px;
    width: 100%;
    border-bottom: 1px dotted var(--line-color-dark);
}

div.link_content3 h3 {
    margin: 0 auto 20px;
    padding: 10px 20px;
    background: #3c79eb;
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 500;
    text-align: center;
    border-radius: 10px;
}

div.link_content4 {
    margin: 0 auto 50px;
    width: 100%;
}

div.link_content4 h3 {
    margin: 0 auto 20px;
    padding: 10px 20px;
    background: #2c0658;
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 500;
    text-align: center;
    border-radius: 10px;
}

div.link_content5 {
    margin: 0 auto 50px;
    width: 100%;
}

div.link_content5 h3 {
    margin: 0 auto 20px;
    padding: 10px 20px;
    background: #2c2d8a;
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 500;
    text-align: center;
    border-radius: 10px;
}

div.link_content6 {
    margin: 0 auto 50px;
    width: 100%;
}

div.link_content6 h3 {
    margin: 0 auto 20px;
    padding: 10px 20px;
    background: #3c79eb;
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 500;
    text-align: center;
    border-radius: 10px;
}

div.link_content7 {
    margin: 0 auto 50px;
    width: 100%;
}

div.link_content7 h3 {
    margin: 0 auto 20px;
    padding: 10px 20px;
    background: #50baeb;
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 500;
    text-align: center;
    border-radius: 10px;
}

div.link_content8 {
    margin: 0 auto 50px;
    width: 100%;
}

div.link_content8 h3 {
    margin: 0 auto 20px;
    padding: 10px 20px;
    background: #6a71ae;
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 500;
    text-align: center;
    border-radius: 10px;
}

div.room_content {
    margin: 0 auto 50px;
    width: 100%;
}

div.room_content h3 {
    margin: 0 auto 10px;
    padding: 10px 20px;
    background: 
    linear-gradient(to right, transparent 50%, #ffffff 95%),
    repeating-linear-gradient(
        to bottom,
        var(--other-deep-color) 0px,
        var(--other-deep-color) 2px,
        var(--other-deep-color-dark) 2px,
        var(--other-deep-color-dark) 4px
    );
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 700;
    border-radius: 10px;
    text-shadow: 0px 0px 8px #000000;
}

div.room_content ul {
    margin: 0 auto;
}

div.room_content ul li {
    margin: 0 auto;
    padding: 10px 0;
    font-size: 1.6rem;
    line-height: 2.7rem;
}

div.room_content ul li ul {
    margin: 0 0 0 30px;
}

div.room_content ul li ul li {
    margin: 0 auto;
    padding: 10px 0 0;
}

div.room_content ul li img {
    display: inline-block;
    vertical-align: middle;
}

div.room_content ul li i {
    color: #bdb39b;
}

div.room_contact {
    margin: 0 auto 50px;
    padding: 0 0 30px;
    width: 480px;
    border: 1px solid var(--line-color-dark);
}

div.room_contact h4 {
    margin: 0 auto 30px;
    padding: 20px 20px;
    background: var(--other-deep-color);
    color: #ffffff;
    font-size: 1.8rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
}

div.room_contact h5 {
    margin: 0 auto 15px;
    color: var(--other-deep-color-dark);
    font-size: 2.0rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: center;
}

div.room_contact p {
    margin: 0 auto;
    font-size: 2.7rem;
    line-height: 3.2rem;
    font-weight: 500;
    text-align: center;
}

div.room_illust {
    margin: 0 auto;
    width: 540px;
}

div.room_illust ul {
    margin: 0 auto;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

div.room_illust ul li {
    margin: 0;
    width: 54%;
}

div.room_illust ul li:last-child {
    margin: 0;
    width: 38%;
}

div.room_illust ul li img {
    width: 100%;
    height: auto;
}

div.hyouka_content {
    margin: 0 auto 50px;
    width: 100%;
}

div.hyouka_content h3 {
    margin: 0 auto;
    padding: 10px 20px;
    background: 
    linear-gradient(to right, transparent 50%, #ffffff 95%),
    repeating-linear-gradient(
        to bottom,
        var(--other-deep-color) 0px,
        var(--other-deep-color) 2px,
        var(--other-deep-color-dark) 2px,
        var(--other-deep-color-dark) 4px
    );
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 700;
    border-radius: 10px;
    text-shadow: 0px 0px 8px #000000;
}

div.hyouka_content ul {
    margin: 0 auto;
    border-top: 1px dotted var(--line-color-dark);
}

div.hyouka_content h3 + ul {
    border-top: none;
}

div.hyouka_content ul li {
    margin: 0 auto;
    padding: 10px 0;
    font-size: 1.6rem;
    line-height: 2.7rem;
    border-bottom: 1px dotted var(--line-color-dark);
}

div.hyouka_content ul li img {
    display: inline-block;
    vertical-align: middle;
}

div.hyouka_content ul li i {
    color: #bdb39b;
}

div.other_link_button {
    margin: 0 auto 50px;
    width: 240px;
}

div.other_link_button a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--line-color-light);
    display: block;
    border-radius: 25px;
}

div.other_link_button a i {
    color: #75b5de;
}

/*バナー*/

div.banner_content {
    margin: 0 auto 50px;
    padding: 0 0 30px;
    width: 100%;
    border-bottom: 1px dotted var(--line-color-dark);
}

div.banner_content:last-child {
    margin: 0 auto;
}

div.banner_content h3 {
    margin: 0 auto 20px;
    padding: 10px 20px;
    background: #bdb39b;
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 500;
    border-radius: 10px;
}

div.banner_content table {
    margin: 0 auto;
}

div.banner_content table td {
    padding: 10px;;
    text-align: center;
    vertical-align: middle;
}

/*プライバシーポリシー*/

div.policy_content {
    margin: 0 auto 50px;
    width: 100%;
}

div.policy_content:last-child {
    margin: 0 auto;
}

div.policy_content h3 {
    margin: 0 auto 15px;
    padding: 10px 20px;
    background: #bdb39b;
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 500;
    border-radius: 10px;
}

div.policy_content h4 {
    margin: 0 auto 15px;
    padding: 10px 20px;
    font-size: 1.9rem;
    line-height: 3.0rem;
    font-weight: 500;
    border-top: 1px dotted var(--line-color-dark);
    border-bottom: 1px dotted var(--line-color-dark);
}

div.policy_content h5 {
    margin: 0 auto 8px;
    font-size: 1.8rem;
    line-height: 2.7rem;
    font-weight: 500;
}

div.policy_content p {
    margin: 0 auto 20px;
}

div.policy_content p:last-child {
    margin: 0 auto;
}


/*SNS運用方針・運用ポリシー*/

div.sns_list {
    margin: 0 auto;
    width: 100%;
}

div.sns_list table {
    margin: 0 auto;
    width: 100%;
}

div.sns_list table th {
    padding: 10px;
    width: 70%;
    background: #f0f0f0;
    font-size: 1.6rem;
    line-height: 2.4rem;
    font-weight: 500;
    text-align: center;
    border: 1px solid var(--line-color-light);
}

div.sns_list table td {
    padding: 10px;
    font-size: 1.6rem;
    line-height: 2.4rem;
    font-weight: 400;
    text-align: center;
    border: 1px solid var(--line-color-light);
}

/*お知らせ*/

div.back_to_news_home {
    margin: 0 auto 50px;
    width: 360px;
}

div.back_to_news_home a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--line-color-light);
    display: block;
    border-radius: 25px;
}

div.back_to_news_home a i {
    color: #75b5de;
}

div.news_list_content_area {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.news_list_content {
    margin: 0 auto;
    padding: 20px 20px;
    background: #f0e4e5;
    width: 100%;
    border-radius: 10px;
}

div.news_list_content a, 
div.news_content a {
	display: inline-block;
	font-size:.9em;
	padding-left: .5rem;
}

div.news_list_content a:before, 
div.news_content a:before {
    content:"◆";
}

div.news_list_content p {
	font-size: 1.6rem;
	margin-bottom: 10px;
}

div.news_list_content p:last-child {
    margin-bottom: 0;
}

div.news_list_content p a {
    color: #116ff7;
    text-decoration: none;
}

div.news_list_content p a:hover {
    color: #116ff7;
    text-decoration: underline;
}
div.news_list_content p img {
    vertical-align: middle;
}

div.news_archive_list {
    margin: 0 auto 30px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.news_archive_list h3 {
    margin: 0 auto 20px;
    padding: 10px 20px;
    background: #bdb39b;
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 500;
    border-radius: 10px;
}

div.news_archive_list ul {
    margin: 0 auto;
    width: 100%;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}

div.news_archive_list ul li {
    margin: 0 0 15px 1.2%;
    width: 10%;
}

div.news_archive_list ul li:nth-child(9n+1) {
    margin: 0 0 15px 0;
}

div.news_archive_list ul li a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--line-color-light);
    display: block;
    border-radius: 25px;
}

div.news_archive_list ul li a i {
    color: #75b5de;
}

/*水生生物調査*/

div.research_content {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.research_content h3 {
    margin: 0 auto;
    padding: 10px 20px;
    background: 
    linear-gradient(to right, transparent 50%, #ffffff 95%),
    repeating-linear-gradient(
        to bottom,
        var(--kasen-primary-color) 0px,
        var(--kasen-primary-color) 2px,
        var(--kasen-primary-color-dark) 2px,
        var(--kasen-primary-color-dark) 4px
    );
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 700;
    border-radius: 10px;
    text-shadow: 0px 0px 8px #000000;
}

div.research_content h4 {
    margin: 15px auto 0;
    padding: 10px 20px;
    background: var(--bg-color-gray);
    color: var(--text-color);
    font-size: 1.9rem;
    line-height: 2.7rem;
    font-weight: 500;
    text-align: left;
    border-radius: 10px;
}

div.research_content ul {
    margin: 0 auto 30px;
}

div.research_content ul:last-child {
    margin: 0 auto;
}

div.research_content ul li {
    margin: 0 auto;
    padding: 10px 0;
    font-size: 1.6rem;
    line-height: 2.7rem;
    border-bottom: 1px dotted var(--line-color-dark);
}

div.research_content ul li i {
    color: #2d65ab;
}

div.research_archive_list {
    margin: 0 auto 30px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.research_archive_list h3 {
    margin: 0 auto 20px;
    padding: 10px 20px;
    background: #bdb39b;
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 500;
    border-radius: 10px;
}

div.research_archive_list ul {
    margin: 0 auto;
    width: 100%;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}

div.research_archive_list ul li {
    margin: 0 0 15px 1.2%;
    width: 10%;
}

div.research_archive_list ul li:nth-child(9n+1) {
    margin: 0 0 15px 0;
}

div.research_archive_list ul li a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--line-color-light);
    display: block;
    border-radius: 25px;
}

div.research_archive_list ul li a i {
    color: #75b5de;
}

/*フレームワーク*/

div.framework_content {
    margin: 0 auto 40px;
    width: var(--contents-width);
    min-width: var(--min-contents-width);
    max-width: var(--max-contents-width);
}

div.framework_content ul {
    margin: 0 auto;
    border-top: 1px dotted var(--line-color-dark);
}

div.framework_content h3 + ul {
    border-top: none;
}

div.framework_content ul li {
    margin: 0 auto;
    padding: 10px 0;
    font-size: 1.6rem;
    line-height: 2.7rem;
    border-bottom: 1px dotted var(--line-color-dark);
}

div.framework_content ul li strong {
    color: var(--text-alert-color);
}

div.framework_content ul li img {
    display: inline-block;
    vertical-align: middle;
}

div.framework_content ul li i {
    color: var(--jimusyo-deep-color);
}

div.framework_link_button {
    margin: 0 auto 50px;
    width: 240px;
}

div.framework_link_button a {
    margin: 0 auto;
    width: 100%;
    background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%);
    color: var(--text-color);
    font-size: 1.6rem;
    line-height: 50px;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--line-color-light);
    display: block;
    border-radius: 25px;
}

div.framework_link_button a i {
    color: var(--jimusyo-deep-color-dark);
}

