@charset "utf-8";
#pageTitle{background-image:url(../img/works/page_title.jpg)}
#pageTitle h2:after{content:"OUR WORKS"}
#achievement li{display:block;background:rgb(230,245,251);background:-moz-linear-gradient(-42.5deg, rgba(230,245,251,1) 0%, rgba(230,245,251,1) 49.9%, rgba(210,236,247,1) 50%, rgba(210,236,247,1) 100%);background:-webkit-linear-gradient(-42.5deg, rgba(230,245,251,1) 0%,rgba(230,245,251,1) 49.9%,rgba(210,236,247,1) 50%,rgba(210,236,247,1) 100%);background:linear-gradient(137.5deg, rgba(230,245,251,1) 0%,rgba(230,245,251,1) 49.9%,rgba(210,236,247,1) 50%,rgba(210,236,247,1) 100%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6f5fb', endColorstr='#d2ecf7',GradientType=1 );font-weight:700;text-align:center;line-height:1}
#achievement li h4{color:#209fd6;font-weight:700}
#achievement li h4:before{content:"";display:block;background-position:center;background-repeat:no-repeat;margin:0 auto}
#achievement li:nth-child(1) h4:before{background-image:url(../img/works/icon_works01.svg)}
#achievement li:nth-child(2) h4:before{background-image:url(../img/works/icon_works02.svg)}
#achievement li:nth-child(3) h4:before{background-image:url(../img/works/icon_works03.svg)}
#achievement li:nth-child(4) h4:before{background-image:url(../img/works/icon_works04.svg)}
#achievement li p{display:block;background:#fff;letter-spacing:0.06em}
#achievement ul+p{text-align:right}
#worksTable table{width:100%}
#worksTable table th,#worksTable table td{border-left:1px solid #e7eaf2;border-top:1px solid #e7eaf2;text-align:center}
#worksTable table+p{text-align:right;font-weight:700}
#worksTab{display:flex;justify-content:space-between}
#worksTab li a{background:rgb(244,245,249);background:-moz-linear-gradient(top, rgba(244,245,249,1) 0%, rgba(238,239,244,1) 54%, rgba(236,239,246,1) 56%, rgba(237,238,243,1) 61%, rgba(235,238,245,1) 64%, rgba(231,234,243,1) 100%);background:-webkit-linear-gradient(top, rgba(244,245,249,1) 0%,rgba(238,239,244,1) 54%,rgba(236,239,246,1) 56%,rgba(237,238,243,1) 61%,rgba(235,238,245,1) 64%,rgba(231,234,243,1) 100%);background:linear-gradient(to bottom, rgba(244,245,249,1) 0%,rgba(238,239,244,1) 54%,rgba(236,239,246,1) 56%,rgba(237,238,243,1) 61%,rgba(235,238,245,1) 64%,rgba(231,234,243,1) 100%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4f5f9', endColorstr='#e7eaf3',GradientType=0 );display:block;text-align:center;color:#11347c;font-weight:700;text-decoration:none;position:relative}
#worksTab li a.active{background:#11347c;color:#fff}
#worksTab li a.active::after{width:0;height:0;border-style:solid;border-color:#11357c transparent transparent transparent;content:"";display:inline-block;left:50%;position:absolute}
#worksTable table thead th{border-left:1px solid #e7eaf2;border-top:1px solid #e7eaf2}
#worksTable table tbody th{border-left:1px solid #e7eaf2;border-top:1px solid #e7eaf2}
#worksTab li:last-child{margin:0}

@media screen and (min-width:961px){
#achievement ul{margin:0 0 30px;display:flex;justify-content:space-between}
#achievement li{width:240px;height:220px}
#achievement li h4{font-size:1.125rem}
#achievement li h4:before{width:80px;height:80px;margin:25px auto 28px}
#achievement li p{padding:12px 0;margin:20px 10px 10px;font-size:0.875rem}
#achievement li p strong{font-size:1.25rem}
#achievement ul+p{font-size:0.875rem}
#achievement,#worksTable{width:1080px;margin:0 auto 60px}
#worksTable table{border:3px solid #e7eaf2;border-left:3px solid #e7eaf2;font-size:0.875rem;margin:0 auto 30px}
#worksTable table th,#worksTable table td{padding:22px 18px}
#worksTab{margin:0 auto 30px}
#worksTab li{margin:0 5px 0 0;width:212px}
#worksTab li a{height:60px;line-height:60px}
#worksTab li a.active::after{border-width:6px 6px 0 6px;bottom:-6px;margin-left:-3px}
}


/*
    SP 

**********************************************************/

@media screen and (max-width: 960px) {
#achievement ul{width:320px;margin:0 auto 10px;overflow:hidden}
#achievement li{width:150px;height:140px;float:left;margin:5px}
#achievement li:nth-child(2n+1){clear:both}
#achievement li h4{font-size:1.25rem}
#achievement li h4:before{width:60px;height:60px;margin:10px auto 0;background-size:70% auto}
#achievement li p{padding:10px 0;margin:10px;font-size:0.916rem}
#achievement li p strong{font-size:1.25rem}
#achievement ul+p{font-size:0.875rem}
#achievement,#worksTable{margin:0 10px 40px}
#worksTable table{border:3px solid #e7eaf2;border-left:3px solid #e7eaf2;font-size:1rem;margin:0 auto 1.5em}
#worksTable table th,#worksTable table td{padding:15px 10px}
#worksTab{margin:0 auto;overflow-y:hidden;-ms-overflow-style:-ms-autohiding-scrollbar;-webkit-overflow-scrolling:touch;-moz-user-select:none;-ms-user-select:none;white-space:nowrap;padding:0 0 10px}
#worksTab li{margin:0 5px 0 0;width:212px}
#worksTab li a{padding:15px 10px}
#worksTab li a.active::after{border-width:6px 6px 0 6px;bottom:-6px;margin-left:-3px}
#under main #worksTable p{font-size:1rem;text-align:right}
@media screen and (max-width: 320px) {

}

