@charset "UTF-8";
main section#worksMainSct { background: #005AAA url("../img/works_main.jpg") no-repeat center center; background-size: cover; color: #fff; height: 70vh; max-height: 600px; }
main section#worksMainSct h2 { line-height: 1.3; margin-bottom: 5vw; }
main section#worksMainSct h2 small { display: block; font-size: 70%; letter-spacing: 3px; }
main section#worksMainSct h2 span { display: block; font-size: 250%; }
@media screen and (max-width: 800px) { main section#worksMainSct h2 span { font-size: 230%; } }
@media screen and (max-width: 800px) { main section#worksMainSct h2 { margin-bottom: 8vw; } }
main section#worksContsSct { background: #fff; padding: 4em 0; }
main section#worksContsSct .inner2 { padding-right: 230px; }
@media screen and (max-width: 800px) { main section#worksContsSct .inner2 { padding-right: 180px; } }
@media screen and (max-width: 428px) { main section#worksContsSct .inner2 { padding-right: 100px; } }
main section#worksContsSct .inner2 .copy { color: #005aaa; font-size: 140%; line-height: 1.6; letter-spacing: 7px; margin-bottom: 1em; }
@media screen and (max-width: 428px) { main section#worksContsSct .inner2 .copy { font-size: 120%; letter-spacing: 5px; } }
main section#worksContsSct .inner2 .wBox { position: relative; width: 90%; margin: 4em 0 5em; }
@media screen and (max-width: 800px) { main section#worksContsSct .inner2 .wBox { width: 100%; } }
main section#worksContsSct .inner2 .wBox .main { position: relative; width: 100%; height: 28vw; overflow: hidden; padding-top: 5vw; margin-bottom: 2.6em; }
@media screen and (max-width: 800px) { main section#worksContsSct .inner2 .wBox .main { margin-bottom: 1.6em; height: 30vw; } }
@media screen and (max-width: 428px) { main section#worksContsSct .inner2 .wBox .main { height: 40vw; padding-top: 3.5em; } }
main section#worksContsSct .inner2 .wBox .main img { position: absolute; z-index: 0; top: 0; left: 0; width: 100%; height: 28vw; object-fit: cover; object-position: center center; }
@media screen and (max-width: 800px) { main section#worksContsSct .inner2 .wBox .main img { height: 30vw; } }
@media screen and (max-width: 428px) { main section#worksContsSct .inner2 .wBox .main img { height: 40vw; object-position: 70% center; }
  main section#worksContsSct .inner2 .wBox .main img.w05 { object-position: 5% center; }
  main section#worksContsSct .inner2 .wBox .main img.w08 { height: 45vw; object-position: 0% center; } }
main section#worksContsSct .inner2 .wBox .main .no { position: absolute; top: 3.2vw; left: 0; z-index: 5; color: #005aaa; letter-spacing: 1px; padding: .6vw 2vw .4vw 3.8vw; margin-bottom: 1vw; font-size: 110%; line-height: 1.2; display: inline-block; background: rgba(255, 255, 255, 0.7); }
@media screen and (max-width: 428px) { main section#worksContsSct .inner2 .wBox .main .no { font-size: 90%; } }
@media screen and (max-width: 320px) { main section#worksContsSct .inner2 .wBox .main .no { font-size: 70%; } }
main section#worksContsSct .inner2 .wBox .main .name { position: absolute; top: 50%; left: 3.8vw; transform: translateY(-50%); z-index: 5; color: #fff; line-height: 1.4; font-size: 150%; letter-spacing: 5px; text-shadow: 1px 1px 1px #002a5a, 1px 1px 1px #002a5a, 1px 1px 1px #002a5a, 1px 1px 1px #002a5a; }
@media screen and (max-width: 800px) { main section#worksContsSct .inner2 .wBox .main .name { font-size: 130%; } }
@media screen and (max-width: 428px) { main section#worksContsSct .inner2 .wBox .main .name { font-size: 100%; letter-spacing: 2px; }
  main section#worksContsSct .inner2 .wBox .main .name .sp { display: none; } }
@media screen and (max-width: 320px) { main section#worksContsSct .inner2 .wBox .main .name { font-size: 80%; } }
main section#worksContsSct .inner2 .wBox .main .cate { position: absolute; z-index: 5; bottom: .5em; left: 0; width: 100%; padding-left: 1em; background: rgba(255, 255, 255, 0.7); display: flex; flex-wrap: wrap; }
@media screen and (max-width: 428px) { main section#worksContsSct .inner2 .wBox .main .cate { padding-left: .5em; } }
main section#worksContsSct .inner2 .wBox .main .cate li { display: inline-block; color: #005aaa; font-size: 90%; border: 1px solid #005aaa; border-radius: 1em; padding: .25em .8em .2em; margin: .3em .3em; }
@media screen and (max-width: 428px) { main section#worksContsSct .inner2 .wBox .main .cate li { font-size: 45%; } }
@media screen and (max-width: 320px) { main section#worksContsSct .inner2 .wBox .main .cate li { font-size: 35%; } }
main section#worksContsSct .inner2 .wBox .sub { position: relative; display: flex; justify-content: space-between; }
@media screen and (max-width: 428px) { main section#worksContsSct .inner2 .wBox .sub { display: block; } }
main section#worksContsSct .inner2 .wBox .sub p { order: 1; width: 51%; text-align: justify; /*左右両端揃え*/ text-justify: inter-ideograph; }
@media screen and (max-width: 428px) { main section#worksContsSct .inner2 .wBox .sub p { width: 100%; } }
main section#worksContsSct .inner2 .wBox .sub div { order: 2; width: 43%; }
@media screen and (max-width: 428px) { main section#worksContsSct .inner2 .wBox .sub div { width: 80%; margin-bottom: 1em; } }
main section#worksContsSct .inner2 .wBox .sub div img { width: 100%; height: auto; }