@charset "utf-8";

a {outline: none;}
a:link {text-decoration: none; color: #267e95;}
a:visited {text-decoration: none; color: #267e95;}
a:hover {text-decoration: none; color: #ff8000;}
a:active {text-decoration: none; color: #ff8000;}
a:hover img{opacity:0.7; filter:alpha(opacity=70); -ms-filter:“alpha(opacity=70)”;}
a:focus{ outline:none; }

/*==========================================
 Global Navi
===========================================*/
#gnav {margin: 0;
padding: 0;
width: 100%;
}

#gnav li {float: left; width: 20%;}

#gnav a {display: block;
position: relative;
z-index: 2000;
height: 48px;
padding-top: 50px;
font-size: 0.88em;
text-decoration: none;
color: #FFFFFF;
text-align: center;}

#gnav a:before {display: block;
position: absolute;
width: 100%;
top: 10px;
text-align: center;
color: #FFFFFF;
font-family: "Font Awesome 5 Free";
font-size: 2.28em;}

#gnav a:after {content: "";
position: absolute;
width: 0;
height: 0;
bottom: -10px;
left: 50%;
margin-left: -20px;
border-left: solid 20px transparent;
border-right: solid 20px transparent;}



/* gnav menu001 ===========================================*/
#menu001 a:link,
#menu001 a:visited {
background: #82d7d0; /* Old browsers */
background: -moz-linear-gradient(top,  #82d7d0 0%, #38b1a8 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#82d7d0), color-stop(100%,#38b1a8)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #82d7d0 0%,#38b1a8 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #82d7d0 0%,#38b1a8 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #82d7d0 0%,#38b1a8 100%); /* IE10+ */
background: linear-gradient(to bottom,  #82d7d0 0%,#38b1a8 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#82d7d0', endColorstr='#38b1a8',GradientType=0 ); /* IE6-9 */
}
/* マウスオーバー時にグラデーションの色を変更 */
#menu001 a:hover,
#menu001 a:active {
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 1%, #81d6cf 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#ffffff), color-stop(100%,#81d6cf)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #ffffff 1%,#81d6cf 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #ffffff 1%,#81d6cf 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #ffffff 1%,#81d6cf 100%); /* IE10+ */
background: linear-gradient(to bottom,  #ffffff 1%,#81d6cf 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#81d6cf',GradientType=0 ); /* IE6-9 */
}
/* 疑似要素に、アイコンフォントに割り当てられた文字を記述 */
#menu001 a:before {
font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f015";
}
/* マウスオーバー時にborderを使った三角マークを表示 */
#menu001 a:link:after,
#menu001 a:visited:after {
	display: none;
}
#menu001 a:hover:after,
#menu001 a:active:after {
	display: block;
	border-top: solid 8px #267e95;
}
/* gnav menu002 ===========================================*/
#menu002 a:link,
#menu002 a:visited {
border-left:1px solid #38b1a8;
background: #82d7d0; /* Old browsers */
background: -moz-linear-gradient(top,  #82d7d0 0%, #38b1a8 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#82d7d0), color-stop(100%,#38b1a8)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #82d7d0 0%,#38b1a8 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #82d7d0 0%,#38b1a8 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #82d7d0 0%,#38b1a8 100%); /* IE10+ */
background: linear-gradient(to bottom,  #82d7d0 0%,#38b1a8 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#82d7d0', endColorstr='#38b1a8',GradientType=0 ); /* IE6-9 */
}
/* マウスオーバー時にグラデーションの色を変更 */
#menu002 a:hover,
#menu002 a:active {
border-left:1px solid #38b1a8;
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 1%, #81d6cf 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#ffffff), color-stop(100%,#81d6cf)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #ffffff 1%,#81d6cf 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #ffffff 1%,#81d6cf 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #ffffff 1%,#81d6cf 100%); /* IE10+ */
background: linear-gradient(to bottom,  #ffffff 1%,#81d6cf 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#81d6cf',GradientType=0 ); /* IE6-9 */
}
/* 疑似要素に、アイコンフォントに割り当てられた文字を記述 */
#menu002 a:before {
font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f0e0";
}
/* マウスオーバー時にborderを使った三角マークを表示 */
#menu002 a:link:after,
#menu002 a:visited:after {
	display: none;
}
#menu002 a:hover:after,
#menu002 a:active:after {
	display: block;
	border-top: solid 8px #267e95;
}

