@charset "UTF-8";
/* CSS Document */

#mv{
	background-image: url(../images/bg_mv.jpg);
}

#mv1 {
    position: absolute;
    left: -90%;
    top: 100px;
    width: 80%;
    height: 1px;
    background: #FFF;
    z-index: 300;
}
#mv2 {
    position: absolute;
    right: -90%;
    bottom: 100px;
    width: 80%;
    height: 1px;
    background: #FFF;
    z-index: 300;
}

.select{
 margin: 0 0 70px 0;
}
.select--insert .box{
 margin: 0 0 30px 0;
 display: flex;
 justify-content: space-between;
 font-size: 15px;
 line-height: 180%;
}
.select--insert .box .md {
 width: 180px;
 color: #3d66aa;
 position: relative;
 font-weight: bold;
 font-size: 16px;
}
.select--insert .box .md::after{
 content: '※複数選択可';
 display: block;
 position: absolute;
 font-size: 12px;
 color: #999;
 margin: 0px 0 0 0;
 font-weight: normal;
 
}
.select--insert .box .md span{
 display: block;
 font-size: 12px;
 color: #999;
 margin: 0px 0 0 0;
}
.select--insert .box .check-list {
 width: calc(100% - 180px);
 display: flex;
 flex-wrap: wrap;
 justify-content:flex-start;
 gap:2px 0;
}
input[type=checkbox] {
    display: none;  
}
label {
    display:inline-block;
    width:20%;
}
label span{
 display: block;
    background: #F0F4F7;
    -webkit-border-radius:4px;
    -mozborder-radius:4px;
    border-radius:4px;
    padding: 5px;
    cursor:pointer;
    text-align: center;
    font-size: 14px;
    border: 1px solid #eee;
    margin: 5px;
}
div.changed {
    color: #000;
}
input[type=checkbox]:checked + span {
    color: #fff;
    background-color: #3d66aa;
}

input[type=submit]{
 -webkit-appearance: none;
 font-size: 15px;
 padding: 13px 0px;
 background-color: #3d66aa;
 color: #fff;
 border-style: none;
 width: 100%;
 border: 1px solid #fff;
 -webkit-appearance: none;
 width: 35%;
}

.bt-search{
 margin: 50px 0 0 180px;
 text-align: center;
 background-color: #f1f1f1;
 padding: 15px;
}

.works--insert {
    margin: 0 auto;
    max-width: 1200px;
    width: 97%;
    overflow: hidden;
}

.works-list{
 display: flex;
 justify-content: space-between;
 flex-wrap: wrap;
 gap:50px 0;
}
.works-list::after{
 content: '';
 display: block;
 width: 30%;
}
.works-list .item{
 width: 30%;
 position: relative;
}
.works-list .item a{
 display: block;
 position: absolute;
 width: 100%;
 height: 100%;
 top: 0;
 left: 0;
 z-index: 2;
 background-color: rgba(255,255,255,0);
}
.works-list .item:hover a{
 background-color: rgba(255,255,255,0.2);
}
.works-list .item .pic{
 height: 240px;
 margin: 0 0 15px 0;
}
.works-list .item .pic img{
 width: 100%;
 height: 100%;
 object-fit: cover;
 object-position: 50% 50%;
}
.works-list .item p{
 color: #3d66aa;
 font-size: 16px;
 font-weight: bold;
 line-height: 130%!important;
}
.label-works{
 margin: 9px 0 0 0;
}
.label-works span{
 display: inline-block;
 font-size: 12px;
 line-height: 1;
 padding: 5px 10px;
 background-color: #f1f1f1;
 color: #3d66aa;
 border-radius: 15px;
 margin: 0 0 4px 0;
}
.industry{
 margin: 7px 0 0 0;
}
.industry dl{
 display: flex;
 justify-content: space-between;
}
.industry dt{
 width: 50px;
 font-weight: bold;
}
.industry dd{
 width: calc(100% - 50px);
}
.industry dd span{
 display: inline-block;
}
.industry dd span::after{
 content: ' ／';
}
.industry dd span:last-child::after{
 display: none;
}

.pagenation {
 text-align: center;
 line-height: 13px;
 font-size: 12px;
 position: relative;
}
.pagenation span,
.pagenation a {
 margin: 2px 2px 2px 0;
 padding: 1.3em 1.5em;
 display: inline-block;
 line-height: 1;
 width: auto;
 color: #111;
 background: #F0F4F7;
 text-decoration: none;
}
.pagenation a:hover {
 color: #fff;
 background: #3d66aa;
}

