@charset "UTF-8";



main section.top {

background: #54a3db url(../img/top/bg.jpg) center center no-repeat;
background-size: cover;
overflow: hidden;

}

main section.top .content{
width:1000px;
margin:0 auto;
padding:60px 0 0 25px ;
height:600px;
position: relative;

}


main section.top p{
line-height: 0;
padding:0 0 15px 0;
}



main section.top .support li{
line-height: 0;
margin:0 0 5px 0;
}



main section.top  .pagenavi{
margin:100px;
display:flex;
justify-content: center;
align-items: flex-start;
align-content: flex-start;
}

main section.top  .pagenavi li{
margin:0 5px;
}


main section.top .pcimg{
position:absolute;
top:47px;
left:560px;
}

main section.news {
width:1100px;
margin:0 auto;
}

main section.news ul li{
display:flex;
justify-content: flex-start;
align-items: flex-start;
align-content: flex-start;
border-bottom:1px solid #3f8acb;
padding:35px 0 25px 75px;
}

main section.news ul li .date{
display: block;
color:#3f8acb;
}

main section.news ul li .title{
display: block;
padding:0 0 0 20px;
color:#000;
text-decoration: none;
}

main section.system{
margin:100px 0 0 0;
}

main section.system h2{
margin:0 0 35px 0;
text-align: center;
}

