@charset "UTF-8";
/*================================
o/w
=================================*/

/*================================
WORKS
=================================*/

#works.list_works header{
overflow: hidden;
height:300px;
}

#works.single_works header{
overflow: hidden;
height:640px;
}

#works.single_works header img.hd{
display: block;
width:1920px;
height:490px;
position: absolute;
top:150px;
}

#works.list_works header .row_inner{
overflow: hidden;
height:300px;
}

#works.single_works header .row_inner{
overflow: hidden;
height:650px;
}


/* intro
-------------------------------- */

#works.single_works #intro{
overflow: hidden;
background: linear-gradient(to bottom, #fff 0, #fff 390px, #191D20 390px, #191D20 100%)!important;
height:450px;
}


#works.single_works #intro h3 span.ct{
display: none;
}

#works.single_works #intro .setimg{
overflow: hidden;
display: block;
}
#works.single_works #intro .setimg.img_pc{
overflow: hidden;
display: block;
width: 485px;
height: 363px;
position:absolute;
left:360px;
top:60px;
}
#works.single_works #intro .setimg.img_sp{
overflow: hidden;
display: block;
width: 141px;
height: 281px;
position:absolute;
left:800px;
top:140px;
}


#works.single_works #intro .setimg.img_pc .fitouter{
overflow: hidden;
display: block;
width: 474px;
height: 224px;
position:absolute;
top:28px;
left:6px;
}

#works.single_works #intro .setimg.img_pc .fitouter img{
display: block;
width: 474px;
height:auto;
position:absolute;
top:0;
left:0;
}


#works.single_works #intro .setimg.img_sp .fitouter{
overflow: hidden;
display: block;
width: 124px;
height: 208px;
position:absolute;
top:38px;
left:9px;
}
#works.single_works #intro .setimg.img_sp .fitouter img{
display: block;
width: 124px;
height:auto;
position:absolute;
top:0;
left:0;
}


#works.single_works #intro .setimg.img_pc .ol_pc{
overflow: hidden;
background:url(../img/works/intro_ast_pc.png) no-repeat center top;
display: block;
width: 485px;
height: 363px;
position:relative;
}

#works.single_works #intro .setimg.img_sp .ol_sp{
overflow: hidden;
background:url(../img/works/intro_ast_sp.png) no-repeat center top;
display: block;
width: 141px;
height: 281px;
position:relative;
}


/* info
-------------------------------- */

#works.single_works #info{
overflow: hidden;
color:#fff;
background-color:#191D20;
padding:30px 0 60px;
text-align: center;
}

#works.single_works #info .row_inner{
width:1200px;
}


#works.single_works #info h2{
font-size: 20px;
margin-bottom:30px;
}
#works.single_works #info h2::after{
content:"様";
margin-left:5px;
}

#works.single_works #info ul{
display: block;
margin:0 auto 50px;
font-size: 16px;
text-align: left;
}

#works.single_works #info ul li{
display: inline-block;
height:52px;
margin-bottom:10px;
line-height: 52px;
}

#works.single_works #info ul li span{
display: inline-block;
background-color: #5A5657;
padding-left:20px;
font-size: 16px;
margin:0;
}

#works.single_works #info ul li span.tit{
display: inline-block;
width:180px;
background-color: #383735;
padding-left:20px;
margin-right:20px;
}

#works.single_works #info ul li.li01 span.url{
position: relative;
display: inline-block;
width:995px;
}

#works.single_works #info ul li.li01 span.url a{
display: block;
color:#fff;
}


#works.single_works #info ul li.li01 span.url a::after{
content:"";
background:url(../img/element/arrow50.png) no-repeat center bottom;
display:block;
width:50px;
height:10px;
position:absolute;
top:20px;
right:30px;
}
#works.single_works #info ul li.li01 span.url a:hover::after{
opacity: 0.8;
}


#works.single_works #info ul li.li02 span.plan{
display: inline-block;
width:250px;
}

#works.single_works #info ul li.li02 span.tags{
display: inline-block;
width:740px;
}


#works.single_works #info h3{
padding-left:20px;
font-size: 16px;
line-height: 1.8em;
font-weight: bold;
margin-bottom:10px;
}

#works.single_works #info p{
text-align: left;
line-height: 2em;
}



/* SLIDER   520x340
-------------------------------- */
#works.single_works #slider .bx-wrapper{
margin-bottom: 0;
}


#works.single_works #slider ul{
width:2080px;
margin-left:-1040px;
left:50%;
}

#works.single_works #slider ul li img.fitimg{
width:520px;
height:340px;
}


/* hardcopies

-------------------------------- */

#works.single_works #hardcopies{
overflow: hidden;
padding:0;
text-align: center;
margin:30px auto 0;
}

#works.single_works #hardcopies ul {
width:1200px;
overflow: hidden;
display: block;
margin:50px auto 50px;
}

#works.single_works #hardcopies ul li.hardcopy_pc{
overflow: hidden;
float:left;
display: block;
width:930px;
}

