@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);

*{font-family: 'Noto Sans Japanese', sans-serif;}

body div,
body p,
body span,
body strong,
body table th,
body table td,
body table li,
body table a{
   font-family: 'Noto Sans Japanese', sans-serif;
}

body strong{
  font-weight: bold; 
}

body h1,body h2, body h3{
   font-family: 'Noto Sans Japanese', sans-serif;
}

body {
    background:#fff !important; /*背景*/
}

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

table{
    width: 100%;
    border-collapse: collapse;
}

table th{
    background:#f0f0f0; /*背景*/
    border:1px solid #ccc;
    padding:5px;
    margin:0;
    vertical-align:top;
    text-align:left;
    white-space:nowrap;
}

table td{
    border:1px solid #ccc;
    padding:5px;
    margin:0;
    vertical-align:top;
    text-align:left;
}

ul,ol{
    padding:0 0.5em;
    margin:0;
}

li{
    padding:0;
    margin:0;
}

a img:hover{
   opacity:0.5;
}

div.cc-m-all.cc-m-hgrid .cc-m-hgrid-edit{width:100%;}


/* header
------------------------------------------------*/
/* ################### 800 以上 ###################### */

@media screen and (min-width:800px){

#header{
    padding:40px 0 20px;
    background:#fff; /*背景*/
}

#header .inner{
     height:40px;
     position:relative;
}

#header #logo{
    position:absolute;
    bottom:0;
    left:20px;
}

#header #logo img{
    width:100%;
}

#header #headerleft{
    position:absolute;
    bottom:0;
    right:20px;
}

#header ul{
    list-style:none;
    padding:5px 0 0;
    margin:0;
}

#header ul li{
    display:inline-block;
}

#header .searchbox input[type="submit"]{
    padding:1px 6px !important;
    font-size:14px;
}

#header .searchbox input[type="text"]{
    padding:1px 6px !important;
    font-size:14px;
    width:150px;
}

#header #lefttop{
    display:flex;
}

#header #lefttop > div{
    padding:0 0 5px 10px;
}


#header #center a{
    display:block;
    width:156px;
    margin:0 0 0 auto;
}

#header #spmenber{
   display:none;
}

}


/* ################### 800 未満 ###################### */
@media screen and (max-width:800px){


#header{
    padding:20px 0;
    background:#fff; /*背景*/
}

#header .inner{
   display:flex;
   gap:20px;
align-items:center;
}

#header #headerleft{
    display:none;
}

}

/* ################### 680 未満 ###################### */
@media screen and (max-width:680px){

#header{
    background:#FFF;
    padding:0;
    margin:0;
    z-index:1200000;
    position:fixed;
    top:0;
    left:0;
    width:100%;
}

#header .inner{
    margin:0;
    padding:0;
    display:flex;
    width:100%;
    border:1px solid #19A8EA;
    gap:0;
}

#header #logo{
    display:flex;
    align-items:center;
    flex:1;
    padding:5px 10px 5px 5px;
    height:40px;
    box-sizing:border-box;
}

#header #logo img{
   width:calc(100%);
   max-width:310px;
}

#header #spmenber{
  width:calc(100vw / 5);
}

#header #spmenber img{
   width:100%;
   height:auto;
}


#header #menu{
   padding-left:10px;
}

}

/* カスタム検索
------------------------------------------------*/

#header #center a{
    display:block;
    width:156px;
    margin:0 0 0 auto;
}

#header .searchbox{
    max-width:250px;
    
}

.gsc-control-cse,.gsc-control-cse table,.gsc-control-cse table td{
    padding:0 5px 0 0 !important;
    border-style:none;
    line-height:1.0;
}

/* menu
------------------------------------------------*/

#menu-cb{
    display:none;
}


/* ############# 680以上 ############### */
@media screen and (min-width:680px){
#menu{
    display:none;
}

}

/* ############# 680未満 ############### */
@media screen and (max-width:680px){
#menu{
    padding:0;
    margin:0;
}

#menu-icon{
    display:block;
    width:40px;
    height:40px;
    text-align:center;
    background:#19A8EA;
    cursor:pointer;
    line-height:35px;
    color:#FFF;
    font-size:45px;
    box-sizing:border-box;
    flex:0;
}

}


