@charset "utf-8";
/*
============================================================
common setting
============================================================
*/

html,body,h1,h2,h3,h4,h5,h6,h7,
a,p,div,cpan,ul,li,ul,ol,img,address,
label,input,select,textarea,
form {
   margin:0;
   padding:0;
   border:none;
   text-decoration:none;
   font-weight:normal;
   font-style:normal;
   font-size:14px;
   font-family:"メイリオ", Meiryo, "ＭＳ Ｐゴシック","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3", Osaka,sans-serif;
   box-sizing:border-box;
   transition-duration:.3s;
}
ul li,ul ol {
   list-style-type:none;
}
:root {
   font-size:calc( 1vw + 1vh + .5vmin );
}


html,body {
  width:100%;
  height:100vh;
  position:relative;
}
img {
   -ms-interpolation-mode:bicubic;
   padding:0;
   margin:0;
   width:auto;
   height:auto;
   max-width:100%;
   display:inline-block;
}
a {
   font-weight:normal;
   text-decoration:none;
   transition:0.6s ease-in-out;
   color:#222;
}
a:hover{
   opacity:0.7;
   filter:alpha(opacity=0.7);
   color:#c03317;
}


/* スムーズスクロール、ページ内検索スクロール制限 */
html:focus-within {
   scroll-behavior:smooth;
}


/*
============================================================
HEAD / FOOT
============================================================
*/
#header .nav ul,
#header .menu ul,
#footer .nav ul,
#footer .menu ul,
#footer .pagetop,
#main-container {
   margin:auto;
   max-width:1000px;
}

#header{
}
#header .nav {
position:relative;
   display:flex;
   padding-top:0.5em;
}
#header .nav ul{
   display:flex;
   margin-bottom:0.8em;
}
#header .nav ul li {
   width:calc( 100% * 1/2 );
}
#header .nav ul li:nth-child(2) span {
display:block;
}
#header .nav ul li:nth-child(2) span img {
   margin-left:10px;
}
#header .nav .logo{}
#header .nav .tel{}
#header .nav .business_hours{}
#header .nav li:nth-child(2) {
   text-align:right;
}



/* nav menu */
#header .menu,
#footer .menu {
   position:relative;
   background-color:#f7e0aa;
}
#header .menu ul,
#footer .menu ul {
   display:flex;
}
#header .menu li,
#footer .menu li {
   width:calc( 100% * 1/6 );
   margin:5px 0;
   border-style:none solid none none;
   border-color:#aaa;
   border-width:1px;
   text-align:center;
}
#header .menu li a,
#footer .menu li a {
   line-height:30px;
   display:block;
   color:#444;
}
#header .menu li a:hover,
#footer .menu li a:hover {
   background-color:#eee;
   color:#000;
}
#header .menu li:first-child,
#footer .menu li:first-child {
   border-left-style:none;
}
#header .menu li:last-child,
#footer .menu li:last-child {
   border-right-style:none;
}



/* menu button window size 900px */
#header .menu .button_nav { display:none; } /*ボタン初期*/

@media only screen and (max-width:500px) {
#header .nav ul li:nth-child(1) {
   width:calc( 100% * 3/5 );
}
#header .nav ul li:nth-child(2) {
   width:calc( 100% * 2/5 );
}


}

@media only screen and (max-width:900px) {
#header .menu .button_nav {
   display:block;
   position:fixed;
   right:10px;
   width:60px;
   height:55px;
   text-align:center;
   background-color:#000;
   color:#fff;
   z-index:999;
}
#header .menu li{display:none;}
#header .open-menu {
   display:block;
   position:fixed;
   width:100%;
   height:100vh;
   background-color:#f7e0aa;
   transition:0.8s;
}
#header .open-menu ul{
   width:100%;
   max-width:100%;
   display:block;
   padding-left:10px;
   padding-right:10px;
   padding-top:3em;
}
#header .open-menu li{
   width:100%;
   display:block;
   border-style:none none solid none;
   border-color:#aaa;
   border-width:1px;
   text-align:left;
}
}
/******************************/





#footer{}
#footer .pagetop {
/*
   padding-bottom:5px;
   padding-right:10px;
*/
   text-align:right;
   background-color:#f5ebdc;
}
#footer .pagetop a {
   width:160px;
   line-height:26px;
   display:inline-block;
   background-color:#ead2b3;
   text-align:center;
   color:#444;
}
#footer .nav {
   margin-right:left;
   background-color:#f5e7c8;
}
#footer .nav ul {
   padding-top:1em;
   padding-bottom:1.2em;
   display:flex;
}
#footer .nav ul>li {
}
#footer .nav ul>li span,
#footer .nav ul>li a,
#footer .nav ul>li img {
   display:flex;
   justify-content: right;
}
#footer .nav ul>li:first-child {
   padding-right:10px;
}
#footer .nav ul>li .logo{
   margin-bottom:5px;
}
#footer .nav .tel{}
#footer .nav ul>li .business_hours {}
#footer address {
   text-align:center;
   background-color:#f5e7c8;
}






#side-common-container {}
#side-common-container ul{}
#side-FreeContents .side-FreeBody ul li,
#side-common-container ul li {
   margin-bottom:1.8em;
}
#side-common-container ul li:last-child {
   margin-bottom:0;
}