#works.single_works #hardcopies ul li.hardcopy_sp{
overflow: hidden;
float:right;
display: block;
width:184px;
}

#works.single_works #hardcopies ul li.hardcopy_pc img{
width:930px;
height:auto;
}

#works.single_works #hardcopies ul li.hardcopy_sp img{
width:184px;
height:auto;
}


/* SOC
-------------------------------- */

#works.single_works .soc{
overflow: hidden;
display:block;
margin:0 auto;
}

#works.single_works .soc .row_inner{
overflow: hidden;
width:1200px;
margin:0 auto 50px;
}


#works.single_works .soc a.socbtn{
display:inline-block;
vertical-align:middle;
margin-right:10px;
transition: 0.2s;
}

#works.single_works .soc a.socbtn:hover{
opacity:0.7;
}

#works.single_works .soc a.socbtn.btn_fb{
background:url(./../img/element/works_ico_fb.png) no-repeat center center;
width:36px;
height:36px;
}

#works.single_works .soc a.socbtn.btn_tw{
background:url(./../img/element/works_ico_tw.png) no-repeat center center;
width:36px;
height:36px;
}


/* #ast_works
----------------- */

#works.single_works #ast_works {
margin-top:40px;
}

#works.single_works #ast_works h3{
display: none;
}


/* for blog list @style.css
----------------- */


/* for blog single
----------------- */

.blogsingle{
position: relative;
overflow: hidden;
}

.blogsingle #posts{
overflow: hidden;
}

.blogsingle #posts .post{
overflow: hidden;
padding:0;
margin-bottom:0;
background-color: #F7F7F7;
}

.blogsingle .post .post_header{
position: relative;
overflow: hidden;
display: block;
width:1200px;
margin:20px auto 50px;
background-color:#fff;
text-align: center;
}

.blogsingle .post .post_header h2{
display: block;
overflow: hidden;
font-size:24px;
font-weight: bold;
line-height:1.5em;
color:#000000;
text-align: center;
padding:20px 20px 20px 140px;
margin:0;
}

.blogsingle .post .post_header .cattag{
position: absolute;
top:0;
bottom:0;
left:30px;
margin:auto;
}


.blogsingle .post  a.btn_tolist{
background:url(../img/works/single_btn_tolist.png) no-repeat center center;
display:block;
width:314px;
height:61px;
position: relative;
margin:0 auto 70px;
}


/* subnav
-------------------------------- */

.subnav{
display: block;
position: relative;
background-color:#f7f7f7;
margin-bottom: 0;
}

.subnav ul{
display: block;
overflow: hidden;
padding: 20px;
}

.subnav ul li {
position: relative;
display:inline-block;
float:left;
vertical-align: baseline;
font-size:16px;
font-weight: bold;
padding:0;
margin:0 10px 0 0!important;
text-align: center;
}

.subnav ul li a{
position: relative;
display:block;
color:#111;
line-height:30px;
letter-spacing: 0.04em;
padding:0;
cursor:pointer;
opacity:0.96;
transition: 0.2s;
}

.subnav ul li a.current {
color:#fff;
background-color:#1E3557;
padding:0 15px;
border-radius: 15px;
}


/* PageNavi
-------------------------------- */

.navigation{
width:100%;
display:block;
overflow:hidden;
padding:60px 10px 80px;
text-align:center;
font-size:130%;
}

.wp-pagenavi{
display:block;
overflow:hidden;
width:900px;
margin:0 auto;
}

.wp-pagenavi a{
display:inline-block;
line-height:1;
font-size:0.76em;
color:#111;
padding:8px 12px!important;
margin:4px;
background-color:#fff;
}

.wp-pagenavi a:hover{
color:#fff;
background-color:#333;
text-decoration: none;
}

.wp-pagenavi span.current{
display:inline-block;
line-height:1;
font-size:0.76em;
color:#fff;
padding:8px 12px;
background-color:#111;
margin:4px;
}

.single_navigation{
position:relative;
width:auto;
height:50px;
display:block;
padding:0;
text-align:center;
margin:0 auto;
}

.single_navigation ul{
display:block;
position:relative;
}

.single_navigation ul li{
display:block;
width:193px;
height:50px;
position: absolute;
top:0;
}

.single_navigation ul li a{
overflow: hidden;
display:block;
padding:0 25px;
font-size:15px;
font-weight:normal;
text-decoration-line: none!important;
color:#fff;
background-color:#111;
text-align: center;
line-height:50px;
}

.single_navigation ul li a:hover{
text-decoration: none;
color:#fff;
opacity:0.77;
transition:0.2s;
}

.single_navigation ul li.prev  { left:0; }
.single_navigation ul li.back  { left:204px; }
.single_navigation ul li.next  { left:408px; }
.single_navigation ul li.front { left:612px; width:198px;}
.single_navigation ul li.prev a  { text-align: left; }
.single_navigation ul li.back a  { text-align: center; }
.single_navigation ul li.next a  { text-align: right; }
.single_navigation ul li.front a {
text-align: center;
background-color:#A28961;
}