@charset "utf-8";
/* works_sub240708 */

/* /_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_
  Media Queries による切り替え
/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

@media screen and (max-width: 767px) {
#SMP------------------------{}
    #spheader .rogo01 {
        width: 260px!important;
    }
    .pankuzu {
		display: none;
        /*width:96%;
        margin:0 auto;
		padding: 0px 2% 0px;
        text-align:right;
        font-size: 10px;*/
    }
	
	.subfooter {
		padding:8VW 0;
		margin:0 auto 0rem;
	}
	.subfooter .inner{
        width:92%;
	}
	.subfooter .inner ul li{
        width:100%;
		margin-bottom:4VW;
	}
	.subfooter .inner ul li img{
        width:100%;
		height:auto;
	}
	.subfooter .inner ul li a,
	.return a{
        width:100%;
		height:60px;
		font-size:18px;
		line-height:60px;
        background:url("../image/works/arrow_w.png") right 15px center no-repeat;
	}
	.subfooter .inner ul li:last-child{
		margin:0px 0% 0 13%;
		height:20.0VW;
		width:87%;
	}
	
	.return {
        width:92%;
		height:60px;
		margin:0 auto 5rem;
	}
}

@media screen and (min-width: 768px) {
#PC------------------------{}
    
    .pankuzu {
        width:1200px;
		padding: 5px 0;
        font-size: 12px;
    }
    #navi > ul > li:nth-child(2) {
        background-color: #3391ce;
    }
	
	.subfooter {
		padding:50px 0;
		margin:0 auto 5rem;
	}
	.subfooter .inner{
        width:1200px;
		height:86px;
	}
	.subfooter .inner ul li{
		float:left;
        width:380px;
		margin-right:22px;
	}
	.subfooter .inner ul li a{
        width:380px;
		height:86px;
		font-size:18px;
		line-height:86px;
        background:url("../image/works/arrow_w.png") right 15px center no-repeat;
		background-size:2.5%;
	}
	.subfooter .inner ul li:last-child{
		margin-right:0px;
	}
	.subfooter .inner ul li:last-child a{
		pointer-events: none;
	}
	
	.return {
		width:380px;
		height:86px;
		margin:0 auto 5rem;
	}
	.return a{
        width:380px;
		height:86px;
		font-size:18px;
		line-height:86px;
        background:url("../image/works/arrow_w.png") right 15px center no-repeat;
	}
}
@media screen and (min-width: 768px) and (max-width: 969px){
#TABLET------------------------{}
	body, #header #navi {
        /*min-width: auto;*/
    }
	.inner,
	#navi > ul,
	#navi > ul > li a,
    .works_detail .pankuzu,
	#footer-middle,
	footer .inner,
	.subfooter .inner ul li a {
        width: 100%;
    }
	#navi > ul > li{
        width: calc(100% / 6);
        font-size: 11px;
    }
	.subfooter .inner {
        width: 96%;
		padding:0 2%;
    }
	.subfooter .inner ul {
        width: 100%;
    }
	.subfooter .inner ul li {
        width: 23%;
        margin-right: 2%;
    }
	.subfooter .inner ul li:last-child {
        width: 50%;
        margin-right: 0;
    }
	.subfooter .inner ul li img {
        width: 100%;
        height:auto;
    }
	.bxslider li{
		/*width:calc(25% - 16px)!important;*/
	}
	.bxslider li img{
        width: 100%;
		height:auto;
	}
}

	
.subfooter {
    width:100%;
    background-color: #666;
}
.subfooter .inner{
    margin:0 auto;
}
.return a,
.subfooter .inner ul li a{
    display:block;
    background-color: #0075c2;
    text-align: center;
    font-weight:bold;
    color:#FFF;
    text-decoration: none;
    font-family: "ヒラギノ角ゴ Pro W6","Hiragino Kaku Gothic Pro","游ゴシック", "YuGothic","メイリオ","Meiryo","ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
}
.subfooter .inner ul li a:hover{
    background-color: #1886cf;
}
.subfooter .inner ul li:last-child a{
    background:none;
    background-color: transparent;
}
.subfooter .inner ul li:nth-child(2) a{
    background-color: #ff6600;
}
.subfooter .inner ul li:nth-child(2) a:hover{
    background-color: #ff822f;
}

.pankuzu {
    margin:0 auto;
    text-align:left;
}
.pankuzu a,
.pankuzu span {
    background:url(../image/reader_header.gif) center left no-repeat;
    padding-left:8px;
    margin-left: -5px;
    color:#000;
	font-size:11px;
}