﻿/* Reset */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,#header,.header_inner,hgroup,menu,nav,output,ruby,.section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:16px 100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,#header,.header_inner,hgroup,menu,nav,.section,.row{display:block}body{line-height:1.6em}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}
body {font-family:'メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif; width:100%; text-align:center;}
a {text-decoration:none}
a:focus { outline:none;}
p { line-height:1.6em; margin-bottom:1em; text-align:left}
p .txt_s{font-size:14px}
img{max-width:100%; height:auto; display:block; margin:0 auto;}
h1,h2,h3,h4{text-align:center;font-weight:bold; line-height:1.2em; letter-spacing:1px; color:#000}
h1{font-size:38px;}
h2{font-size:28px; margin-bottom:1em}
h3{font-size:16px;}
ul,li,p,table,td,tr,a{-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.br{display:inline-block}
.txtwh{color:#fff}
.menu{display: none; opacity: 1; position: fixed; width: 100%;  height: 100%;  color: #fff;  z-index: 99;max-width:400px; background-color:#000;}
.menu .nav { width: 100%; margin-top: 50px;margin-bottom: 46px; position: static; text-align:center; background:none;}
nav ul {text-align:center; line-height:1.8em}
nav ul li{margin-bottom: 20px;font-size:18px}
nav ul li a{color:#fff}
nav ul li a:hover {opacity: 0.8;}
nav ul li span{display:block;;font-size:14px}
nav ul li.linksns a, #header .linksns a {display: inline-block; width:34px; height:34px;}
nav ul li.linksns a {margin:5px;}
#header .linksns a {margin:1px;}
#header .linksns{position:absolute; top:4px;right:10px}
/*menu open close button*/
.button { position: fixed;top:10px;left: 20px; width: 50px;  height: 36px; vertical-align: top; font-size:40px; z-index: 3;}
.button a {text-decoration:none;}
.btn-open:after {color:#fff;content:"\f0c9";font-family:"FontAwesome";transition-property:all .2s linear 0s;-moz-transition:all .2s linear 0s;-webkit-transition:all .2s linear 0s;-o-transition:all .2s linear 0s;}
.btn-open:hover:after {opacity: 0.8;}
.btn-close:after {color:#fff;content:"\f00d";font-family:"FontAwesome";transition-property:all .2s linear 0s;-moz-transition:all .2s linear 0s;-webkit-transition:all .2s linear 0s;-o-transition:all .2s linear 0s;}
.btn-close:hover:after {opacity: 0.5;}
#header {position:fixed;width:100%;height:50px;background-color:#000; z-index:10;}
#header .lead, #header h1.lead{font-size:12px; font-weight:normal; line-height:1.4em;letter-spacing:normal;color:#fff; margin-top:10px;margin-right:4%; margin-left:62px}
#container{padding-top:50px;overflow:hidden; width:100%; background-color:#ffffff;clear:both;}
body {margin: 0;}
html, body {height: 100%;}
/*#block-01{	background: url(../images/back.jpg) 65% 50px no-repeat fixed;background-size: cover;} */
#main::before {
content:"";
display:block;
position:fixed;
top:0;
right:0;
z-index:-1;
width:100%;
height:100vh;
background-repeat:no-repeat;
background-position:65% 50px;
background-image:url(../images/back.jpg);
background-size:cover;
}
#block-01 {} 
#block-02 {	background: url(../images/meisai.jpg) center no-repeat fixed;background-size: cover;}
#block-03 {	background: url(../images/meisai.jpg) center no-repeat fixed;background-size: cover;}
#block-04 {	background: url(../images/meisai.jpg) center no-repeat fixed;background-size: cover;}
#block-05 {}
.bgwh{background-color: #fff; width: 100%;}
.block {color: white;padding: 30px 0;}
.block-text {background-color: #fff;}
#block-01.block{ padding:50px 0 30px 0}
.logo{width:40%;max-width:600px;padding-bottom:2%}
ul.events {margin-bottom:10px; text-align: left; display:inline-block}
ul.events li{margin-bottom:4px; display:inline-block}
.area{display:inline-block;padding:0.2em 0.4em; line-height:1em;color:#A70011;background-color:#000;font-size:30px;font-weight:bold;text-align: center;opacity: 1;vertical-align:middle; margin-right:6px}
.date_place{display:inline-block;color:#fff;font-size:18px;vertical-align:middle; margin-right:6px}
.note{background-color:#A70000; color:#fff;max-width:780px;padding:0.4em 1em;margin:0 auto; margin-bottom:1em;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.news h2{color:#fff; font-weight:bold; text-align:left; margin-bottom:0}
.news table{border:2px solid #FFFFFF; width:100%;text-align:left; padding-bottom:1em; background-color:rgba(0,0,0,0.5)}
.news table a{color:#fff;}
.news table tr td{padding:0.6em; letter-spacing:1px}
.news table tr td .date{padding-bottom:0.4em}
.arrow{display: inline-block;width:2%; vertical-align:middle}
.flow img {display:inline-block;width:22%; margin-bottom:1em; vertical-align:middle}
.point h2{color:#fff; display:flex; align-items:center;max-width:780px; width:100%; margin:0 auto}
.num{ padding:0.8em 0.6em 0.6em; background-color:#000; margin-right:10px; margin-bottom:10px}
.tit{padding:10px 10px 0 0; text-align:left}
.red{color:#FF0000;}
.point ul li{display:inline-block; width:32%; margin:0 0.2em}
.point .inner{padding-bottom:1.6em}
ul.btn li{background-color:#000; display:inline-block;margin:0.4em 0.8em}
ul.btn li a{color:#fff;padding:0.2em 0.4em; width:290px; height:82px;display: table-cell;vertical-align:middle;font-size:20px}
#block-04 h2{color:#000; font-size:16px}
dl.event{width:100%; margin:0 auto; box-sizing:border-box; border-left:solid 1px #000;border-right:solid 1px #000; border-bottom:solid 1px #000;margin-bottom:20px; clear:both}
dl.event>dt{ background-color : #000; font-weight:bold; font-size:19px;color:#ffffff; padding: 4px;clear : both; border-top:solid 1px #000;border-bottom:solid 1px #000;text-align:center}
dl.event>dd{ text-align:left; padding-top : 10px;  padding-left : 10px;  padding-right : 10px;  padding-bottom : 10px; margin:0; background-color:#fff; color:#000}
dl.event>dd p{clear:both}
.sns li{display:inline-block;}
.inner{max-width:780px;margin:0 auto; padding:20px 4%}
/* footer links */
footer {background: #00a0e2;}
.security {background-color:#EBEBEB}
.security_mark {padding:4% 0;width:216px; margin:0 auto; overflow:hidden;}
.pmark {float:right; margin:0;}
.f_geomark {float:right; margin:2px 10px 0 0; margin-left:-10px}
#f_links{background-color:#00a0e2; clear:both}
#f_links a{color:#fff}
#f_links .inner{max-width:750px; margin:0 auto;padding:1em}
.infolink {box-sizing:border-box;clear:both; letter-spacing:1pt; text-align:center; overflow:hidden;}
.infolink .f_left{width:46%;float:left; text-align:left; font-size:14px;line-height:1.8em; border-left:solid 1px #fff; padding-left:4%}
.infolink .f_left:first-child{border-left:none; padding-left:0}
.infolink .f_left a{display:block; padding:1em 0}
a.btn_co{background-color:#e40080; color:#fff; font-weight:bold;font-size:14px;  display:inline-block;padding:8px 6px; margin-top:10px;-moz-border-radius: 6px;  -webkit-border-radius: 6px;  border-radius: 6px; text-align:center;max-width:200px; padding:0.4em !important}
a.btn_co:hover{color:#fff; text-decoration:none}
.company{clear:both; overflow:hidden; margin-top:1em}
.companyname {font-size:22px; font-weight:bold; margin-bottom:1%;text-align:left; color:#fff}
.copyright {font-size:12px; text-align:left;  color:#fff}
.f_logo { width:46px; float:left}
@media (max-width:767px){
h1{font-size:34px;}
h2{font-size:26px;}
h4{font-size:24px;}
.sp_hidden{display:none}
.logo{width:80%;padding-top:20%;}
ul.events li{display:block}
#st_menu h2{font-size:28px;}
#header .lead{margin-right:4%}
.flow img{width:auto}
.flow img,.arrow{display: block; margin:4px auto}
.arrow{transform: rotate(90deg);}
.point ul li{display:block; width:auto; margin:0 auto; margin-bottom:10px}
/* news */
#news table tr td .date{display:block;}
/* event */
dl.event>dt{float:none;padding: 20px 0 16px 0; width: 100%;}
}
@media (min-width:599px){
.overlay {display:none !important;}
}
@media (max-width:480px){
h1{font-size:32px;}
h2{font-size:22px;}
#top .top_logo{position:absolute; top:16%; left:0; right:0;margin:auto}
/* contents */
ul.cnt li .clickguid{width:60%}
/* news */
#news table tr td{padding:0 4% 2% 4%; }
}
/* page top */
#pagetopbutton {
    display: none;
    position: fixed;
    bottom: 0px;
    right: 4px;
	margin-bottom:4px;
}
#pagetopbutton a {
  display: block;
  z-index: 999;
  padding: 6px 8px 8px 8px;
  border-radius: 30px;
  width: 35px;
  height: 35px;
  background-color: #000;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
}
#pagetopbutton a:hover {
    display: block;
    background-color: #ccc;
    text-align: center;
    color: #fff;
    font-size: 12px;
    text-decoration: none;
    padding:5px 10px;
  filter:alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
}