@charset "UTF-8";
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, dialog, figure, footer, header,
hgroup, menu, nav, section,
time, mark, audio, video {margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}
body {line-height:1;}
article, aside, dialog, figure, footer, header,
hgroup, nav, section {display:block}
ul, ol {list-style:none}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after,
q:before, q:after {content:'';content:none;}
a {margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline;background:transparent}
ins {background-color:#ff9;color:#000;text-decoration:none}
mark {background-color:#ff9;color:#000;font-style:italic;font-weight:bold}
del {text-decoration: line-through}
abbr[title], dfn[title] {border-bottom:1px dotted #000;cursor:help}
table {border-collapse:collapse;border-spacing:0}
hr {display:block;height:1px;border:0;border-top:1px solid #cccccc;margin:1em 0;padding:0}
input, select {vertical-align:middle}

/*========================================
BASIC
=======================================*/
html{-webkit-text-size-adjust:100%}
body{font-size:100%; font-family: 'Noto Serif JP', serif; background:url("./images/bg1.jpg")  fixed center; background-size: cover;}
a{ color: #003399;  }
a:hover{ color: #330033;  }


/*clearfix*/
.clearfix:after{content: "."; display: block; height: 0; font-size:0; clear: both; visibility:hidden}
.clearfix{display: inline-block;}
* html .clearfix{height: 1%;}
.clearfix{display:block;}

/* COMMON =======================================*/

h1{ margin: 0.5em; line-height: 150%; font-size: 220%; text-shadow: 1px 2px 3px #666; }
h2{ margin: 0.5em; padding: 1em 0.5em; line-height: 125%; background: linear-gradient(10deg,#F30, #Fff); color: #fff; font-size: 160%;  }
h3{ margin: 2em 0.5em 1em 0.5em; padding: 0.25em; border-bottom: double 3px #000; font-size: 160%;  }
h4{ margin: 0.25em 0.5em; padding: 0.25em; line-height: 140%; font-size: 120%; font-weight: bold; }
h5{ margin: 1em; line-height: 120%; color: #000000; font-weight: normal; }
p{ margin: 1em; padding: 0.25em 0.5em; line-height: 140%; text-align: justify; text-justify: inter-ideograph;  }
textarea{ width: 360px;  }
ul{ margin: 0 0 1em;  }
li{ margin: 0.5em 0 0 1em; line-height: 125%;  }
dt{ margin: 1em 0 0 0;  }
dd{ margin: 0.3em 0 0 0; padding: 0; line-height: 130%;  }
ol{ margin: 0 0 0 0.25em; list-style: decimal;  }
ol li{ margin: 0 0 0 1.25em;  }
#wrapper{ width: 100%; margin: 0 auto 0; overflow: hidden ; }
.dropdown{ display: none;  }
.dropdown-menu{ background: #f30; color: #fff; display: none;  }
.navbar-toggle{ display: none;  }
.toggle{ display: none;  }
#header{ background: #fff;  }
#title{ width: 100%; height: 75px; padding: 3px 0 5px 0; float: left;  }
.toplogo{ padding: 0 5px; vertical-align:top; }
.toplogo img{ height: 100%;  }
#uprightNav{ margin: 15px 0 0 0; float: right; display: inline-block;  }
#uprightNav li{ width: 125px; margin: 2px; padding: 10px 3px; font-size: 75%; text-align: center; float: left; list-style: none;  }
#uprightNav li a{ color: #000; text-decoration: none; }
#uprightNav li a:hover{ color: #f30; font-weight: bold; }
#title2{ padding: 5px 0 0 0; background: #f30; text-align: center;  }
#upperNav{ width: 960px; background: #f30; text-align: center; display: inline-block;  }
#upperNav li{ width: 18.0%; margin: 2px; padding: 10px 3px; text-align: center; float: left; list-style: none;  }
#upperNav li a{ color: #fff; text-decoration: none; }
#upperNav li:hover{ background: rgba(255, 255, 255, 0.4); font-weight: bold; }
#upperNav li.current{ background: #f63; border-radius:5%; }
#upperNav ul.child{ margin: 5px 0 0 0; display: none;  }
#upperNav li:hover .child{ padding: 0.5em 0 0 0; display: block;  }
#upperNav ul.child li{ width: 110px; border: solid 1px #ccc; background: #365790; color: #aaa; font-size: 100%; text-decoration: none; }
.forToggle{ display: none;  }
#contents{ width: 100%; overflow: hidden ; }
#h1contents{ height: 320px; margin: 122px auto 0 auto; padding: 10px; background-size:cover; }
#maincontents1column{ width: 960px; margin: 30px auto 0 auto; background: #fff; text-align: center;  }
#main1column{ width: 100%; background: rgba(255, 255, 255, 0.1); text-align: left; float: right; margin-bottom:5%; }
#main2column{ width: 75%; background: #ffffff; float: right;  }
#main3column{ width: 75%; background: #ffffff; float: right;  }
table{ width: 90%; margin: 20px auto auto auto; border: 4px double #999999; line-height: 2; table-layout:fixed; border-spacing:0; margin-bottom:20px; }
table tr{ border: none;  }
.tr-cont{ border-top: none;  }
table th{ width: 110px; padding: 5px; border-left: 3px double #999999; border-bottom: 1px solid #999999; background: #ddd; text-align: center; font-weight:bold; vertical-align: top; }
table td{ padding: 5px 5px 5px 10px; border-left: 3px double #999999; border-bottom: 1px solid #999999; text-align: left; vertical-align: top; }
table li{ list-style: square;  }
img.toppage{ width: 100%; height: 250px; margin: 1em 0 30px 0;  }
input{ width: 500px;  }
input.button{ width: auto; height: 2em;  }
textarea{ width: 500px;  }
.gmap{ width: 900px; height: 600px;  }
.grid-container{ display: grid;  }
.grid-item{ height: 100px; margin: 5px; border: 1px solid #ccc;  }
#sideNav{ width: 24%; margin: 10px 0 0 0; border: 1px solid #dddddd; background: #eeeeee; font-size: 90%; float: left;  }
#subcontents{ width: 305px; margin: 10px 0 0 0; background: #ffffff; float: right;  }
#pankuzu{ width: 100%; margin: 3em 0 1em 0; padding: 0.5em 0 0 0.5em; background: #000; color: #fff; font-size: 90%; float: left;  }
#pankuzu a{ background: #000; color: #fff; text-decoration: none; }
#footer{ width: 100%; margin: 0; padding: 5px 0 15px 0; background: #000; color: #fff; font-size: 80%; text-align: center;  }
#footer li a{ margin: 0 10px 10px 5px; color: #fff; text-align: left; float: left; list-style: none;  }


@media screen and (max-width: 980px) { 
h1{ color: #fff; font-size: 180%; text-shadow: 1px 2px 3px #000; }
h2{ padding: 0.5em; line-height: 110%; font-size: 130%;  }
h3{ font-size: 120%;  }
h4{ font-size: 105%; font-weight: bold; }
h5{ font-size: 80%;  }
p{ line-height: 120%; font-size: 90%;  }
textarea{ width: 90%;  }
#wrapper{ width: auto; margin: 0;  }
.dropdown{ float: right; display: inline-block;  }
.dropdown-menu, .dropdown-menu li a{ background: #f30; color: #fff;  }
.navbar-toggle{ background: #f30; font-size: 130%; float: right; display: inline-block; position: relative ; }
.icon-bar{ background: #fff;  }
.toggle{ width: 100%; height: 35px; font-size: 130%; float: right; position: relative ; }
.toggle figcaption{ position: fixed; top: 10px; left: 45px; }
.toggle img{ width: auto; max-height:35px ; }
.toplogo img{ max-width:75%; max-height:95%; object-fit: contain; }
#uprightNav{ display: none;  }
#title2{ display: none;  }
#upperNav{ display: none;  }
.forToggle{ background: #eeeeee; font-size: 90%; display: block; position: fixed ; opacity:0.9 ; }
#contents{ width: auto; margin-top: 10%; }
#h1contents{ width: 100%; margin: 50px auto 0 auto; padding: 0; background-size:cover; max-height:100px; }
#maincontents1column{ width: 100%;  }
#main2column{ width: auto;  }
#main3column{ width: auto;  }
table{ border: none; font-size: 90%; word-wrap:break-word; }
table th{ border-left: none; background: #fff; min-width: 70px; }
table td{ padding: 5px; border-left: none;  }
img.toppage{ height: 100px;  }
input{ width: 90%;  }
textarea{ width: 90%;  }
.gmap{ width: 600px; height: 400px;  }
#sideNav{ display: none;  }
#subcontents{ width: auto;  }
#pankuzu{ display: none;  }
#footer{ width: auto;  }
 }
@media screen and (max-width: 640px) { 
.gmap{ width: 300px; height: 200px;  }
 }