/* navigation
------------------------------------------------*/
/* ################### 680 以上 ###################### */
@media screen and (min-width:680px){

#navigation{
    padding:0;
    margin:0;
    position:relative;
}


#navigation:after{
   width:100%;
   height:1px;
   content:"";
   display:block;
   background:#E6E6E6;
   position:absolute;
   left:0;
   bottom:1px;
   z-index:-1;
}

#navigation ul{
    list-style:none;
    margin:0px;
    padding:0px;
    background:#FFF;
}

#navigation ul li{
    margin:0px;
    padding:0px;
    position:relative;
    box-sizing:border-box;
}

#navigation li a{
    margin:0px;
    padding:0px;
    color:#000; /*文字色*/
    display:block;
    text-decoration:none;
    transition:all 0.4s ease;
}

#navigation li a:hover {
    color:#000; /*文字色*/
}

#navigation ul.cc-nav-level-0{
    width:100%;
    display:flex;
    display:-webkit-flex;
}

#navigation li.jmd-nav__list-item-0{
    flex:auto;
    position:relative;
    margin:0 2px;
}

#navigation li.jmd-nav__list-item-0 > a{
    height:40px;
    padding:0;
    line-height:40px;
    text-align:center;
    font-size:14px;
    font-weight:bold;
    color:#000;
    border-bottom:solid 3px #F0F0F0;
}

#navigation li.jmd-nav__list-item-0.cc-nav-parent > a,
#navigation li.jmd-nav__list-item-0.cc-nav-current > a{
    color:#0172C0; /*文字色*/
    border-bottom:solid 3px #0172C0; /*背景*/

}

#navigation li.jmd-nav__list-item-0.cc-nav-parent > a:after,
#navigation li.jmd-nav__list-item-0.cc-nav-current > a:after{
    color:#000; /*文字色*/
}


#navigation li.jmd-nav__list-item-0 > a:hover{
    background:#eaf1f9; /*背景*/
    color:#0172C0;
    border-bottom:solid 3px #0172C0; 
}

/*
#navigation li.jmd-nav__list-item-0:first-child:before,
#navigation li.jmd-nav__list-item-0:after{
    position:absolute;
    top:0;
    right:0;
    content:"";
    display:block;
    width:1px;
    height:40px;
    background:#FFF;
}
*/

#navigation li.jmd-nav__list-item-0:after{right:0;}
#navigation li.jmd-nav__list-item-0:first-child:before{left:0;}

#navigation ul.cc-nav-level-0 > li > a:after{
    color:#000; /*文字色*/
    font-size:12px;
    display:block !important;
    text-align:center;
}

#navigation ul.cc-nav-level-1{
    min-width:100%;
    background:#fff; /*背景*/
    position:absolute;
    top:43px;
    left:0;
    z-index:500000;
/*    box-shadow:3px 3px 3px rgba(0,0,0,0.3); */
}


#navigation  li.jmd-nav__list-item-1 > a{
     display:block;
     padding:0 10px;
     white-space:nowrap;
     font-size:14px;
     border-top:1px solid #FFF;
     background:#fff;
     color:#FFF;
     overflow:hidden;
     box-sizing:border-box;
     line-height:30px;
     height:0;
}

#navigation li.jmd-nav__list-item-0:hover ul.cc-nav-level-1 > li > a{
    height:30px;
    background:#004DA0;
}

#navigation li.jmd-nav__list-item-1.cc-nav-current > a,
#navigation li.jmd-nav__list-item-1 > a:hover{
     background:#CCDCEC !important;
     color:#004D9F;
}

#navigation ul.cc-nav-level-2{
    display:none;
}

}

/* ################ 680 以下 ################ */
@media screen and (max-width:680px){

#navigation{
    padding:0;
    margin:0;
}

div[data-container="navigation"]{
    height:calc(100vh - 40px);
    position:fixed;
    top:-100vh;
    left:0;
    width:100%;
    background:#19A8EA;
    overflow:auto;
    padding:0 30px;
    transition-duration:0.5s;
    box-sizing:border-box;
    z-index:1000000;
}


input#menu-cb:checked ~ div[data-container="navigation"]{
    top:40px;
}

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

#navigation ul li{
    padding:0;
    margin:0;
    position:relative;
}

