/* work index
=============================================== */

#work-index #page-header { background-image:url(../img/work/bg_header.jpg); }


/* pagelink
-------------------------------- */

#work-index .pagelink-box { display:flex; flex-wrap:wrap; }
.wk-pl-box { width:50%; padding:1.0em 0; box-sizing:border-box; }
.wk-pl-box .ttl { font-size:145%; line-height:140%; color:#CC6DF2; }
.wk-pl-box .pagelink ul { justify-content: flex-start; }

@media all and (max-width: 767px) {

.wk-pl-box { width:100%; padding:1.0em 0 1.0em 3%; }
.wk-pl-box .ttl { font-size:130%; }

}

/* wk-box
-------------------------------- */

.wk-ttl { position:relative; display:inline-block; margin-bottom:0.7em; padding:0 1.0em 1.0em 1.0em; }
.wk-ttl .en,
.wk-ttl .jp { display:block; position:relative; z-index:2; }
.wk-ttl .en { padding-bottom:0.2em; font-size:250%; line-height:100%; font-family:"bricolage-grotesque", sans-serif; font-weight:600; font-style:normal; }
.wk-ttl .jp { font-size:90%; font-family:"dotgothic16"; font-weight:400; font-style:bold; }
.wk-ttl::after { position:absolute; z-index:1; bottom:0.6em; left:0; content:""; display:block; width:100%; height:2.6em; background-color:#E39CFF; }

.wk-div { max-width:1280px; margin:auto;}
.wk-header { border-radius:1.5em 1.5em 0 0; height:10.5em; padding:1.0em; box-sizing:border-box; background-size:cover; background-position:center center; background-repeat:no-repeat; color:#fff; display:flex; justify-content:flex-start; align-items: flex-end; font-size:120%; line-height:140%; text-shadow:0 0 5px rgba(0,0,0,0.5), 0 0 5px rgba(0,0,0,0.5),0 0 5px rgba(0,0,0,0.5); }
#variety .wk-header { background-image:url(../img/work/hdbg_div_variety.jpg); }
#drama .wk-header { background-image:url(../img/work/hdbg_div_drama.jpg); }
#news .wk-header { background-image:url(../img/work/hdbg_div_news.jpg); }
#dig .wk-header { background-image:url(../img/work/hdbg_div_dig.jpg); }
#life .wk-header { background-image:url(../img/work/hdbg_div_life.jpg); }
#sports .wk-header { background-image:url(../img/work/hdbg_div_sports.jpg); }
#anime_movie .wk-header { background-image:url(../img/work/hdbg_div_anime_movie.jpg); }
#live .wk-header { background-image:url(../img/work/hdbg_div_live.jpg); }
#strategy .wk-header { background-image:url(../img/work/hdbg_div_strategy.jpg); }
#sales .wk-header { background-image:url(../img/work/hdbg_div_sales.jpg); }
#promotion .wk-header { background-image:url(../img/work/hdbg_div_promotion.jpg); }
#marketing .wk-header { background-image:url(../img/work/hdbg_div_marketing.jpg); }
#platform .wk-header { background-image:url(../img/work/hdbg_div_platform.jpg); }
#city .wk-header { background-image:url(../img/work/hdbg_div_city.jpg); }
#ana .wk-header { background-image:url(../img/work/hdbg_div_ana.jpg); background-position:center 32%; }
#tech .wk-header { background-image:url(../img/work/hdbg_div_tech.jpg); }
#design .wk-header { background-image:url(../img/work/hdbg_div_design.jpg); background-position:center 5%; }
#management .wk-header { background-image:url(../img/work/hdbg_div_management.jpg); background-position:center 29%; }
#legal .wk-header { background-image:url(../img/work/hdbg_div_legal.jpg); }
#affairs .wk-header { background-image:url(../img/work/hdbg_div_affairs.jpg); }

.wk-box .contents-box { border-radius:0 0 1.5em 1.5em; padding-bottom:1.0em; }

.wk-lead { margin-bottom:0.5em; }
.wk-staff { padding-top:1.7em; border-top:#d9d9d9 1px solid; }
.wk-staff .sttl { font-size:130%; margin-bottom:1.0em; }
.wk-staff-list { display:flex; flex-wrap:wrap; }
.wk-staff-list li { width:33.3%; margin-bottom:1.5em; padding-right:0.7em; box-sizing:border-box; }
.wk-staff-list li a { display:flex; color:#000!important; text-decoration:none; /* hover */ transition:transform 0.2s, opacity 0.2s ease-out; }
@media (hover:hover) { .wk-staff-list li a:hover { transform:translateX(4px); opacity:0.7; } }
.wk-staff-list li .tmb { width:5em; aspect-ratio:1 / 1; margin-right:1.0em; }
.wk-staff-list li .tmb span { display:block; width:100%; height:100%; border-radius:0.7em; border:#d9d9d9 1px solid; background-position:center center; background-repeat:no-repeat; background-size:cover; }
.wk-staff-list li .text-box { flex:1; }
.wk-staff-list li .name { font-size:120%; line-height:140%; font-weight:700; margin-bottom:0.3em; }
.wk-staff-list li .division { font-size:90%; line-height:140%; }


/* -- Media Queries -- */

@media all and (max-width: 1079px) {

.wk-ttl { font-size:85%; }
.wk-header { height:6.0em; }
.wk-staff-list li { width:50%; }

}

@media all and (max-width: 767px) {

.wk-staff-list li { width:100%; padding-right:0; }

}


/* btn
-------------------------------- */

.wk-btn { margin-bottom:1.0em; text-align:center; }
.wk-btn a { position:relative; width:18.0em; display:inline-block; margin-bottom:1.0em; padding:1.0em 0; background-color:#fff; border-radius:1000px; border:var(--cl-tbsblue) 2px solid; box-shadow:2px 2px 4px rgba(0, 0, 0, 0.4); color:var(--cl-tbsblue); font-weight:700; text-decoration:none; /* hover */ transition:transform 0.2s, opacity 0.2s ease-out; }
@media (hover:hover) { .wk-btn a:hover { transform:translateX(4px); opacity:0.7; } }


/*eof*/