@charset "utf-8";
/* font */
@font-face {
	font-family: "Shippori Mincho";
	font-weight: 500;
	src: local("ShipporiMincho-Medium"),
	url("../font/ShipporiMincho-Medium.woff2") format("woff2"),
	url("../font/ShipporiMincho-Medium.woff") format("woff");
	font-display: swap;
}
h1,h2,h3 {
	font-family: 'Shippori Mincho';
	font-weight:500;
letter-spacing: 0.1em;
}
/* 見出し */
h2{
    position: relative;
    border-color: #eee;
    border-style: solid;
    border-width: 5px 5px 5px 0;
    background: #fff;
    margin: 0 0 15px -15px;
margin-bottom: 2.0em;
    padding: 5px 15px;
    -moz-box-shadow: 1px 1px 1px rgba(0,0,0,.3);
    -webkit-box-shadow: 1px 1px 1px rgba(0,0,0,.3);
    box-shadow: 1px 1px 1px rgba(0,0,0,.3);
}
 
h2:after
{
    content: "";
    position: absolute;
    z-index: -1;
    bottom: 15px;
    right: 15px;
    width: 70%;
    height: 10px;
    background: rgba(0, 0, 0, .7);
    -webkit-box-shadow: 0 15px 10px rgba(0,0,0, .7);
    -moz-box-shadow: 0 15px 10px rgba(0, 0, 0, .7);
    box-shadow: 0 15px 10px rgba(0, 0, 0, .7);
    -webkit-transform: rotate(2deg);
    -moz-transform: rotate(2deg);
    -o-transform: rotate(2deg);
    -ms-transform: rotate(2deg);
    transform: rotate(2deg);
}

/* 構造 */
html{
box-sizing: content-box;
}
body{
-webkit-text-size-adjust: 100%; /* iosで横にしてもフォントサイズを変えない */
}
body{
display: flex;
min-height: 100vh;
height: 100%;
flex-direction: column;
align-items: center;
}
main{
flex: 1 0 auto;
padding-bottom: 10.0rem;
margin: 0px auto;
overflow: hidden;
}
header, footer, main{
width: 100%;
}
footer{
font-size: 0.8em;
text-align: center;
}
#footnav{
color: #FFF;
}
#footnav li a,
#footnav li a:visited{
color: #FFF;
}
#footnav li{
list-style-type: none;
display: inline-block;
margin: 2.0em;	
}

#container{
margin: 0 auto;
position: relative;
width: 95%;
}
#width{
width: 1280px;
max-width: 100%;
margin: 0px auto;
}
.current{
font-weight: bold;	
}
/*上へ戻る*/
#gototop{
display: none;
position: fixed;
bottom: 50px;
right: 15px;
}
#gototop a{
display: block;
background-color: #ccc;
text-align: center;
text-decoration: none;
width: 30px;
height: 30px;
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
}
#gototop a:hover{
display: block;
background-color: #b2d1fb;
text-align: center;
width: 30px;
height: 30px;
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
}
/*お問い合わせ*/
.contactbanner{
background: var(--color-accent);
width: 200px;
height: 50px;
color: #FFF;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
position: relative;
border-radius: 1px;
margin-top: 10px;
margin-bottom: 10px;
}
.contactbanner:before{
border: 1px solid #fff;
content: '';
display: block;
position: absolute;
top: 0px;
bottom: 0px;
left: 0px;
right: 0px;
margin: 4px;
border-radius: 1px;
}
.contact{
padding-left: 1.2em;;
background: url('../icon/chat-bubble-solid.gif') no-repeat center left;
background-size: 18px 18px;
padding-left: 23px;
z-index: 1;
}
.linkwhite, .linkwhite:visited{
color: #FFF;
}
/* ナビゲーション */
nav{
 width: 100%;
 height: 70px;
 position: relative;
 background: var(--color-bg-secondary);
}
.drawer{
 display: flex;
 flex-direction: row;
 align-items: center;
 justify-content: space-between;
 position: relative;
 height: 70px;
 padding: 0 1em;
}
.navbar_toggle{
 z-index:9999;
}
.navbar_toggle_icon {
 position: relative;
 display: block;
 height: 2px;
 width: 30px;
 background: #FFF;
 -webkit-transition: ease .5s;
 transition: ease .5s;
}
.navbar_toggle_icon:nth-child(1) {
 top: 0;
}
.navbar_toggle_icon:nth-child(2) {
 margin: 8px 0;
}
.navbar_toggle_icon:nth-child(3) {
 top: 0;
}
/*OPEN時の動き*/
.navbar_toggle.open .navbar_toggle_icon:nth-child(1) {
 top: 10px;
 -webkit-transform: rotate(45deg);
 transform: rotate(45deg);
}
.navbar_toggle.open .navbar_toggle_icon:nth-child(2) {
 -webkit-transform: translateY(-50%);
 transform: translateY(-50%);
 opacity: 0;
}
.navbar_toggle.open .navbar_toggle_icon:nth-child(3) {
 top: -10px;
 -webkit-transform: rotate(-45deg);
 transform: rotate(-45deg);
}
.menu{
 -webkit-transform: translateX(-100%);
 transform: translateX(-100%);
 -webkit-transition:ease .5s;
 transition:ease .5s;
 position: relative;
 z-index:1000;
}
.menu ul li{
 padding: 2em;
 border-bottom: 1px solid #CCC;
 list-style-type: none;
 background: var(--color-bg-secondary);
opacity: 0.9;
}
/*OPEN時の動き*/
.menu.open {
 -webkit-transform:translateX(0);
 transform:translateX(0);
 overflow-y: auto;
 -webkit-overflow-scrolling: touch;
}
.menu ul li a,
.menu ul li a:visited{
color: #FFF;
opacity: 1.0;
}

@media screen and (min-width: 720px) {
nav{
 display: flex;
 flex-direction: row;
}
.navbar_toggle{
 display: none;
}
.menu{
 width: 100%;
 -webkit-transform: translateX(0);
 transform: translateX(0);
}
.menu ul{
 height: 70px;
 display: flex;
 flex-wrap: wrap;
 justify-content: flex-end;
 align-items: center;
}
.menu ul li{
 padding: 0 1em;
 border-bottom: none;
 width: 12em;
}

}
/* ナビゲーションここまで */
