@charset "UTF-8";
*{padding:0;margin:0;box-sizing:border-box;box-sizing:border-box;}
html,body{padding:0;margin:0;background:#F8F8F8;}

/* 全体背景色 #F8F8F8; */


.inner{
    width:100%;
    max-width:1240px;
    padding:0 20px;
    margin:0 auto;
    box-sizing:border-box;
}

/* 一般的なカラム編集 */
@media(max-width:880px){
body #container #content_area .j-hgrid .cc-m-hgrid-column{
    width:100% !important;
    float:none;
    padding:0;
    top:0;
    right:0;
    bottom:0;
    left:0;
}
body #container #content_area .j-hgrid .cc-m-hgrid-column > div{
    max-width:440px;
    margin:0 auto;    
}

}

/* #hside
---------------------------------------------*/
#hside{
    background:#0087C6;
    color:#FFF;
}

#hside .inner{
    position:relative;
    display:flex;
    justify-content:flex-end;
    padding:5px 20px;
}

#hside .inner > div{
   display:inlin-block;
   margin-left:20px;
}

/* search */

#search{
    padding:0;
}

#search input[type="text"]{
    width:150px;
}

#search input[type="submit"]{
     padding:4px 10px 1px;
     border-radius:3px;
     border:1px solid #7E9DB9;
     background:linear-gradient(#f7f7f7,#f0f0f0);
}

#search button{
     padding:4.5px 10px;
     line-height:1.0;
}

#search input{
    font-size:12px;
}

/* translate */

#translate{
    padding:0;
    text-align:right;
    z-index:100000000;
    display:none;
}

#translate div img,
#translate div span{
    display:inline;
}

#translate .goog-te-gadget-simple{
    line-height:1.0;
    padding:1.5px 0;
}

#menu{
    position:absolute;
    top:100%;
    right:20px;
    width:44px;
    height: 40px;
    background:#0087C6;
    border-radius:0 0 5px 5px;
    padding-top:2px;
    display:none;
    cursor:pointer;
    z-index:1000000;
}

label#menu-icon {
    font-weight: normal;
    text-align:center;
    display:block;
    font-size: 44px;
    color: #FFF;
    box-sizing: border-box;
    cursor: pointer;
    color:#FFF;
    padding:0;
    margin:0;
}

@media(max-width:880px){
   #menu{
      display:block;
   }

   #translate,#search{
     display:none;
   }
}


/* header
---------------------------------------------*/
header{
    padding:0;
    margin:0;
    position:relative;
}

header .inner{
    display:flex;
    justify-content: space-between;
}

header #logo{
    width:auto;
    display: flex;
    align-items: center;
}

header{
    border-bottom:1px solid #0087C688;
}

/* header nav
---------------------------------------------*/
#menu-cb{
    display:none;
}

header nav{
   width:calc(100% - 100px);
   max-width:700px;
/*   z-index:10000000000; */
}

header nav ul{
    list-style:none;
    padding:0;
    margin:0;
}

header nav ul li{
    padding:0;
    margin:0;
    position:relative;
}

header nav ul li a:link,
header nav ul li a:visited{
    color:#111;
    font-size:14px;
    text-decoration:none;
    display:block;
    transition-duration:0.5s;
}

  header nav ul.cc-nav-level-1,
  header nav ul.cc-nav-level-2{
/*    display:none; */
  }

/* ############# 880px 以上 ############# */
@media(min-width:881px){

  header nav ul.cc-nav-level-0{
    display:flex;
    justify-content: space-between;
  }

  header nav ul.cc-nav-level-0 > li{
    flex:auto;
  }

  header nav ul.cc-nav-level-0 > li > a{
    width:100%;
    height:80px;
    display:block;
    text-align:center;
    padding-top:28px;
  }

  header nav ul.cc-nav-level-0 > li > a:hover{
    color: #0087C6;
  }

  header nav ul li{
    position:relative;
  }

  header nav ul.cc-nav-level-1{
    position:absolute;
    top:60px;
    left:0;
    z-index:10000;
    background:#F8F8F8;
    width:100%;
    min-width:max-content;
    border:none;
  }

  header nav ul.cc-nav-level-1 a:link{
    display:flex;
    align-items: center;
    height:0;
    padding:0 20px;
    overflow: hidden;
  }

  header nav ul.cc-nav-level-1 a:hover{
    background:#FFF;
    color: #0087C6;
  }

  header nav ul.cc-nav-level-0 > li:hover ul.cc-nav-level-1{
    border:none;
    border-bottom:3px solid #0087C6;
    box-shadow:3px 3px 7px #0003;
  }

  header nav ul.cc-nav-level-0 > li:hover ul.cc-nav-level-1 a:link{
    height:40px;
    border-top:1px dotted #0087C6;
  }

}

