/* MOBILE */
@media screen and (max-width: 767px){
    body{min-width: 320px; overflow-x: hidden;}
    .content-wrap {position: relative; width: 100%;}
    .content {position: relative; width: 100%:}

    #main {position: relative; display: block; width: 100%; height: 500px; background-color: #2f2f2f;}
    .main_inner {display: block; width: 80%; height: 360px; margin: 0 10%; padding-top: 140px;}
    .main_inner h1 {position: relative; display: block; margin: 0; padding: 0;  line-height: 55px; text-align: center; font-size: 30px; font-weight: 900; background-color: #fff;}
    .main_inner div { clear: both; display: block; text-align: center; }
    .main_inner div p { clear:both; display:block;  margin: 12px 0 0 0;  padding: 8px 0; font-size: 14px; font-weight: 600; background-color: #eee; }

    #worklist {position: relative; width: 100%;}
    .worklist_inner {position: relative; width: 100%; background-color: #eee; padding: 60px 0 120px;}
    
    .worklist_sorting {position: relative; display:inline-block; padding: 10px 0;width: 80%; margin: 0 10%; background-color: #e2e2e2;}
    .sort_ul {text-align: center;}
    .sort_li {display: inline-block; line-height: 46px; margin-right: 10px; margin-left: 10px;}
    .sort_li a {padding: 10px 20px; font-weight: 500; font-size: 12px;}
    .sort_li a.sel {border-bottom: 2px solid #000;}

    .worklist_list {position: relative; width: 80%; margin: 40px 10% 0;}
    .worklist_ul {display: inline-block; width: 100%;}
    .worklist_item {float: left; vertical-align: top;  width: 98%; margin: 0 1% 2%; height: 180px; background-color: #000;}
    .item_btn {overflow: hidden; position: relative; display: block; width: 100%; height: 100%; background-repeat: no-repeat; background-size: 100% auto; background-position: 50% 50%;}
    .item_btn {transition: all 1600ms ease-out;}
    .item_btn:hover {background-size: 120% auto;}
    .worklist_item:nth-child(1) .item_btn {background-image:url(../../img/work/life_is_a_game.jpg); }
    .worklist_item:nth-child(2) .item_btn {background-image:url(../../img/work/portfolio.jpg); }
    .worklist_item:nth-child(3) .item_btn {background-image:url(../../img/work/boss_loop.jpg); }
    .worklist_item:nth-child(4) .item_btn {background-image:url(../../img/work/theWatch.jpg); }
    .worklist_item:nth-child(5) .item_btn {background-image:url(../../img/work/nikeVRPromotion.jpg); }
    .worklist_item:nth-child(6) .item_btn {background-image:url(../../img/work/publisherW.jpg); }
    .item_desc {position: absolute; bottom: 0; display: block; width: 100%; height: 80px; background-color: #000; color: #fff; margin-bottom: 0px;}
    .item_desc h2 {margin-top: 20px; margin-bottom: 0px; margin-left: 10px; font-size: 16px; font-weight: 500;}
    .item_desc .simple_desc {margin-left: 10px; font-size: 10px; letter-spacing: 0.5pt;}
    .item_cate {position: absolute; top: 0px; right: 6px; display: block;}
    .item_cate .category {  color: #fff; padding: 3px 2px; font-size: 10px; border-radius: 14px;}

}