@charset "UTF-8";

body.no-scroll {
  overflow: hidden;
}

@media (min-width: 768px) {
  .under_ttl_img {
    position: relative;
    z-index: 6;
    margin-top: -10.5vw;
    margin-bottom: 0vw;
  }
  .works {
    margin-top: -0.5vw;
  }
  .works .works_mv {
    position: relative;
  }
  .works .works_mv .ttl01 {
    position: absolute;
    width: 19.4vw;
    top: 5.9vw;
    left: 11.4vw;
    z-index: 3;
    padding-top: 7vw;
    margin-top: -7vw;
  }
  .works .works_mv .ttl02 {
    position: absolute;
    width: 19.4vw;
    top: 76vw;
    left: 3vw;
    z-index: 3;
    padding-top: 7vw;
    margin-top: -7vw;
  }
  .works .works_mv .ttl03 {
    position: absolute;
    width: 19.4vw;
    top: 84.9vw;
    right: 27vw;
    z-index: 3;
    padding-top: 7vw;
    margin-top: -7vw;
  }
  .works .works_mv .ttl04 {
    position: absolute;
    width: 19.4vw;
    bottom: 27vw;
    left: 20.9vw;
    z-index: 3;
    padding-top: 7vw;
    margin-top: -7vw;
  }
  .works .works_mv .modal-trigger {
    position: absolute;
    width: 16.7vw;
    cursor: pointer;
  }
  .works .works_mv .photo01 {
    top: 14.0vw;
    left: 14.1vw;
  }
  .works .works_mv .photo02 {
    top: 14.6vw;
    left: 32.0vw;
  }
  .works .works_mv .photo03 {
    top: 14.8vw;
    left: 49.6vw;
  }
  .works .works_mv .photo04 {
    top: 14.8vw;
    left: 67.4vw;
  }
  .works .works_mv .photo05 {
    top: 80.4vw;
    left: 9.2vw;
  }
  .works .works_mv .photo06 {
    top: 98.9vw;
    left: 9.2vw;
  }
  .works .works_mv .photo07 {
    top: 99.1vw;
    left: 26.7vw;
  }
  .works .works_mv .photo08 {
    top: 89.5vw;
    right: 23.5vw;
  }
  .works .works_mv .photo09 {
    top: 89.8vw;
    right: 5.7vw;
  }
  .works .works_mv .photo10 {
    top: 108vw;
    right: 23.5vw;
  }
  .works .works_mv .photo11 {
    top: 108.7vw;
    right: 5.7vw;
  }
  .works .works_mv .photo12 {
    bottom: 11.3vw;
    left: 27.0vw;
  }


  .modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.6);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
  }

  .modal-content {
    background: white;
    padding: 0 0 5vw;
    width: 85.8vw;
    position: relative;
    height: 85vh;
    overflow-y: auto;
  }
  .modal-content .flcell {
    position: relative;
    z-index: 5;
    display: flex;
    justify-content: space-between;
    flex-direction: row-reverse;
    margin: 0 0 6.5vw;
  }
  .modal-content .flcell .img {
    width: 34.5vw;
  }
  .modal-content .flcell .txt_cell {
    width: 38.2vw;
    padding: 6.9vw 0 0 2.7vw;
  }
  .modal-content .flcell .txt_cell.txt_E {
    width: 38.8vw;
  }
  .modal-content .flcell .txt_cell h2 {
    width: 34.4vw;
    height: 5.5vw;
    background: #1AAEFA;
    color: #fff;
    font-size: 2.15vw;
    font-weight: 600;
    line-height: 5.5vw;
    transform: rotate(-2.98deg);
    margin: 0 0 3.125vw 0vw;
    padding: 0 0vw;
    text-align: center;
  }
  .modal-content .flcell .txt_cell h2 span {
    font-size: 1.94vw;
  }
  .modal-content .flcell .txt_cell p {
    font-size: 1.11vw;
    font-weight: bold;
    line-height: 2.0;
    margin: 0;
  }
  .modal-content .flcell .txt_cell ul {
    margin: 2.0vw 0 0;
    display: flex;
    flex-wrap: wrap;
  }
  .modal-content .flcell .txt_cell ul li {
    margin-right: 1.0vw;
    margin-bottom: 1.0vw;
  }
  .modal-content .flcell .txt_cell ul li.logo01 {
    width: 12.5vw;
  }
  .modal-content .flcell .txt_cell ul li.logo02 {
    width: 14.5vw;
  }
  .modal-content .flcell .txt_cell ul li.logo03 {
    width: 17vw;
  }
  .modal-content .flcell .txt_cell ul li.logo04 {
    width: 13.4vw;
  }
  .modal-content .bg_blu {
    width: 73.9vw;
    padding: 5.2vw 0vw 7.9vw;
    background: url(../img/works/modal_bg.png) no-repeat center;
    background-size: cover;
    margin: 0 auto;
  }
  .modal-content .bg_blu .bg_blu_top {
    position: relative;
    width: 55.8vw;
    margin: 0 auto 5.5vw;
  }
  .modal-content .bg_blu .bg_blu_top .ttl {
    position: absolute;
    top: 4.16vw;
    left: 0;
    display: flex;
    flex-direction: column;
    transform: rotate(-2.98deg);
  }
  .modal-content .bg_blu .bg_blu_top .ttl.ttl_C {
    left: -6.25vw;
  }
  .modal-content .bg_blu .bg_blu_top .ttl.ttl_E {
    left: -3.8vw;
  }
  .modal-content .bg_blu .bg_blu_top .ttl.ttl_L {
    left: -4.16vw;
  }
  .modal-content .bg_blu .bg_blu_top .ttl span {
    padding: 0 1.0vw;
    background: #1AAEFA;
    color: #fff;
    font-size: 1.94vw;
    font-weight: bold;
    margin: 0 0 0.9vw;
    width: max-content;
  }
  .modal-content .bg_blu .bg_blu_top .photo {
    width: 35.9vw;
    margin: 0 0 0 auto;
  }
  .modal-content .bg_blu .bg_blu_top .txt_info {
    position: absolute;
    bottom: 0;
    left: 2.0vw;
    display: flex;
    align-items: flex-end;
  }
  .modal-content .bg_blu .bg_blu_top .txt_info .job {
    line-height: 1.66;
    font-size: 0.97vw;
    font-weight: 500;
    margin: 0 1.0vw 0 0;
    text-align: right;
  }
  .modal-content .bg_blu .bg_blu_top .txt_info .name {
    line-height: 1.0;
    font-size: 3.05vw;
    font-weight: bold;
    margin: 0 .0vw 0 0;
  }
  .modal-content .bg_blu .bg_blu_top .txt_info.info01 .name {
    margin-bottom: 0.1vw;
  }
  .modal-content .bg_blu .comment {
    font-size: 1.11vw;
    font-weight: bold;
    line-height: 2.0;
    width: 55.8vw;
    margin: 0 auto;
  }

  .modal-close {
    position: absolute;
    top: 0.0vw;
    right: 3.5vw;
    cursor: pointer;
    z-index: 10;
    width: 4.9vw;
  }

  .works .chart {
    background: #F6F6F6;
    padding: 9.0vw 0 9.0vw;
  }
  .works .chart .kv {
    position: relative;
    width: 88.5vw;
    margin: 0 auto;
  }

  .step:not(#q1) {
    position: relative;
    padding: 9.375vw 0 2.4vw;
    width: 63.2vw;
    margin: 5.9vw auto 0;
    background: #fff;
  }
  .step .sp_ttl {
    display: none;
  }
  .step#q1 {
    position: relative;
    padding: 9.375vw 0 2.4vw;
    margin: 0 auto;
    width: 63.2vw;
    background: #fff;
  }
  .step .step_img {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
  }
  .step#q1 .step_img {
    top: -2.1vw;
    width: 33.5vw;
  }
  .step#q2 .step_img {
    top: -3.125vw;
    width: 19.16vw;
  }
  .step#q3 .step_img {
    top: -3.125vw;
    width: 28.5vw;
  }
  .step#q4 .step_img {
    top: -0.4vw;
    width: 16.7vw;
  }
  .step#q5 .step_img {
    top: 1.0vw;
    width: 27.7vw;
  }
  .step#q6 .step_img {
    top: -1.7vw;
    width: 12.4vw;
  }
  .step#q7 .step_img {
    top: -1.38vw;
    width: 11.1vw;
  }
  .step#q8 .step_img {
    top: -0.4vw;
    width: 15.2vw;
  }
  .step#q9 .step_img {
    top: -4.16vw;
    width: 8.6vw;
  }
  .step#q10 .step_img {
    top: -2.4vw;
    width: 23.3vw;
  }
  .step p {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 2.0vw;
    font-size: 1.38vw;
    font-weight: bold;
    line-height: 1;
  }
  .step p img {
    width: 6.25vw;
    margin-right: 1.0vw;
  }
  .step .btn_cell {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
  }
  .step .btn_cell .answer {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 10.1vw;
    height: 3.68vw;
    margin: 0 1.45vw;
    background: #000;
    color: #fff;
    font-size: 1.38vw;
    font-weight: bold;
    border: none;
    cursor: pointer;
  }
  .step.answered {
    opacity: 0.6;
    pointer-events: none;
  }
  .step .answer {
    margin-right: 10px;
  }
  .step .answer.selected {
    background: #1AAEFA;
    color: #000;
  }

  #start-btn {
    position: absolute;
    bottom: 9.8vw;
    left: 0;
    right: 0;
    margin: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #000;
    color: #fff;
    border-radius: 0;
    width: 22.8vw;
    height: 5.7vw;
    font-size: 1.80vw;
    font-weight: bold;
    cursor: pointer;
    border: 2px solid #000;
  }
  #start-btn:hover {
    color: #000;
  }
  #start-btn span {
    position: relative;
    z-index: 2;
  }
  #start-btn:hover::before {
    transform: scaleX(1);
    transform-origin: left;
  }
  #start-btn::before {
    z-index: 1;
    position: absolute;
    top: 0;
    left: 0;
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: #fff;
    transform: scaleX(0);
    transform-origin: right;
    transition: all 0.5s ease;
    transition-property: transform;
  }
  #start-btn::after {
    display: block;
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #000;
    z-index: -1;
  }

  #start-btn:disabled {
    opacity: 0.5;
    cursor: default;
  }


  #results {
    display: none;
    background: #fff;
    width: 63.2vw;
    margin: 5.9vw auto 0;
    padding: 2.29vw 0 4.16vw;
  }
  #results .result_ttl {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 4.16vw;
    font-size: 1.38vw;
    font-weight: bold;
  }
  #results .result_ttl span {
    font-size: 2.22vw;
    font-weight: bold;
    width: 18.4vw;
    height: 4.6vw;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #000;
    margin-left: 1.7vw;
  }
  #results #result1 .result_ttl span,
  #results #result2 .result_ttl span {
    width: 22.4vw;
  }
  #results .flcell {
    display: flex;
    justify-content: space-between;
  }
  #results .flcell .img {
    width: 21.7vw;
  }
  #results .flcell .txt_cell {
    width: 33.6vw;
    margin-right: 3.4vw;
  }
  #results .flcell .txt_cell .detail {
    font-size: 1.11vw;
    font-weight: bold;
    line-height: 1.75;
    margin: 0 0 1.0vw;
  }
  #results .flcell .txt_cell .logo_cell {
    display: flex;
    margin: 0 0 0.7vw;
  }
  #results .flcell .txt_cell .logo_cell .logo01 {
    width: 9.375vw;
    margin-right: 1.5vw;
  }
  #results .flcell .txt_cell .logo_cell .logo04 {
    width: 9.375vw;
    margin-right: 1.5vw;
  }
  #results .flcell .txt_cell .btn {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 24vw;
    height: 3.6vw;
    background: #000;
    color: #fff;
    font-size: 1.11vw;
    font-weight: bold;
    margin: 0 0 1.6vw;
    cursor: pointer;
    border: 2px solid #000;
  }
  #results .flcell .txt_cell .btn span {
    position: relative;
    z-index: 2;
  }
  #results .flcell .txt_cell .btn:hover {
    color: #000;
  }
  #results .flcell .txt_cell .btn:hover::before {
    transform: scaleX(1);
    transform-origin: left;
  }
  #results .flcell .txt_cell .btn::before {
    z-index: 1;
    position: absolute;
    top: 0;
    left: 0;
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: #fff;
    transform: scaleX(0);
    transform-origin: right;
    transition: all 0.5s ease;
    transition-property: transform;
  }


  #results .flcell .txt_cell .list_select {
    display: flex;
  }
  #results .flcell .txt_cell .list_select li {
    font-size: 1.11vw;
    font-weight: bold;
    margin-right: 1.0vw;
    cursor: pointer;
  }
  #results .flcell .txt_cell .list_select li a {
    color: #000;
  }
  #results .flcell .txt_cell .list_select li a:hover {
    color: #1AAEFA;
  }
  #results .flcell .txt_cell .list_select li.reset-btn:hover {
    color: #1AAEFA;
  }
  #results .sp_ttl {
    display: none;
  }
  #question-area {
    display: none;
    background: url(../img/works/bg_question-area.png) no-repeat center;
    background-size: 100% 100%;
    padding: 9.5vw 0 9.5vw;
    margin: 3vw auto 0;
    width: 88.4vw;
  }
}