/* ############# 880px 以下 ############# */
@media(max-width:880px){
  header nav{
    position:absolute;
    top:-10px;
    left:-100vw;
    z-index:10000;
    width:calc(100% - 84px); 
    box-shadow:3px 3px 7px #0003;
    transition-duration:1s;
    opacity:0;
    transform: scale(0);
    transform-origin: top left;
    z-index:1000000000;
  }

  input#menu-cb:checked + nav{
    opacity:1;
    left:0;
    transform: scale(1);
  }
 
  header nav ul{
    background:#0087C6;
  }

  header nav ul li a{
     min-height:40px;
     line-height:1.3;
  }

   header nav ul li .jmd-nav__toggle-button{
      position:absolute;
      top:0;
      right:0;
      display:flex;
      width:40px;
      height:40px;
      cursor: pointer;
      outline: 1px solid #8CC7E5;
      outline-offset: -5px;
      justify-content: center;
      padding-top:5px;
      border-radius:5px;
   }

   header nav ul li .jmd-nav__toggle-button:before{
    content: "＋";
    font-size: 30px;
    color:#8CC7E5;
   }

   header nav ul li.jmd-nav__item--last-opened > .jmd-nav__toggle-button:before{
      content:"－";
   }

   header nav ul.cc-nav-level-0 > li > a{
    color:#FFF;
    padding:10px 60px 7px 1em;
    border-bottom:1px solid #FFF3;
  }

   header nav ul.cc-nav-level-1,
   header nav ul.cc-nav-level-2{
      display:none;
      background:#F8F8F8;
      box-shadow:0px 2px 4px 1px #0003 inset,0px -2px 4px 1px #0002 inset;
   }

   header nav ul.cc-nav-level-2{
      background:#FFF;
   }

   header li.jmd-nav__item--last-opened > ul{
      display:block;
   }

   header nav ul.cc-nav-level-1 > li > a{
     padding:10px 60px 7px 2em;
     border-bottom:1px solid #0087C633;
     color:#0087C6;
   }

   header nav ul.cc-nav-level-2 > li > a{
     padding:10px 60px 7px 2.5em;
     border-bottom:1px solid #0087C633;
     color:#666;
   }

}

/* breadcrumb
---------------------------------------------*/
#breadcrumb{
   padding:10px 0;
}

#breadcrumb * {
   font-size:14px;
}

#breadcrumb .inner{
   display:flex;
}

#breadcrumb ol{
   list-style:none;
   padding:0;
   margin:0;
}

#breadcrumb ol li{
   display:inline-block;
   padding:0 10px;
   margin:0;
}

#breadcrumb a{
   color:#333;
   font-size:14px;
   display:inline-block;
   margin:0;
}

#breadcrumb ol li:before{
   content:"＞ ";
}


/* container
---------------------------------------------*/
#container{
    min-height:400px;
    padding:0 0 40px;
    margin:0;
}

/* main
---------------------------------------------*/
main{
    padding:0;
    margin:0;
}

main h1{
    padding:0 0 15px;
    line-height:1.0;
    margin-bottom:20px;
/*    border-bottom:4px solid #0087C6; */
}

main h2{
    padding:13px 12px 10px;
    margin:10px 0;
    line-height:1.0;
    color:#0087C6;
/*    border:1px solid #0087C6; */
    border-left:15px solid #0087C6;
    background:#E8ECF2;
}

main h3{
    padding:7px 12px 5px;
    margin:0;
    line-height:1.3;
    color:#FFF;
    background:#0087C6;
}

/* #sidebar
---------------------------------------------*/
#sidebar{
    padding:40px 0 20px;
    margin:0;
    background:#555;
}

#sidebar *,#sidebar a:link,#sidebar a:visited{
    color:#FFF;
}


/* footer
---------------------------------------------*/
footer{
    padding:0;
    margin:0;
    background:#555;
}

footer .inner{
    padding:20px;
    border-top:1px solid #FFF;
    display:flex;
    justify-content: space-between;
}

footer *,footer a:link,footer a:visited{
    color:#FFF;
}

body footer #copyright{
    width:100%;
    max-width:400px;
    font-size:12px;
}

body div#contentfooter div.leftrow {
    float:none;
    text-align: right;
    width:auto;
}

body div#contentfooter{
   width:auto;
}

body div#contentfooter .jimdo-free-footer-ad{
    display:none;
}

@media(max-width:780px){
    footer .inner{
        display:block;
    }
}


/* button
-------------------------------------------*/
.j-callToAction a.j-calltoaction-link-style-1{
   height:auto;
   margin:0;
   padding:12px 20px;
   font-size:14px;
   border-radius:7px;
   background-color:#FFF;
   color:#0087C6 !important;
   border:1px solid #0087C6;
}

.j-callToAction a.j-calltoaction-link-style-2{
    background:#0087C6;
    padding:6px 20px;
    border:none;
}

.j-callToAction a.j-calltoaction-link-style-3{
    background:#0087C6;
    padding:6px 20px;
    border:none;
}

.j-callToAction a.j-calltoaction-link-style-1:hover,
.j-callToAction a.j-calltoaction-link-style-2:hover,
.j-callToAction a.j-calltoaction-link-style-3:hover{
    transition-duration: 0.5s;
    background:#0059AA;
}

.j-callToAction a.j-calltoaction-link-style-1:hover{
    color:#FFF !important;
}