.pagenation .current {
 padding: 1.3em 1.5em;
 background: #3d66aa;
 color: #fff;
}

.entry-head{
 display: flex;
 justify-content: space-between;
 align-items: center;
}

.entry-head .pic {
 width: 55%;
 height: 400px;
}
.entry-head .pic img{
 width: 100%;
 height: 100%;
 object-fit: cover;
 object-position: 50% 50%;
}

.entry-title{
 width: 40%;
 text-align: left;
 margin: 0 0 0px 0;
} 
.entry-title .date{
 color: #999;
 font-size: 15px;
 margin: 0 0 30px 0;
}
.entry-title h2{
 font-size: 24px;
 color: #3d66aa;
 margin: 0px 0 20px 0;
 line-height: 130%;
}
.entry-info{
 border-top: 1px solid #eee;
 padding: 30px 0 0 0;
}
.entry-info dl{
 display: flex;
 justify-content: space-between;
 flex-wrap: wrap;
 font-size: 15px;
 margin: 0 0 10px 0;
}
.entry-info dt{
 width: 100px;
}
.entry-info dt span{
 display: inline-block;
 line-height: 1;
 padding: 5px 0px;
 background-color: #fff;
}
.entry-info dd{
 width: calc(100% - 100px);
}
.entry-info dd span{
 margin: 0 7px 0 0;
 display: inline-block;
 line-height: 1;
 padding: 5px 10px;
 background-color: #f1f1f1;
 color: #3d66aa;
 border-radius: 15px;
}
.entry-info .industry dt span{font-weight: normal;}
.entry-info .industry dd span{
 padding: 5px 0px;
 background-color: #fff;
 margin: 0;
}

.works-entry .entry {
 margin: 50px 0 0 0;
}
.works-entry .entry p{
 font-size: 15px;
 margin: 10px 0;
}
.works-entry .entry h1,
.works-entry .entry h2,
.works-entry .entry h3,
.works-entry .entry h4{
 margin: 30px 0;
}
.works-entry .entry h1{
 background-color: #f1f1f1;
 padding: 15px 20px;
 font-size: 24px;
 border-left: 4px solid #3d66aa;
}
.works-entry .entry h2{
 color: #3d66aa;
 font-size: 22px;
}
.works-entry .entry h3{
 font-size: 19px;
 padding: 5px 20px;
 border-left: 4px solid #3d66aa;
}
.works-entry .entry h4{
 font-size: 17px;
}
.works-entry .entry img{
 max-width: 100%;
 height: auto;
}

.bt-back{
 width: 350px;
 margin: 50px auto 0;
 text-align: center;
}
.bt-back span{
 display: block;
 background-color: #3d66aa;
 color: #fff;
 position: relative;
 padding: 20px 0;
}
.bt-back span:hover{
 background-color: #4f7abd;
}
.bt-back span i{
 position: absolute;
 left: 15px;
}
.bt-back a{text-decoration: none;}

.col3{
 display: flex;
 justify-content: space-between;
 flex-wrap: wrap;
 margin: 30px 0;
}
.col3 .pic{
 width: 32%;
 max-height: 250px;
}
.col3 .pic img{
 width: 100%;
 height: 100%;
 object-fit: cover;
 object-position: 50% 50%;
}

.col2{
 display: flex;
 justify-content: space-between;
 flex-wrap: wrap;
 margin: 30px 0;
}
.col2 .pic{
 width: 49%;
 max-height: 350px;
}
.col2 .pic img{
 width: 100%;
 height: 100%;
 object-fit: cover;
 object-position: 50% 50%;
}

.col1{
 display: flex;
 justify-content: center;
 flex-wrap: wrap;
 margin: 30px 0;
}
.col1 .pic{
 width: 50%;
 max-height: 350px;
}
.col1 .pic img{
 width: 100%;
 height: 100%;
 object-fit: cover;
 object-position: 50% 50%;
}
.layout{
 display: flex;
 justify-content: space-between;
 flex-wrap: wrap;
 align-items: center;
 margin: 30px 0;
}
.layout.even{
 flex-direction: row-reverse;
}
.layout .pic{
 width: 50%;
}
.layout .txt{
 width: 47%;
}