#navigation ul li a{
    display:block;
    height:40px;
    line-height:40px;
    padding:0;
    margin:0;
    text-decoration:none;
    color:#FFF;
    text-align:center;
}

#navigation ul li a:hover{
   background:rgba(0,0,0,0.1);
}

#navigation li.cc-nav-current{
  background:#0172C0;
}

#navigation ul.cc-nav-level-0 > li{
    border-bottom:1px solid rgba(255,255,255,0.5);
}

#navigation ul.cc-nav-level-0 > li > a{
    font-weight:bold;
}


#navigation ul.cc-nav-level-1 > li > a{
   padding:0 20px;
   height:0;
   overflow:hidden;
   transition-duration:0.25s;
   background:#D2EEFA;
   color:#333;
}

#navigation ul > li > .jmd-nav__toggle-button{
   position:absolute;
   top:5px;
   right:5px;
   box-sizing:border-box;
   display:inline-block;
   width:30px;
   height:30px;
   line-height:28px;
   text-align:center;
   cursor:pointer;
   font-weight:bold;
   color:#19AAEB;
   background:#FFF;
   border:1px solid #ccc;
}

#navigation ul > li > .jmd-nav__toggle-button:before{
   content:"＋";
}

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

#navigation ul > li.jmd-nav__item--last-opened > ul > li > a{
    height:40px;
}

}

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

.cc-page-index #breadcrumb{
    display:none;
}

#breadcrumb .inner div{
    display:inline;
}

#breadcrumb ol{
    display:inline;
    list-style:none;
    padding:0;
    margin:0;
    font-size:14px;
}

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

#breadcrumb ol li:before{
    content:">";
    margin:0 10px;
}

#breadcrumb ol li a{
    padding:0;
    margin:0;
}



/*main
------------------------------------------------*/

#main{
    padding:20px 0 40px;
    background:#fff;
 }

/* ################### 680 以上 ###################### */
@media screen and (min-width:680px){
#main .inner{
    width:100%;
}
}

/* ################### 680 未満 ###################### */
@media screen and (max-width:680px){
#main .inner{
    padding-top:40px;
}
}


/* content
------------------------------------------------*/
/* ################### 680 以上 ###################### */

@media screen and (min-width:680px){

#content{
    float:left;
    padding:0;
    margin:0;
    width:72%;
}

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

#content h1{
   padding:16px;
   margin:0;
   box-sizing:border-box;
   border-top:5px solid #014DA1;
   border-bottom:2px solid #014DA1;
   color:#014DA3;
}

#content h2{
   padding:14px 0 14px 1.5em;
   margin:0;
   box-sizing:border-box;
   background:linear-gradient(90deg,#FFF,#9DDAF6);
   border:1px solid #e6e6e6;
   position:relative;
}

#content h2:before{
   content:"";
   display:block;
   width:8px;
   height:100%;
   background:linear-gradient(#004DA0 70%,#19A9EA 70%);
   position:absolute;
   top:0;
   left:0;
}

#content h3{
   box-sizing:border-box;
   background:#004D9F;
   padding:9px 12px;
   color:#FFF;
}

}

/* ################### 680未満 ###################### */
@media screen and (max-width:680px){

#content{
    width:100%;
    padding:0;
    margin:0;
}

#content h1,#content h2,#content h3{
    text-align:left;
}


}

/* ################### 500以上 ###################### */
@media screen and (min-width:500px){

#content .j-hgrid{
    display:-webkit-flex;
    display:flex;
    -webkit-flex-wrap:wrap;
    flex-wrap:wrap;
    width:100% !important;
}

#content .j-hgrid  .cc-m-hgrid-column{
    flex:auto;
    min-width:180px;
}

}

/* ################### 500未満 ###################### */
@media screen and (max-width:500px){

#content .j-hgrid{
    display:-webkit-flex;
    display:flex;
    flex-direction:column;
    -webkid-flex-direction:column;
}

#content .j-hgrid  .cc-m-hgrid-column{
    flex:auto;
    width:100% !important;
}
}

/*

#content .j-table #tablehyo th{
    display:block;
}

#content .j-table #tablehyo td{
    display:block;
}

*/


/* sidebar
------------------------------------------------*/
/* ################### 680 以上 ###################### */
@media screen and (min-width:680px){

#sidebar{
    float:right;
    width:25%;
    padding:0;
    margin:0;
}

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