/* gnav menu003 ===========================================*/
#menu003 a:link,
#menu003 a:visited {
border-left:1px solid #38b1a8;
background: #82d7d0; /* Old browsers */
background: -moz-linear-gradient(top,  #82d7d0 0%, #38b1a8 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#82d7d0), color-stop(100%,#38b1a8)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #82d7d0 0%,#38b1a8 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #82d7d0 0%,#38b1a8 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #82d7d0 0%,#38b1a8 100%); /* IE10+ */
background: linear-gradient(to bottom,  #82d7d0 0%,#38b1a8 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#82d7d0', endColorstr='#38b1a8',GradientType=0 ); /* IE6-9 */
}
/* マウスオーバー時にグラデーションの色を変更 */
#menu003 a:hover,
#menu003 a:active {
border-left:1px solid #38b1a8;
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 1%, #81d6cf 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#ffffff), color-stop(100%,#81d6cf)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #ffffff 1%,#81d6cf 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #ffffff 1%,#81d6cf 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #ffffff 1%,#81d6cf 100%); /* IE10+ */
background: linear-gradient(to bottom,  #ffffff 1%,#81d6cf 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#81d6cf',GradientType=0 ); /* IE6-9 */
}
/* 疑似要素に、アイコンフォントに割り当てられた文字を記述 */
#menu003 a:before {
font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f157";
}
/* マウスオーバー時にborderを使った三角マークを表示 */
#menu003 a:link:after,
#menu003 a:visited:after {
	display: none;
}
#menu003 a:hover:after,
#menu003 a:active:after {
	display: block;
	border-top: solid 8px #267e95;
}

/* gnav menu004 ===========================================*/
#menu004 a:link,
#menu004 a:visited {
border-left:1px solid #38b1a8;
background: #82d7d0; /* Old browsers */
background: -moz-linear-gradient(top,  #82d7d0 0%, #38b1a8 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#82d7d0), color-stop(100%,#38b1a8)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #82d7d0 0%,#38b1a8 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #82d7d0 0%,#38b1a8 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #82d7d0 0%,#38b1a8 100%); /* IE10+ */
background: linear-gradient(to bottom,  #82d7d0 0%,#38b1a8 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#82d7d0', endColorstr='#38b1a8',GradientType=0 ); /* IE6-9 */
}
/* マウスオーバー時にグラデーションの色を変更 */
#menu004 a:hover,
#menu004 a:active {
border-left:1px solid #38b1a8;
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 1%, #81d6cf 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#ffffff), color-stop(100%,#81d6cf)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #ffffff 1%,#81d6cf 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #ffffff 1%,#81d6cf 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #ffffff 1%,#81d6cf 100%); /* IE10+ */
background: linear-gradient(to bottom,  #ffffff 1%,#81d6cf 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#81d6cf',GradientType=0 ); /* IE6-9 */
}
/* 疑似要素に、アイコンフォントに割り当てられた文字を記述 */
#menu004 a:before {
font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f059";
}
/* マウスオーバー時にborderを使った三角マークを表示 */
#menu004 a:link:after,
#menu004 a:visited:after {
	display: none;
}
#menu004 a:hover:after,
#menu004 a:active:after {
	display: block;
	border-top: solid 8px #267e95;
}

/* gnav menu005 ===========================================*/
#menu005 a:link,
#menu005 a:visited {
border-left:1px solid #38b1a8;
background: #82d7d0; /* Old browsers */
background: -moz-linear-gradient(top,  #82d7d0 0%, #38b1a8 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#82d7d0), color-stop(100%,#38b1a8)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #82d7d0 0%,#38b1a8 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #82d7d0 0%,#38b1a8 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #82d7d0 0%,#38b1a8 100%); /* IE10+ */
background: linear-gradient(to bottom,  #82d7d0 0%,#38b1a8 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#82d7d0', endColorstr='#38b1a8',GradientType=0 ); /* IE6-9 */
}
/* マウスオーバー時にグラデーションの色を変更 */
#menu005 a:hover,
#menu005 a:active {
border-left:1px solid #38b1a8;
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 1%, #81d6cf 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#ffffff), color-stop(100%,#81d6cf)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #ffffff 1%,#81d6cf 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #ffffff 1%,#81d6cf 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #ffffff 1%,#81d6cf 100%); /* IE10+ */
background: linear-gradient(to bottom,  #ffffff 1%,#81d6cf 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#81d6cf',GradientType=0 ); /* IE6-9 */
}
/* 疑似要素に、アイコンフォントに割り当てられた文字を記述 */
#menu005 a:before {
font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f0e8";
}
/* マウスオーバー時にborderを使った三角マークを表示 */
#menu005 a:link:after,
#menu005 a:visited:after {
	display: none;
}
#menu005 a:hover:after,
#menu005 a:active:after {
	display: block;
	border-top: solid 8px #267e95;
}


/*==========================================
 Sidemenu
===========================================*/
.sidemenu{border: solid 1px #82d7d0;
border-radius: 10px;
width: 100%;
margin: 0 auto 48px;}

.sidemenu h1{margin: 0;
padding: 10px;
color: #267e95;
font-size: 1.14em;
font-weight: normal;}

.sidemenu h1 i{margin-right: 5px;
color: #267e95;
font-size: larger;}