.slide{
 margin: 30px 0!important;
}
.slide .pic{
 margin: 0 20px;
}
.slide .slick-dots{
 bottom: -40px!important;
}
.slide .slick-slide {
  height: auto !important;
}
.slide .pic img {
 height: auto;
 max-height:500px;
 width: auto;
}
/*SP*/
@media only screen and (max-width: 800px) {

.works--container{
 padding: 0 10px;
}
.works--insert {
    margin: 0 auto;
    max-width: 100%;
    width: 100%;
}
.select--insert .box {
    margin: 0 0 5px 0;
    display: block;
    font-size: 14px;
}
.select--insert .box:nth-child(2) label {
    width: 20%;
}
.select--insert .box .md {
    width: 100%;
    text-align: center;
    font-size: 15px;
    margin: 0 0 10px 0;
    line-height: 150%;
}
.select--insert .box .md::after {
    position: relative;
}
.select--insert .box .check-list {
    width: 100%;
    gap: 0px 0;
}
label {
    width: 25%;
}
label span {
    padding: 1px 0;
    font-size: 11px;
    margin: 0 2px 2px 0;
    letter-spacing: 0;
}
.bt-search {
    margin: 20px 0 0 0;
    padding: 10px;
}
input[type=submit] {
    font-size: 14px;
    padding: 10px 0px;
    width: 100%;
}

.select {
    margin: 0 0 30px 0;
}
.works-list .item {
    width: 48%;
}
.works-list .item .pic {
    height: 120px;
    margin: 0 0 10px 0;
}
.works-list .item p {
    font-size: 13px;
}
.label-works span {
    font-size: 11px;
    padding: 3px 7px;
    margin: 0 0 4px 0;
    letter-spacing: 0;
}
.industry dl{
 font-size: 11px;
}
.industry dt {
    width: 40px;
}
.industry dd {
    width: calc(100% - 40px);
}
.works-list {
    gap: 25px 0;
}
.works-list::after{
 display: none;
}

.pagenation {
 margin:40px 0 0 0;
}
.pagenation .current {
 padding: 0.7em 0.9em;
}
.pagenation span,
.pagenation a {
 padding: 0.7em 0.9em;
}
.entry-head {
    display: block;
}
.entry-head .pic {
    width: 100%;
    height: 220px;
    margin: 0 0 20px 0;
}
.entry-title {
    width: 100%;
    margin: 0 0 0px 0;
}
.entry-title .date {
    font-size: 12px;
    margin: 0 0 10px 0;
}
.entry-title h2 {
    font-size: 18px;
    margin: 0px 0 10px 0;
}
.entry-info {
    padding: 15px 0 0 0;
}
.entry-info dl {
    font-size: 13px;
    margin: 0 0 5px 0;
}
.entry-info dt {
    width: 80px;
}
.entry-info dd {
    width: calc(100% - 80px);
}
.entry-info dd span {
    margin: 0 0px 0 0;
}
.works-entry .entry {
    margin: 30px 0 0 0;
}
.works-entry .entry h1,
.works-entry .entry h2,
.works-entry .entry h3,
.works-entry .entry h4 {
    margin: 20px 0;
}
.works-entry .entry h1 {
    padding: 6px 12px;
    font-size: 17px;
    border-left: 3px solid #3d66aa;
    line-height: 130%;
}
.works-entry .entry h2 {
    font-size: 16px;
    line-height: 130%;
}
.works-entry .entry h3 {
    font-size: 16px;
    padding: 0px 12px;
    border-left: 3px solid #3d66aa;
    line-height: 130%;
}
.works-entry .entry h4 {
    font-size: 15px;
    line-height: 130%;
}
.works-entry .entry p {
    font-size: 14px;
    margin: 10px 0;
}

.bt-back {
    width: 100%;
    margin: 30px auto 0;
}
.bt-back span {
    padding: 15px 0;
}

.col3 .pic {
    max-height: 80px;
}
.col2 .pic {
    max-height: 120px;
}
.col1 .pic {
    max-height: 120px;
}

.layout {
    display: block;
    margin: 30px 0;
}
.layout .pic {
    width: 100%;
}
.layout .txt {
    width: 100%;
}

.slide{
 margin: 20px 0!important;
}
.slide .pic{
 margin: 0 5px;
}
.slide .pic img {
 max-height:200px;
}

/*/*/
}





















/*/*/