*{}

body{background:#FFF;}

p,a,span,th,td,div,li,strong,h2{
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important;
}

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

/* translate 
--------------------------------------------------*/
#translate{
   overflow:hidden;
   display:none;
}

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

#translate .goog-te-menu-value img,
#translate .goog-te-gadget-icon{
   display:inline;
}

#translate .skiptranslate,
#translate .google_translate_element{
   float:right;
   display:inline;
}

/* header
--------------------------------------------------*/
#header{
    border:#069;
    padding:15px 0 15px;
}

#header .inner{
    position:relative;
}

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

#header #logo{
    display:inline-block;
    height:44px;
}

#header #company{
    display:inline-block;
    height:44px;
}


#header #contact{
    position:absolute;
    top:10px;
    right:20px;
}

/* serach */

#header #search{
   position:absolute;
   top:10px;
   right:230px;
   display:inline-block;
   width:230px;
}

#header #search .cse .gsc-control-cse,
#header #search .gsc-control-cse{
    padding:0;
    background:none;
    background-color:none;
    border:none;
}

#header #search table input[type="text"]{
    height:22px;
    border:1px solid #666 !Important;
    font-size:14px;
}

input.gsc-input, .gsc-input-box, .gsc-input-box-hover, .gsc-input-box-focus{
    border:none !important;
}

#header #search table.gsc-search-box td.gsc-input,
#header #search .gsib_a{
   padding:0;
}

/* serach */

#header #logo img{
  max-width:50px;
  height:auto;
}

}
/* ############# 780px 以下 ############### */
@media (max-width: 780px) {

#header #logo,
#header #company,
#header #contact,
#header #search{
    position:static;
    text-align:center;
    display:block;
    width:100%;
}

#header #search{
    padding:5px 0;
}

#header #search *{
    font-size:14px;
}

#header #logo img,
#header #company img,
#header #contact img{
   margin:0 auto;
   padding:5px;
}


}
    
/* navigation
--------------------------------------------------*/
/* ############# 780px 以上 ############### */
@media (min-width: 780px) {

#menu{
    display:none;
}

#navigation{
    border-top:2px solid #058;
    border-bottom:2px solid #058;
    background:#069;
    background-image: linear-gradient(90deg, #069 0%,#069 50%, #058 50%, #058 100%);
    background-size: 10px 10px;
}

#navigation ul.cc-nav-level-0{
    list-style:none;
    padding:5px 0;
    margin:0;
    text-align:center;
}

#navigation ul.cc-nav-level-0 > li{
    display:inline-block;
    padding:0;
    margin:0;
    position:relative;
}

#navigation ul.cc-nav-level-0 > li > a{
    display:inline-block;
    height:40px;
    line-height:40px;
    padding:0px 30px;
    margin:0;
    text-decoration:none;
    color:#FFF;
    transition-duration:0.4s;
}

#navigation ul.cc-nav-level-0 > li.cc-nav-parent > a,
#navigation ul.cc-nav-level-0 > li.cc-nav-current > a,
#navigation ul.cc-nav-level-0 > li > a:hover{
    background:rgba(0,0,0,0.3);
}

#navigation ul.cc-nav-level-1{
    padding:0;
    margin:0;
    list-style:none;
    position:absolute;
    top:40px;
    left:0;
    width:auto;
    display:none;
    background:#eee;
    border:1px solid #999;
    border-top:none;
    transition-duration:0.4s;
    z-index:100000;
}

#navigation ul.cc-nav-level-0 > li:hover ul.cc-nav-level-1{
    display:block;
}


#navigation ul.cc-nav-level-1 li{
   border-top:1px solid #fff;
   border-bottom:1px solid #ddd;
   padding:0;
   margin:0;
}

#navigation ul.cc-nav-level-1 li:last-child{
   border-bottom:none;
}

#navigation ul.cc-nav-level-1 li a{
   text-align:left;
   text-decoration:none;
   color:#333;
   display:block;
   padding:5px 10px;
   margin:0;
   white-space:nowrap;
   transition-duration:0.4s;
}

#navigation ul.cc-nav-level-1 li a:hover{
  background:rgba(0,0,0,0.3);
  color:#FFF;
}

}

/* ############# 780px 以下 ############### */
@media (max-width: 780px) {

#menu{
    background-image: linear-gradient(#069 40%,#058 60%);
    padding:0;
    margin:0 0 10px;
    height:40px;
    line-height:40px;
    color:#FFF;
    text-align:center;
    cursor:pointer;
    border-radius:5px;
}

#navigation ul{
    background:#00486C;
    list-style:none;
    padding:0;
    margin:0;
    display:none;
}

#navigation ul li{
    list-style:none;
    padding:0;
    margin:0;
   position:relative;
}