#sidebar #sidenavi ul{
    padding:0;
    margin:0;
    list-style:none;
    box-sizing:border-box;
    position:relative;
}

#sidebar #sidenavi ul li{
    display:block;
    padding:0;
    margin:0;
    position:relative;
}

#sidebar #sidenavi ul li a{
    display:block;
    padding:0;
    margin:0;
    text-decoration:none;
    color:#000; /*文字色*/
    font-size:14px;
    transition:all 0.4s ease;
}
/*
#sidebar #sidenavi ul li a:hover{
   opacity:0.5;
}
*/

#sidebar #sidenavi ul.cc-nav-level-1{
    border:7px solid #CCC;
    margin:0 5px 15px;
}


#sidebar #sidenavi ul.cc-nav-level-1 > li > a{
    border-bottom:1px solid #ccc;
    padding:12px 12px;
}

#sidebar #sidenavi ul.cc-nav-level-1 > li > a:before{
     content:"＞";
     font-size:10px;
     font-weight:bold;
     display:inline-block;
     border:1px solid #CBCBCB;
     background:#F2F2F2;
     width:16px;
     height:16px;
     box-sizing:border-box;
     margin-right:10px;
     color:#19A9E8;
     line-height:14px;
     text-align:center;
}

#sidebar #sidenavi ul.cc-nav-level-1 > li > a:hover,
#sidebar #sidenavi ul.cc-nav-level-1 > li.cc-nav-current > a{
    color:#000; /*文字色*/
    background:#B2C9E2; /*背景*/
}

#sidebar #sidenavi li.jmd-nav__list-item-2 > a{
     padding:10px;
     background:#004DA0;
     color:#FFF;
     border-bottom:1px dashed #FFF;
}

#sidebar #sidenavi li.jmd-nav__list-item-2:last-child > a{
    border:none;
}

#sidebar #sidenavi li.jmd-nav__list-item-2 > a:before{
    content:"▶";
    margin:0 5px;
}

#sidebar #sidenavi li.jmd-nav__list-item-2 > a:hover{
   color:#B2C9E2;
}

#sidebar h2{
    background:#004DA0;
    padding:10px;
    text-align:center;
    color:#FFF;
    font-size:18px;
    font-weight:normal;
}

}

/* ################### 680 未満 ###################### */
@media screen and (max-width:680px){

#sidebar{
    width:100%;
    box-sizing:border-box;
}

#sidebar #sidenavi ul{
    display:none;
}

#sidebar .j-text{
    margin:0;
    display:block;
}
}

/* linkbana
-------------------------------------------------*/
#linkbana{
    padding-bottom:30px;
}


#linkbana ul{
    list-style:none;
    padding:0;
    margin:0;
    display:flex;
    width:100%;
}

#linkbana ul li{
    flex:auto;
}

#linkbana ul li img{
    width:99%;
    height:auto;
}

/* ################### 680 未満 ###################### */
@media screen and (max-width:680px){

#linkbana ul{
    flex-wrap:wrap;
}

#linkbana ul li{
    flex:0;
    margin:5px;
}

#linkbana ul li img{
    height:40px;
    width:auto;
}

}

/* ################### 480 未満 ###################### */
@media screen and (max-width:480px){

#linkbana ul{
    display:block;
}

#linkbana ul li{
    display:block;
    width:100%;
}

#linkbana ul li img{
    height:auto;
    width:auto;
    margin:0 auto;
}

}

/* footer
------------------------------------------------*/
#footer{
    padding:30px 0;
    background:linear-gradient(#99D9F5,#1AAAE9);
}

#footer p,
#footer a,
#footer span,
#footer div{
    color:#000; /*文字色*/
}

#footer #footerblock{
    width:100%;
    position:relative;
}

#footer #footernavi{
    flex:1;
}

#footer #footernavi ul{
    padding:10px 0 5px;
    margin:0;
    list-style:none;
}

#footer #footernavi ul li{
    display:inline-block;
    padding:0 5px;
    border-right:1px solid #333;
    line-height:1.0;
}


#footer #footerlogo{
    position:absolute;
    top:0;
    right:0;
}

#footer .gutter{
    padding:0;
}