main section.system .gradation{
background: #3f8acb ;
background: -moz-linear-gradient(left,  #3f8acb 0%, #58b6ec 100%);
background: -webkit-linear-gradient(left,  #3f8acb 0%,#58b6ec 100%);
background: linear-gradient(to right,  #3f8acb 0%,#58b6ec 100%);

}

main section.system h3{
margin: 0 0 1em 0;
height:80px;
color:#fff;
display: flex;
justify-content: center;
align-items: center;
align-content: center;
font-size: 1.3em;
background: url(../img/system/sankaku.svg) 95% center no-repeat;
cursor:pointer;
}
main section.system h3 strong { font-size: 1.3em; padding: 0.25em; }
main section.system h3.open{ background-image: url(../img/system/sankaku_open.svg); }

main section.system .part{
display: none;
width:1000px;
margin: 0 auto 60px auto;

}



main section.system .part ul {
display:flex;
justify-content: space-between;
align-items: flex-start;
align-content: flex-start;
flex-wrap: wrap;
padding: 2em 0 0;
}

main section.system .part ul li{
width:320px;
margin:0 5px 70px 5px;

}

main section.system .part ul li h4{
margin:0 0 1em 0;
}


main section.system .part ul li p.caption{
padding:0 25px 0 44px;
height:7em;
font-size:0.85em;
line-height:1.6em;
}

main section.system .part ul li p.thumbnail{
padding:10px 0 0 42px;
}



main section.consulting h2{
text-align: center;
margin:0 0 45px 0;
}

main section.consulting .part{
background: #ebf3fa;
background: -moz-linear-gradient(top,  #ebf3fa 0%, #ffffff 100%);
background: -webkit-linear-gradient(top,  #ebf3fa 0%,#ffffff 100%);
background: linear-gradient(to bottom,  #ebf3fa 0%,#ffffff 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebf3fa', endColorstr='#ffffff',GradientType=0 );

}


main section.consulting .part .content{
width:980px;
margin:0 auto;
display: flex;
justify-content: flex-start;
align-content: flex-start;
align-items: flex-start;

}



main section.consulting .part.kouka .content{
flex-direction: row-reverse;
}

main section.consulting .part .content .text{
width:490px;
padding:40px 0 0 0 ;
}

main section.consulting .part .content .text h3{
margin:0 0 25px 0;
}

main section.consulting .part .content .text ul{
background:#3f8acb;
color:#fff;
padding:20px;
padding-left: 3em;
list-style-type: disc;
}

main section.consulting .part .content .text ul li{
margin:0 0 0 0;
line-height:2em;
}

main section.consulting .part .content .text p{
margin:1em 0 0 0;

}



main section.consulting .part .content .illust{
width:490px;
position:relative;
}

main section.consulting .part.kadai .content .illust{
height:365px;
}

main section.consulting .part.kouka .content .illust{
height:330px;
}

main section.consulting .part.shien .content .illust{
height:530px;
}


main section.consulting .part.kadai .content .illust img{
position: absolute;
bottom:0;
left:46px;
}

main section.consulting .part.kouka .content .illust img{
position: absolute;
top:25px;
right:68px;

}

main section.consulting .part.shien .content .illust img{
position: absolute;
top:78px;
left:20px;
}




main section.jirei h2{
text-align: center;
margin:100px 0 30px 0;
}


main section.jirei .slick{
opacity: 0;
color:#000;
}



main section.jirei .slick .slick-slide{
width:320px;
border:3px solid #3f8acb;
border-top-width: 10px;
margin:0 5px;
overflow:hidden;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}


main section.jirei .slick .thumb a{
    display: block;
line-height:0;
text-align: center;
height:187px;
overflow: hidden;
}

main section.jirei .slick .thumb a img{
margin:0 auto;
object-fit: cover; 
height:187px;
width:100%;
}


main section.jirei .slick h3{
color:#fff;
background:#3f8acb;
padding:1em;
text-align: center;
font-size:1.1em;
display: flex;
align-items: center;
justify-content: center;
}

main section.jirei .slick  p{
color:#000;
min-height:138px;
padding:1em;
font-size:0.9em;
}

main section.jirei .slick .prev-arrow{position:absolute;left:20px;top: 0;bottom: 0;margin: auto 0;z-index:10;cursor: pointer;}
main section.jirei .slick .next-arrow{position:absolute;right:20px;top: 0;bottom: 0;margin: auto 0;z-index:10;cursor: pointer;}


main section.jirei .pc .slick.noslick{
display:flex;
justify-content: center;
align-items: flex-start;
align-content: flex-start;
opacity:1;
}

main section.jirei .pc .slick.noslick li{
width:320px;
border:3px solid #3f8acb;
border-top-width: 10px;
margin:0 5px;
overflow:hidden;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}




main section.denshi{
width:1000px;
margin: 0 auto;
}

main section.denshi h2{
text-align: center;
margin:65px 0 0 0;
}


main section.denshi .part h3{
text-align: center;
margin:45px 0 25px 0;
}

main section.denshi .part .box{
text-align: center;
width:320px;
margin: 0 auto;
}

main section.denshi .part .box p{
font-size:1.2em;
color:#3f8acb;

}


main section.denshi .part ul{
display:flex;
justify-content: center;
align-items: flex-start;
align-content: flex-start;

}

main section.denshi .part .box{
padding: 0 5px;

}





@media screen and (max-width: 750px) {


    main {
        font-size:0.8em;
    }

    main section h2 img{
    height:5vw;
    }

    main section{
        padding:0;
    }

    main section#system,
    main section#consulting,
    main section#jirei{
        padding:47px 0 0 0;
    }
    main section#denshi{
        padding:47px 0 1em 0 ;
    }


    main section.top .content{
        height:auto;

        width:100%;
        padding:7vw 7vw 3vw 7vw;

    }
    


    main section.top .pagenavi{
    margin:20px 0 0 0;
    flex-wrap: wrap;

    }

    main section.top .pagenavi li{
    width:40%;
    }

    main section.top .pcimg{
    position:static;
    margin-left:0;
    top:auto;
    left:auto;
    margin:20px 0 0 0;
    }

    main section.news {
    width:auto;
    margin:0 auto;
    }


    main section.news ul li{
    padding:0.5em 0 0.5em 1em;
    }

    main section.news ul li .title{
    padding:0 0 0 1em;
    }

    main section.system {
        margin: 0 0 0 0;
    }

    main section.system h2{
        margin:0  0 1em 0;
    }

    main section.system h3{
    margin: 0 0 1em 0;

    height:15vw;
    color:#fff;

    display: flex;
    justify-content: flex-start;


    background: url(../img/system/sankaku.svg)  95% center no-repeat #3f8acb ;
    background: url(../img/system/sankaku.svg)  95% center no-repeat -moz-linear-gradient(left,  #3f8acb 0%, #58b6ec 100%);
    background: url(../img/system/sankaku.svg)  95% center no-repeat -webkit-linear-gradient(left,  #3f8acb 0%,#58b6ec 100%);
    background: url(../img/system/sankaku.svg)  95% center no-repeat linear-gradient(to right,  #3f8acb 0%,#58b6ec 100%);

    font-size:3.5vw;
    padding:0 4em 0 1em;
    background-size: 25vw auto;
    }
	main section.system h3 img { height:6vw; }
    main section.system .part{
    width:100%;
    }



    main section.system .part ul li{
    width:50%;
    margin:0; 
    padding:0 2vw 4vw;
    }

    main section.system .part ul li h4{
    margin:0 0 1em 0;
    }

    main section.system .part ul li h4 img{
        height:8vw;
    }


    main section.system .part ul li p.caption{
    padding:0 0 0 0;
    height:auto;
    }

    main section.system .part ul li p.thumbnail{
    padding:10px 0 0 0;
    }


    main section.system .part.part1 ul li:nth-of-type(1) p.caption{ height:12em;}
    main section.system .part.part1 ul li:nth-of-type(2) p.caption{ height:12em;}
    main section.system .part.part1 ul li:nth-of-type(3) p.caption{ height:7em;}
    main section.system .part.part1 ul li:nth-of-type(4) p.caption{ height:7em;}
    main section.system .part.part1 ul li:nth-of-type(5) p.caption{ height:12em;}
    main section.system .part.part1 ul li:nth-of-type(6) p.caption{ height:12em;}

    main section.system .part.part2 ul li:nth-of-type(1) p.caption{ height:9em;}
    main section.system .part.part2 ul li:nth-of-type(2) p.caption{ height:9em;}
    main section.system .part.part2 ul li:nth-of-type(3) p.caption{ height:9em;}

    main section.consulting h2{
        margin:0  0 1em 0;
    }


    main section.consulting .part .content{
    width:100%;
    flex-wrap: wrap;
    padding:0 5%;
    }

    main section.consulting .part.kouka .content{
    flex-direction: initial;
    }


    main section.consulting .part .content .text{
    width:100%;
	padding: 2em 0 0;

    }


    main section.consulting .part .content .text h3{
    margin:0 0 1em 0;
    text-align: center;
    }

    main section.consulting .part.shien .content .text{
    text-align: center;

    }

    main section.consulting .part .content .text ul{
    		padding:2vw 2vw 2vw 3em;
    }


    main section.consulting .part.shien .content .text img.flowchart{
    width:90%;
    }



    main section.consulting .part .content .illust{
    width:100%;
    margin:20px 0 0 0;
    text-align: center;
    line-height:0;

    }


    main section.consulting .part.kadai .content .illust{
    height:auto;

    }

    main section.consulting .part.kouka .content .illust{
    height:auto;
    padding:0 0 20px 0;
    }

    main section.consulting .part.shien .content .illust{
    height:auto;
    }



    main section.consulting .part.kadai .content .illust img{
    position: static;
    bottom:auto;
    left:auto;
    }

    main section.consulting .part.kouka .content .illust img{
    position: static;
    top:auto;
    right:auto;

    }

    main section.consulting .part.shien .content .illust img{
    position: static;
    top:auto;
    left:auto;
    width:80%;
    }


    main section.jirei h2{
        margin:0  0 30px 0;
    }

    main section.jirei .slick .slick-slide{
    width:290px;
    border:2px solid #3f8acb;
    border-top-width: 10px;
    margin:0 5px;
    overflow:hidden;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    }

    main section.jirei .slick .slick-slide h3{
		height: auto;
	}
    main section.jirei .slick .prev-arrow{position:absolute; width:13vw; left:1vw;top: 0;bottom: 0;margin: auto 0;z-index:10;}
    main section.jirei .slick .next-arrow{position:absolute; width:13vw; right:1vw;top: 0;bottom: 0;margin: auto 0;z-index:10;}


    main section.denshi{
    width:100%;
    margin: 0 auto;
    }


    main section.denshi h2{
        margin:0  0 1em 0;
    }

    main section.denshi .part h3 {
		margin: 1em 0;
	}
    main section.denshi .part h3 img{
    height:10.5vw;
    }

    main section.denshi .part .box{
    width:50%;
    margin: 0 auto;

    }

    main section.denshi .part ul{

    flex-wrap: wrap;
    justify-content: flex-start;
    }

    main section.denshi .part ul .box{
    margin: 0 0 2% 0;

    }


}