@media (max-width: 767px) {
  .under_ttl h1 span {
    font-size: 12.8vw;
    line-height: 1;
  }
  .under_ttl_img {
    position: relative;
    z-index: 6;
    margin-top: -32vw;
    margin-bottom: 0vw;
  }
  .works {
    margin-top: -0.5vw;
  }
  .works .works_mv {
    position: relative;
  }
  .works .works_mv .ttl01 {
    position: absolute;
    width: 50.4vw;
    top: 21.9vw;
    left: 4.8vw;
    z-index: 3;
    padding-top: 12.2vw;
    margin-top: -12.2vw;
  }
  .works .works_mv .ttl02 {
    position: absolute;
    width: 50.4vw;
    top: 203.2vw;
    right: 0vw;
    z-index: 3;
    padding-top: 12.2vw;
    margin-top: -12.2vw;
  }
  .works .works_mv .ttl03 {
    position: absolute;
    width: 50.4vw;
    top: 394.9vw;
    left: 2.8vw;
    z-index: 3;
    padding-top: 12.2vw;
    margin-top: -12.2vw;
  }
  .works .works_mv .ttl04 {
    position: absolute;
    width: 50.4vw;
    bottom: 62.6vw;
    right: 2.0vw;
    z-index: 3;
    padding-top: 12.2vw;
    margin-top: -12.2vw;
  }
  .works .works_mv .modal-trigger {
    position: absolute;
    width: 38.6vw;
    cursor: pointer;
  }
  .works .works_mv .photo01 {
    top: 44.0vw;
    left: 8.8vw;
  }
  .works .works_mv .photo02 {
    top: 31vw;
    right: 8.8vw;
  }
  .works .works_mv .photo03 {
    top: 162.8vw;
    left: 8.8vw;
  }
  .works .works_mv .photo04 {
    top: 133.8vw;
    right: 9.0vw;
  }
  .works .works_mv .photo05 {
    top: 246.8vw;
    left: 8.8vw;
  }
  .works .works_mv .photo06 {
    top: 301.0vw;
    right: 8.3vw;
  }
  .works .works_mv .photo07 {
    top: 335.3vw;
    left: 8.9vw;
  }
  .works .works_mv .photo08 {
    top: 434.9vw;
    right: 8.5vw;
  }
  .works .works_mv .photo09 {
    top: 435.8vw;
    left: 8.8vw;
  }
  .works .works_mv .photo10 {
    top: 482.1vw;
    left: 8.6vw;
  }
  .works .works_mv .photo11 {
    top: 483.7vw;
    right: 8.2vw;
  }
  .works .works_mv .photo12 {
    bottom: 26.0vw;
    right: 6.7vw;
    z-index: 5;
  }


  .modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /*
    background: rgba(0,0,0,0.6);
    */
    background: url(../img/works/modal_bg_sp.png) no-repeat center;
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
  }

  .modal-content {
    background: white;
    padding: 0 0 20vw;
    width: 91.4vw;
    position: relative;
    height: 70vh;
    overflow-y: auto;
    margin: 0 0 0 auto;
  }
  .modal-content .flcell {
    position: relative;
    z-index: 5;
    display: flex;
    flex-direction: column;
    margin: 0 0 6.5vw;
    padding: 6.6vw 0 0;
  }
  .modal-content .flcell .img {
    width: 84vw;
    margin: 0 0 16vw auto;
  }
  .modal-content .flcell .txt_cell {
    position: relative;
    z-index: 4;
    width: 77.3vw;
    padding: 0vw 0 0 0vw;
    margin: 0 auto;
  }
  .modal-content .flcell .txt_cell h2 {
    width: 75.7vw;
    height: 15.6vw;
    background: #1AAEFA;
    color: #fff;
    font-size: 5.33vw;
    font-weight: 600;
    line-height: 15.6vw;
    transform: rotate(-2.98deg);
    margin: 0 0 8.0vw 0vw;
    padding: 0 0vw;
    text-align: center;
  }
  .modal-content .flcell .txt_cell h2 span {
    font-size: 4.26vw;
  }
  .modal-content .flcell .txt_cell p {
    font-size: 3.73vw;
    font-weight: bold;
    line-height: 2.0;
    margin: 0;
  }
  .modal-content .flcell .txt_cell ul {
    margin: 4.0vw 0 0;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
  }
  .modal-content .flcell .txt_cell ul li {
    margin-bottom: 2.6vw;
  }
  .modal-content .flcell .txt_cell ul li.logo01 {
    width: 48.8vw;
  }
  .modal-content .flcell .txt_cell ul li.logo02 {
    width: 56.8vw;
  }
  .modal-content .flcell .txt_cell ul li.logo03 {
    width: 62.1vw;
  }
  .modal-content .flcell .txt_cell ul li.logo04 {
    width: 52.2vw;
  }
  .modal-content .bg_blu {
    width: 83.7vw;
    padding: 26.6vw 0vw 8.0vw;
    background: url(../img/works/modal_bg_blu_sp.png) no-repeat center;
    background-size: cover;
    margin: 0 0 0 auto;
  }
  .modal-content .bg_blu .bg_blu_top {
    position: relative;
    width: 67.2vw;
    margin: 0 auto 9.3vw;
  }
  .modal-content .bg_blu .bg_blu_top .ttl {
    position: absolute;
    top: -17.6vw;
    left: -12.6vw;
    display: flex;
    flex-direction: column;
    transform: rotate(-2.98deg);
  }
  .modal-content .bg_blu .bg_blu_top .ttl.ttl_C {
  }
  .modal-content .bg_blu .bg_blu_top .ttl.ttl_E {
  }
  .modal-content .bg_blu .bg_blu_top .ttl.ttl_L {
  }
  .modal-content .bg_blu .bg_blu_top .ttl span {
    padding: 1.0vw 2.0vw;
    background: #1AAEFA;
    color: #fff;
    font-size: 4.8vw;
    font-weight: bold;
    margin: 0 0 1.9vw;
    width: max-content;
  }
  .modal-content .bg_blu .bg_blu_top .ttl.ttl_C span {
    font-size: 4.26vw;
  }
  .modal-content .bg_blu .bg_blu_top .photo {
    width: 100%;
    margin: 0 auto;
  }
  .modal-content .bg_blu .bg_blu_top .txt_info {
    margin: 6.6vw 0 0 1.6vw;
    display: flex;
    align-items: flex-end;
  }
  .modal-content .bg_blu .bg_blu_top .txt_info .job {
    line-height: 1.66;
    font-size: 3.73vw;
    font-weight: 500;
    margin: 0 6.6vw -0.5vw 0;
    text-align: right;
  }
  .modal-content .bg_blu .bg_blu_top .txt_info .name {
    line-height: 1.0;
    font-size: 9.6vw;
    font-weight: bold;
    margin: 0 .0vw 0 0;
  }
  .modal-content .bg_blu .comment {
    font-size: 3.73vw;
    font-weight: bold;
    line-height: 2.0;
    width: 68vw;
    margin: 0 auto;
  }

  .modal-close {
    position: absolute;
    top: 10.5vw;
    right: 3.5vw;
    cursor: pointer;
    z-index: 10;
    width: 11.2vw;
  }

  .works .chart {
    background: #F6F6F6;
    padding: 9.0vw 0 9.0vw;
  }
  .works .chart .kv {
    position: relative;
    width: 82.4vw;
    margin: 0 auto;
  }

  .step:not(#q1) {
    position: relative;
    padding: 1.0vw 0 6.6vw;
    width: 67.4vw;
    margin: 5.3vw auto 0;
    background: #fff;
  }
  .step#q1 {
    position: relative;
    padding: 1.0vw 0 6.6vw;
    margin: 0 auto;
    width: 67.4vw;
    background: #fff;
  }
  .step .sp_ttl {
    width: 24vw;
    margin: 0 auto 1.8vw;
  }
  .step .step_img {
    margin: 0 auto 2.3vw;
  }
  .step#q1 .step_img {
    width: 62.9vw;
  }
  .step#q2 .step_img {
    width: 35.7vw;
  }
  .step#q3 .step_img {
    width: 53.6vw;
  }
  .step#q4 .step_img {
    width: 36.7vw;
  }
  .step#q5 .step_img {
    width: 47.7vw;
  }
  .step#q6 .step_img {
    width: 32.4vw;
  }
  .step#q7 .step_img {
    width: 31.1vw;
  }
  .step#q8 .step_img {
    width: 35.2vw;
  }
  .step#q9 .step_img {
    width: 28.6vw;
  }
  .step#q10 .step_img {
    width: 43.3vw;
  }
  .step p {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 6.3vw;
    font-size: 4.8vw;
    font-weight: bold;
    line-height: 1.5;
    text-align: center;
  }
  .step p img {
    display: none;
  }
  .step .btn_cell {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 auto;
    width: 54.6vw;
  }
  .step .btn_cell .answer {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 23.7vw;
    height: 10.6vw;
    margin: 0 0vw;
    background: #000;
    color: #fff;
    font-size: 4.26vw;
    font-weight: bold;
    border: none;
    cursor: pointer;
  }
  .step.answered {
    opacity: 0.6;
    pointer-events: none;
  }
  .step .answer.selected {
    background: #1AAEFA;
    color: #000;
  }

  #start-btn {
    position: absolute;
    bottom: 10.6vw;
    left: 0;
    right: 0;
    margin: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #000;
    color: #fff;
    border: none;
    border-radius: 0;
    width: 41.5vw;
    height: 11.1vw;
    font-size: 3.73vw;
    font-weight: bold;
    cursor: pointer;
  }
  #start-btn::after {
    display: block;
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #000;
    z-index: -1;
  }
  #start-btn:disabled span {
    opacity: 0.5;
    cursor: default;
  }

  #results {
    display: none;
    background: #fff;
    width: 67.4vw;
    margin: 4.0vw auto 0;
    padding: 8.8vw 0 7.4vw;
  }
  #results .result_ttl {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin: 0 auto 4.26vw;
    font-size: 4.26vw;
    font-weight: bold;
  }
  #results .result_ttl span {
    font-size: 5.33vw;
    font-weight: bold;
    width: 56.2vw;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #000;
    margin: 3.2vw auto 0;
    padding: 3.2vw 0;
    line-height: 1.4;
  }
  #results .flcell {
    display: flex;
    flex-direction: column;
  }
  #results .flcell .img {
    width: 100%;
    margin: 0 0 6.6vw;
  }
  #results .flcell .txt_cell {
    width: 55.7vw;
    margin: 0 auto;
  }
  #results .flcell .txt_cell .detail {
    font-size: 3.73vw;
    font-weight: bold;
    line-height: 1.75;
    margin: 0 0 5.3vw;
  }
  #results .flcell .txt_cell .logo_cell {
    display: flex;
    flex-direction: column;
    margin: 0 0 5.3vw;
  }
  #results .flcell .txt_cell .logo_cell .logo01 {
    width: 40vw;
  }
  #results .flcell .txt_cell .logo_cell .logo04 {
    width: 40vw;
  }
  #results .flcell .txt_cell .btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 55.7vw;
    height: 20.8vw;
    background: #000;
    color: #fff;
    font-size: 3.73vw;
    line-height: 1.7;
    font-weight: bold;
    margin: 0 0 6.6vw;
    cursor: pointer;
  }
  #results .flcell .txt_cell .list_select {
    display: flex;
    flex-direction: column;
  }
  #results .flcell .txt_cell .list_select li {
    font-size: 3.73vw;
    font-weight: bold;
    margin-bottom: 3.2vw;
    cursor: pointer;
  }
  #results .flcell .txt_cell .list_select li a {
    color: #000;
  }
  #question-area {
    display: none;
    background: url(../img/works/bg_question-area.png) no-repeat center;
    background-size: 100% 100%;
    padding: 9.5vw 0 9.5vw;
    margin: 0vw auto 0;
    width: 82.4vw;
  }
}