#contentfooter .leftrow{
    padding:0;
    margin:0;
    font-size:14px;
    float:none !important;
    line-height:1.7;
}

/* ################### 800 未満 ###################### */
@media screen and (max-width:800px){

#footer #footerlogo{
   width:200px;
}

#footer #footerlogo img{
   width:100%;
}

}

/* ################### 800 未満 ###################### */
@media screen and (max-width:800px){

#footer #footernavi{
   width:100%;
   font-size:14px;
}

#footer #footerlogo{
   position:static;
}

#footer .leftrow{
   width:100% !important;
}

}


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

.datetime.dt-style9.dt-nodefault.dt-alignment-left, .datetime .datetime-inner{
    display:inline !important;
}

.datetime .datetime-inner p{
    display:inline;
}

.blogselection h2{
   display:inline-block;
   font-size:16px;
   background:none !important; /*背景*/
   border:none !important;
   margin:0 !important;
   padding:0 !important;
}

.blogselection h2:before{
    display:none !important;
}

.j-blogSelection .comment,
.j-blogSelection .blogreadmore{
    display:none !important;
}


/* button1
------------------------------------------------*/
.j-calltoaction-link.j-calltoaction-link-style-1{
    background:linear-gradient(#19A8EA 50%,#1996EA 50%) !important; 
    border:none  !important;
    color:#fff !important;
}

.j-calltoaction-link.j-calltoaction-link-style-1:hover{
    background:#00C0DD !important; 
}

/* button2
------------------------------------------------*/

.j-calltoaction-link.j-calltoaction-link-style-2{
    background:#57AE8D !important;
    border:1px solid #4CA986;
    color:#fff !important;
}

.j-calltoaction-link.j-calltoaction-link-style-2:hover{
    background:#A6D4C3 !important;
}

/* button3
------------------------------------------------*/
.j-calltoaction-link.j-calltoaction-link-style-3{
    background:#9797B9 !important;
    border:1px solid #9494B7;
    color:#fff !important;
}

.j-calltoaction-link.j-calltoaction-link-style-3:hover{
    background:#C3C3D7 !important;
}

/* techbox
---------------------------------------------------------*/
ul.techbox{
   padding:0 0 0 45%;
   margin:0;
   list-style:none;
   background:url(https://u.jimcdn.com/cms/o/s745e7144df48b391/userlayout/img/brochure2025.jpg?t=1738730894)  no-repeat;
   background-size:42%;
}

ul.techbox li{
   line-height:1.3;
   font-size:14px;
   margin-bottom:3px;
   text-align:left;
}

ul.techbox li.flgjpn > a:before{background:url(https://u.jimcdn.com/cms/o/s745e7144df48b391/userlayout/img/flg-jpn.jpg?t=1496316166) no-repeat;}
ul.techbox li.flgeng > a:before{background:url(https://u.jimcdn.com/cms/o/s745e7144df48b391/userlayout/img/flg-eng.jpg?t=1496316152) no-repeat;}
ul.techbox li.flgchn > a:before{background:url(https://u.jimcdn.com/cms/o/s745e7144df48b391/userlayout/img/flg-chn.gif?t=1496316144) no-repeat;}
ul.techbox li.flgesp > a:before{background:url(https://u.jimcdn.com/cms/o/s745e7144df48b391/userlayout/img/flg-esp.gif?t=1496316159) no-repeat;}
ul.techbox li.flgprt > a:before{background:url(https://u.jimcdn.com/cms/o/s745e7144df48b391/userlayout/img/flg-prt.gif?t=1496316172) no-repeat;}
ul.techbox li.flgpyc > a:before{background:url(https://u.jimcdn.com/cms/o/s745e7144df48b391/userlayout/img/flg-pyc.gif?t=1496316179) no-repeat;}
ul.techbox li.flgtie > a:before{background:url(https://u.jimcdn.com/cms/o/s745e7144df48b391/userlayout/img/flg-tie.png?t=1496316185) no-repeat;}

ul.techbox li a:before{
    margin:0 10px 0 0;
    content:" ";
    display:inline-block;
    width:34px;
    height:22px;  
    background-size:cover;
    background-position:center center;
    vertical-align:middle;
    border:1px solid #ccc;
    margin-left:0;
    z-index:1000000;
}