.sidemenu h2{margin: 0;
padding: 18px;
border-top: solid 1px #dddddd;
color: #267e95;
font-size: 1.12em;
font-weight: normal;}


.sidemenu ul{margin: 0;
padding: 0;
list-style: none;}

.sidemenu li a{display: block;
padding: 18px;
border-top: solid 1px #dddddd;
color: #000000;
text-decoration: none}

.sidemenu li a:hover{background-color:#82d7d0;}


/*==========================================
 page-top
===========================================*/
#page-top {position: fixed; bottom: 8px; right: 8px;}
#page-top .fas{color:#ffffff; margin: auto;}
#page-top a {background: #e4c431;
border: dotted 2px #ffffff;
box-shadow: 1px 1px 4px #333333;
text-decoration: none;
color: #ffffff;
height:50px;
width: 50px;
text-align: center;
margin: 0 auto 0 auto;
padding: 0 0 0 0;
border-radius: 25px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: block;}
#page-top a:hover {text-decoration: none; background: #cccccc;}



/*==========================================
 Bread
===========================================*/
.bread{margin-top:4px; margin-bottom:4px;}
.bread ol{margin:0; padding:0; list-style: none;}
.bread li a{display: inline-block;
padding: 5px;
color: #000000;
font-size: 0.88em;
text-decoration: none;}
.bread li a:hover{background-color: #eeeeee;}
.bread ol:after{content: "";
display: block;
clear: both;}
.bread li{float: left; width: auto;}
.bread li:after	{content: '\003e';
margin-left: 10px;
margin-right: 10px;
color: #888888;}

/*==========================================
 oder-bt
===========================================*/
a.oder-bt{display: inline-block;
width: 100%;
margin: 18px auto;
padding: 8px 0;
border: 1px solid #af1d20;
background-color:#ffffff;
color: #ffffff;
text-align: center;
font-size: 1.48em;
font-weight: normal;
text-decoration: none;
line-height: 2;
letter-spacing:2px;
transition: .3s;
}
a.oder-bt span{display: block;}


/*==========================================
 banner000
===========================================*/
a.banner000:hover {border: 1px solid #ff0000;
background: #dddddd;
color: #ffffff;
}

/* btn001 ===========================================*/
a.btn001{display: inline-block;
width: 98%;
margin: 18px auto;
padding: 8px 4px;
border: 1px solid #52a318;
background-color:#52a318;
color: #ffffff;
text-align: center;
font-size: 1.28em;
font-weight: normal;
text-decoration: none;
line-height: 2;
letter-spacing:2px;
transition: .3s;
}
a.btn001 .far{color:#ffffff; margin:0 4px 0; font-size: 1.28em;}
a.btn001 .fas{color:#ffffff; margin:0 4px 0; font-size: 1.28em;}

a.btn001 span{display: block; color: #ffffff;}
/* banner001 ===========================================*/
a.banner001 {
position: relative;
z-index: 2;
}
a.banner001::after {
display: block;
content: "";
position: absolute;
z-index: -1;
top: 0;
bottom: 0;
left: 0;
right: 0;
width: 0;
height: 0;
margin: auto;
background: rgba(85,85,85,.4);
transition: .3s;
}
a.banner001:hover::after {
width: 100%;
height: 100%;
}


/* btn002 ===========================================*/
a.btn002{display: inline-block;
width: 100%;
margin: 8px auto;
padding: 8px 0;
border: 1px solid #248f9a;
background: transparent;
color:#116688;
text-align: center;
font-size: 1.18em;
font-weight: bold;
text-decoration: none;
line-height: 2;
letter-spacing:1px;
transition: .4s;}
a.btn002 span{display: block; font-weight: normal;}
a.btn002 .far{font-size: 1.5em; color:#116688;}
/* banner002 ===========================================*/
a.banner002:hover {background: #82d7d0;}


/* btn003 ===========================================*/
a.btn003{display: inline-block;
width: 100%;
margin: 18px auto;
padding: 8px 4px;
border: 1px solid #ffffff;
background-color:#33a499;
color: #ffffff;
text-align: center;
font-size: 1em;
font-weight: normal;
text-decoration: none;
line-height: 2;
letter-spacing:2px;
transition: .3s;
}
a.btn003 .far{color:#ffffff; margin:0 4px 0; font-size: 1.28em;}
a.btn003 .fas{color:#ffffff; margin:0 4px 0; font-size: 1.28em;}

a.btn003 span{display: block; color: #ffffff;}
/* banner003 ===========================================*/
a.banner003 {
position: relative;
z-index: 2;
}
a.banner003::after {
display: block;
content: "";
position: absolute;
z-index: -1;
top: 0;
bottom: 0;
left: 0;
right: 0;
width: 0;
height: 0;
margin: auto;
background: rgba(85,85,85,.4);
transition: .3s;
}
a.banner003:hover::after {
width: 100%;
height: 100%;
}