#navigation ul li a{
   display:block;
   height:40px;
   line-height:40px;
   padding:0 10px;
   text-decoration:none;
   border-bottom:1px solid rgba(200,200,200,0.5);
}

#navigation ul li .jmd-nav__toggle-button{
   position:absolute;
   top:0;
   right:0;
   display:block;
   width:40px;
   height:40px;
   cursor:pointer;
}

#navigation ul li .jmd-nav__toggle-button:before{
   content:"＋";
   display:block;
   background:#FFF;
   border:1px solid #333;
   width:30px;
   height:30px;
   line-height:30px;
   margin:5px;
   text-align:center;
   box-sizing:border-box;
   border-radius:5px;
}

#navigation ul li.jmd-nav__item--last-opened .jmd-nav__toggle-button:before{
   content:"－";
}


#navigation ul li a:hover{
   opacity:0.5;
}

#navigation ul.cc-nav-level-0{
   border:1px solid #00486C;
}

#navigation .jmd-nav__list-item-0 > a{
   color:#FFF;
}

#navigation ul.cc-nav-level-1{
   display:none;
   background:#FFF;
}

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

}

/* container
--------------------------------------------------*/
#container{
    padding:20px 0 40px;
}


/* contact
--------------------------------------------------*/
#content{
    width:73%;
    float:left;
    box-sizing:border-box;
}

#content h1{
   padding:0;
   margin:0;
}

#content h2{
    background:#999;
    background-image:linear-gradient(45deg, #eeeeee 0%,#eeeeee 50%, #f5f5f5 50%, #f5f5f5 100%);
    background-size:3px 3px;
    padding:7px 10px 5px;
    margin:0;
    color:#058;
}

#content h3{
    border:1px ridge #eee;
    border-top:5px ridge #069;
    border-bottom:5px double #FFF;
    background:#f0f0f0;
    padding:5px 10px 3px;
    margin:10px 0 0;
}

body.cc-indexpage #content{
   width:100%;
}

/* ############# 640px 以下 ############### */
@media (max-width: 640px) {

#content{
    width:100%;
    float:none;
}

#content .j-hgrid .cc-m-hgrid-column{
       display:block;
       width:100% !important;
   }
}
/* sidebar
--------------------------------------------------*/
#sidebar{
    padding:50px 0 0;
    margin:0;
    box-sizing:border-box;
    width:24%;
    float:right;
}

#sidebar #mainNav2{
   list-style:none;
   padding:0;
   margin:0;
}

#sidebar #mainNav2:before{
   content:"menu";
   display:block;
   box-sizing:border:box;
   padding:3px 10px;
   background:#069;
   color:#fff;
}

#sidebar #mainNav2 > li{
   padding:0;
   margin:0;
}

#sidebar #mainNav2 > li a{
   display:block;
   text-decoration:none;
   padding:5px 10px;
   font-size:14px;
   margin:0;
   border-bottom:1px solid #ccc;
   color:#333;
   transition-duration:0.4s;
}

#sidebar #mainNav2 > li a:hover{
   opacity:0.5;
}

#sidebar #mainNav2 > li a.current{
   font-weight:bold;
}

body.cc-indexpage #sidebar{
    display:none;
}

/* ############# 640px 以下 ############### */
@media (max-width: 640px) {
#sidebar{
    width:100%;
    float:none;
}

#sidebar .j-nav-variant-standard{
   display:none;
}

}

/* footer
--------------------------------------------------*/
#footer{
    padding:20px 0 40px;
    background:#069;
}

#footer div,
#footer p,
#footer span,
#footer a{
   color:#fff;
}


/* blog
--------------------------------------------------*/

.blogselection .datetime{
    display:inline-block;
}

.blogselection h2{
    line-height:1.0 !important;
    font-size:16px !important;
    padding:0 0 5px !important;
    margin:0 !important;;
    background:none !important;
    font-weight:normal;
    position:none;
}

.cc-page-blog  .datetime p.yr,
.cc-page-blog  .datetime p.mon,
.cc-page-blog  .datetime p.day,
.blogselection .datetime p.yr,
.blogselection .datetime p.mon,
.blogselection .datetime p.day{
    line-height:1.0 !important;
    font-size:16px !important;
    padding:0 !important;
    margin:0 !important;;
    background:none !important;
    font-weight:normal;
    position:none;
    float:left;
    color:#333;
}

.cc-page-blog .datetime.dt-style9{
    display:block;
    height:20px;
}

.cc-page-blog h1.j-blog-header{
   padding:10px 0 0 !important;
   border-top:1px solid #069;
   color:#333 !important;
}

.cc-page-blog .postmeta{
   font-size:14px;
}

.blogselection .blogreadmore,
.blogselection .comment{
    display:none !important;   
}