@charset "UTF-8";
@media screen and (min-width: 1080px) {
  p {
    font-size: 1.04vw;
    line-height: 2.08vw;
    font-feature-settings: "pwid";
    font-weight: 600;
  }

  main section>p {
    padding: 0 0 3.25vw;
    font-size: 1.04vw;
    line-height: 2.08vw;
    font-weight: 500;
    letter-spacing: 0;
  }

  #mainVPc {
    position: relative;
    z-index: 16;
  }

  .ttlImg.pcOnly {
    display: block;
  }

  .controllScrollOver {
    position: relative;
  }

  .controllScrollButtonWrap {
    right: 4%;
    left: initial;
    top: 27%;
    width: auto;
    display: block;
  }

  .controllScrollButtonWrap .controllScrollButtonNext {
    display: block;
    top: 1vw;
    right: -4vw;
    background-color: #fff;
    border: 1px solid #fff;
    width: 4.64vw;
    height: 4.64vw;
  }

  .controllScrollButtonWrap b {
    filter: brightness(0) saturate(100%) invert(0%) sepia(93%) saturate(7413%) hue-rotate(171deg) brightness(106%) contrast(101%);
  }

  .controllScrollButtonWrap button {
    display: block;
    background-color: #fff;
    height: 4.32vw;
    width: 4.32vw;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.16);
    border-radius: 50%;
  }

  /* .controllScrollButtonWrap .controllScrollButtonNext svg * {
    fill: #000;
  } */

  .controllScrollButtonWrap .controllScrollButtonNext img {
    width: .8vw;
  }

  .controllScrollButtonPrev {
    display: none;
  }

  .controllScrollButtonNext {
    right: -5vw;
  }

  #intro {
    height: auto;
  }

  #intro div {
    width: 31.77vw;
    margin: -2vw 0 5.5vw 24vw;
  }

  #intro p,
  #intro p:last-of-type {
    font-size: 1.35vw;
    line-height: 2.81vw;
    width: 30.77vw;
    letter-spacing: .07vw;
  }

  #intro img:last-child {
    position: absolute;
    z-index: 18;
    right: 2vw;
    top: 0vw;
    width: 18.24vw;
    margin: -7vw 18.5vw 0vw 0;
  }

  #keywordList {
    /* padding: 0 6.4vw; */
    padding: 0 5.7vw;
    height: auto;
  }

  #keywordList .list,
  #keywordList.active .list {
    height: auto;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: start;
    padding: 3vw 0 0;
    margin: 0 0 0 -2vw;
    gap: 0 1.5vw;
  }

  #keywordList h2 {
    width: 100%;
    height: 4.17vw;
    font-size: 4.69vw;
    text-align: center;
    margin: 0;
    margin-bottom: 1vw;
  }

  #keywordList h2 img {
    width: 21.5vw;
    height: auto;
    margin: auto;
  }

  #keywordList .list p {
    font-size: 1.25vw;
  }

  #keywordList a {
    display: flex;
    justify-content: space-between;
    margin: 2.9vw 0 0 0;
    height: 4.15vw;
    font-size: 1.2vw;
    width: auto;
    padding: 0 1.6vw;
    border-radius: 9999px;
  }

  #keywordList a:nth-of-type(12) {
    background-color: #3491CC;
    color: #fff;
  }

  #keywordList a:nth-of-type(12) img {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7500%) hue-rotate(180deg) brightness(105%) contrast(105%);

  }

  #keywordList a:nth-of-type(11) {
    background-color: #fff;
    color: #1D71A7;
    border: 2px solid #3491CC;
  }

  #keywordList a:nth-of-type(11) img {
    filter: brightness(0) saturate(100%) invert(49%) sepia(87%) saturate(461%) hue-rotate(161deg) brightness(88%) contrast(80%);
  }

  #keywordList a:nth-of-type(5) {
    margin-left: 7.5%;
  }

  #keywordList a:nth-of-type(7) {
    margin-right: 7.5%;
  }

  #keywordList a:nth-of-type(8) {
    margin-left: 10.5%;
  }

  #keywordList a:nth-of-type(10) {
    margin-right: 10.5%;
  }

  /* #keywordList a:nth-of-type(11){
    margin-left: 15.5%;
  } */
  #keywordList a:nth-of-type(13) {
    margin-right: 15.5%;
  }

  #keywordList a img {
    width: 1.2vw;
    height: auto;
    margin: 0 0 0 0.89vw;
  }


  #viewAll {
    display: none;
  }

  h1,
  .greenRead {
    font-size: 2.08vw;
    line-height: 3.13vw;
    padding: 0 0 1.5vw;
    font-weight: 600;

  }

  .greenBtn {
    margin: 2.6vw 0 0;
    width: 27.17vw;
    height: 5.31vw;
    padding: 0 2.24vw 0 3.13vw;
    font-size: 1.56vw;
    display: inline-flex;
  }

  .greenBtn:not(:first-of-type) {
    margin: 0;
  }

  .greenBtn img {
    width: 2.02vw;
    transition: all .4s;
  }

  .greenBtn:hover img {
    transform: translateX(.4vw);
  }



  main section h1 {
    padding: 0;
    align-items: center;
    margin: 7.02vw 0 3.13vw;
    font-size: 4.17vw;
    font-weight: 700;
  }

  main section h1 span {
    height: 7.08vw;
    width: 7.08vw;
    margin-right: 2.34vw;
    font-size: 3.49vw;
    padding-bottom: .7vw;
  }

  main section h1 p {
    font-size: 4.17vw;
    line-height: 2.5vw;
    font-weight: 500;
    width: auto;
  }

  .retsu1 {
    height: auto;
    min-height: 3.92vw;
    width: auto;
  }

  .retsu2 {
    height: 7.1vw;
    width: auto;
  }

  .controllScrollWrap .controllScrollItemWrap li {
    margin: 0 1.46vw 0 0;
  }

  .controllScrollWrap .controllScrollItemWrap li:first-child {
    margin: 0 1.46vw 0 0;
  }

  main section h1 img {
    height: 7.08vw;
    width: auto;
  }

  main section h1 span img {
    width: 4.25vw;
  }

  .ttlImg.spOnly {
    display: none;
  }

  .ttlImg {
    /* position: absolute; */
    height: auto;
  }

  #Q01Wrap,
  #Q02Wrap,
  #Q03Wrap,
  #Q04Wrap,
  #Q05Wrap,
  #Q06Wrap,
  #Q07Wrap,
  #Q08Wrap,
  #Q09Wrap,
  #Q10Wrap,
  #Q11Wrap,
  #Q12Wrap,
  #Q13Wrap {
    margin: 0 14.01vw 0 14.01vw;
  }



  #Q10Wrap li.controllScrollItem,
  #Q11Wrap li.controllScrollItem,
  #Q12Wrap li.controllScrollItem,
  #Q13Wrap li.controllScrollItem {
    height: 14.49vw;
    width: 17.87vw;
    font-size: 1.04vw;
    margin-bottom: 2.4vw;
    letter-spacing: 0;
    font-weight: 400;
  }

  #Q01Wrap li.controllScrollItem,
  #Q02Wrap li.controllScrollItem,
  #Q03Wrap li.controllScrollItem,
  #Q04Wrap li.controllScrollItem,
  #Q05Wrap li.controllScrollItem,
  #Q07Wrap li.controllScrollItem,
  #Q08Wrap li.controllScrollItem {
    border-radius: 0;
  }

  #Q07Wrap li.controllScrollItem img,
  #Q08Wrap li.controllScrollItem img,
  #Q10Wrap li.controllScrollItem img,
  #Q11Wrap li.controllScrollItem img,
  #Q12Wrap li.controllScrollItem img,
  #Q13Wrap li.controllScrollItem img {
    margin: 0 0 0.86vw;
  }

  .controllScrollWrap .controllScrollItemWrap li h3,
  .controllScrollWrap .controllScrollItemWrap li p {
    font-size: 1.04vw;
    line-height: 2.08vw;
    margin: 0;
  }

  .controllScrollWrap .controllScrollItemWrap li h3 {
    margin: .3vw 0;
    font-size: 1.3vw;
  }

  .flexWrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: start;
  }

  .flexInner {
    padding: 0;
  }

  #Q10Wrap .greenRead,
  #Q11Wrap .greenRead,
  #Q12Wrap .greenRead {
    padding: 0 0 1.5vw;
  }

  #Q01Wrap {
    position: relative;
  }

  #Q01Wrap .ttlImg {
    position: absolute;
    right: 0;
    width: 12.38vw;
    margin: 0 63vw 0 0;
  }

  #Q01Wrap h1 {
    margin: 9.97vw 0 3.46vw;
  }

  #Q01Wrap li.controllScrollItem {
    height: 21.51vw;
    width: 24.32vw;
    margin-bottom: 0;
  }

  #Q01Wrap .flexWrap p {
    width: 27.14vw;
  }

  #Q01Wrap .controllScrollOver {
    width: 38.75vw;
    margin: 1vw 0 0;
  }

  #Q02Wrap .ttlImg {
    position: absolute;
    right: 8vw;
    width: 8.24vw;
    margin: -2vw 38vw 0 0;
  }

  #Q02Wrap h1 {
    margin: 9.97vw 0 3.46vw;
  }

  #Q02Wrap .flexWrap p {
    width: 27.08vw;
  }

  #Q02Wrap .flexWrap {
    flex-flow: row-reverse;
  }

  #Q02Wrap .controllScrollOver {
    width: 36.51vw;
    margin: 0;
  }

  #Q02Wrap .controllScrollItemWrap {
    margin-left: 4.22vw;
  }

  #Q02Wrap .controllScrollItemWrap li {
    width: 24.38vw;
    height: 21.51vw;
    font-size: 0.99vw;
    line-height: 2.29vw;
    margin-bottom: 2.81vw;
  }

  #Q02Wrap .controllScrollButtonWrap {
    right: 5%;
  }

  #Q03Wrap .ttlImg {
    position: absolute;
    right: initial;
    left: -2vw;
    top: 8vw;
    width: 6.47vw;
    margin: 0 auto;
  }

  #Q03Wrap .controllScrollItemWrap li img {
    margin-bottom: .5vw;
  }

  #Q03Wrap h1 {
    margin: 7.02vw 0 3.13vw;
  }

  #Q03Wrap .controllScrollItemWrap:last-of-type li {
    height: 21.51vw;
    width: 24.32vw;
    margin-bottom: 0;
  }

  #Q03Wrap .greenRead {
    padding: 0 0 2.5vw;
  }

  #Q03Wrap .controllScrollOver {
    width: 38.8vw;
    margin: 0;
  }

  #Q03Wrap .controllScrollButtonWrap {
    right: 4%;
    top: 41%;
  }

  #Q03Wrap .flexInner {
    width: 27.14vw;

  }

  #Q03Wrap .controllScrollOver:first-of-type {
    margin-bottom: 1vw;
  }

  #Q03Wrap .controllScrollOver:last-of-type li {
    height: auto;
  }

  #Q04Wrap .ttlImg {
    position: absolute;
    height: auto;
    width: 6.32vw;
    margin: 0vw 0 0 19vw;
  }

  #Q04Wrap .flexWrap {
    flex-flow: row-reverse;
  }

  #Q04Wrap .flexInner {
    width: 17.66vw;
  }

  #Q04Wrap>p {
    width: 35.99vw;
    margin-left: 35.99vw;
  }

  #Q04Wrap li.controllScrollItem {
    width: 24.38vw;
    height: 21.51vw;
  }

  #Q04Wrap li.controllScrollItem img {
    margin-bottom: .62vw;
  }

  #Q04Wrap .controllScrollOver {
    margin: 0;
    width: 50.16vw;
  }


  #Q04Wrap .controllScrollButtonWrap {
    display: none;
  }

  #Q04Wrap .flexWrap.btn {
    flex-flow: row;
    width: 56.56vw;
    flex-wrap: wrap;
  }

  #Q04Wrap .flexWrap.btn .greenBtn {
    margin-top: 3.91vw;
  }

  #Q05Wrap .ttlImg {
    width: 8.43vw;
    margin: 0;
    position: absolute;
    right: initial;
    left: -4vw;
    top: 8vw;
  }

  #Q05Wrap .controllScrollItem {
    width: 24.33vw;
    margin-bottom: 0;
  }

  #Q05Wrap>p {
    width: 27.14vw;
  }

  #Q05Wrap>img {
    width: 27.14vw;
    margin-top: -1.81vw;

  }

  #Q05Wrap .controllScrollOver {
    width: 38.84vw;
    margin: 0;
  }

  #Q05Wrap .flexInner {
    width: 29.01vw;
  }

  #Q05Wrap>a {
    position: relative;
    margin-top: -2.81vw;
    z-index: 3;
  }

  #Q06Wrap li {
    width: 10.05vw;
    height: 10.16vw;
    padding: 1vw 0 0;
    margin: 0 2.19vw 0 0;
  }

  #Q06Wrap li .number {
    font-size: 1.93vw;
  }

  #Q06Wrap li p {
    font-size: 1.09vw;
    line-height: 1.46vw;
    height: 4.66vw;
  }

  #Q06Wrap .ttlImg {
    width: 43.66vw;
    margin: -1vw 1.5vw 0 0;
  }

  #Q06Wrap .flexWrap {
    flex-flow: row-reverse;
  }


  #Q06Wrap .flexInner {
    width: 27.08vw;
  }

  #Q06Wrap .controllScrollOver li:first-child {
    margin-left: 0;
  }

  #Q06Wrap>p {
    width: 27.14vw;
    margin-left: 44.84vw;
  }

  #Q06Wrap>p:first-of-type {
    margin-top: -20vw;
  }

  #Q06Wrap .controllScrollOver {
    width: 27.14vw;
    margin: 0 0 0 44.84vw;
  }

  #Q06Wrap .controllScrollWrap {
    padding-left: 0;
  }

  #Q06Wrap .controllScrollWrap::before {
    width: 93vw;
  }



  #Q06Wrap .controllScrollButtonWrap .controllScrollButtonNext {
    top: 0vw;
    right: -8%;
    height: 4.32vw;
    width: 4.32vw;
    background-color: #fff;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.16);
  }

  /* #Q06Wrap .controllScrollButtonWrap .controllScrollButtonNext svg *{
    fill: #000;
   } */
  #Q06Wrap .controllScrollButtonWrap .controllScrollButtonNext img {
    width: 0.42vw;
    filter: brightness(0) saturate(100%) invert(0%) sepia(96%) saturate(9%) hue-rotate(66deg) brightness(107%) contrast(100%);
  }

  #Q06Wrap .controllScrollButtonWrap {
    right: -9%;

  }

  #Q07Wrap .ttlImg {
    position: absolute;
    width: 13.11vw;
    margin: -1vw 0vw 0 -5vw;
  }

  #Q07Wrap>p {
    width: 27.14vw;
  }

  #Q07Wrap h1>img {
    height: 4.1vw;
  }

  #Q07Wrap .flexInner {
    width: 31.04vw;
  }

  #Q07Wrap .controllScrollOver {
    width: 34.56vw;
    margin: 0 0 0 2vw;
  }

  #Q07Wrap li.controllScrollItem {
    height: 25.3vw;
    width: 24.46vw;
    margin-bottom: 0;
  }

  #Q07Wrap li.controllScrollItem p {
    font-size: 1.04vw;
  }

  #Q07Wrap .controllScrollButtonWrap {
    right: 5%;
  }

  #Q08Wrap .ttlImg {
    width: 24.36vw;
    margin: 0;
    position: absolute;
    right: 28vw;
    top: 6vw;
    transform: rotate(26deg);
  }

  #Q08Wrap>p {
    width: 27.14vw;
  }

  #Q08Wrap .flexWrap {
    flex-flow: row-reverse;
  }

  #Q08Wrap .flexInner {
    width: 27.08vw;
  }

  #Q08Wrap li.controllScrollItem {
    width: 24.38vw;
    height: 21.51vw;
    margin-bottom: 0;
  }

  #Q08Wrap .controllScrollItemWrap {
    margin-left: 4.25vw;
  }

  #Q08Wrap .controllScrollOver {
    position: relative;
    width: 38.02vw;
    margin: 0;

  }

  #Q08Wrap .controllScrollButtonWrap {
    right: 5%;
  }

  #Q09Wrap>p {
    width: 27.14vw;
    margin-left: 44.84vw;
    padding: 0 0 2.25vw;
  }

  #Q09Wrap>img,
  #Q09Wrap>a {
    margin-left: 44.84vw;
    width: 27.14vw;
  }

  #Q09Wrap>img.spOnly {
    display: none;
  }

  #Q09Wrap .flexInner {
    width: 27.08vw;
  }

  #Q09ImgPc {
    margin: 0 0 -6vw;
  }

  #Q09Wrap>p:first-of-type {
    margin-top: -33vw;
  }

  #Q09Wrap .ttlImg {
    width: 42.08vw;
    margin: -1vw 0 0 -3vw;
  }

  #Q10Wrap .ttlImg {
    position: absolute;
    width: 48.03vw;
    margin: 0;
    right: -9vw;
  }

  #Q10Wrap .flexWrap p {
    width: 29.06vw;
  }

  #Q10Wrap > p:last-of-type {
    padding-bottom: 0;
    width: 29.06vw;

  }

  #Q10Wrap .greenBtn {
    width: 29.06vw;
  }

  #Q10Wrap .controllScrollOver {
    width: 40.99vw;
    margin: 0;
  }

  #Q10Wrap li.controllScrollItem {
    width: 16.87vw;
  }
  
  #Q10Wrap > a{
    margin-bottom: 2vw;
  }

  #Q11Wrap .ttlImg {
    width: 38.87vw;
    margin: 0;
  }

  #Q11Wrap>p {
    width: 28.56vw;
    margin-left: 44.56vw;
    padding: 0 0 1.75vw;
  }

  #Q11Wrap>p:first-of-type {
    margin-top: -22.56vw;
  }

  #Q11Wrap .controllScrollOver {
    width: 40.99vw;
    margin: 0 0 0 44.56vw;
  }

  #Q11Wrap li.controllScrollItem {
    width: 16.67vw;
  }

  #Q11Wrap a.greenBtn {
    margin: 0 0 0 44.56vw;
    width: 28.56vw;

  }

  #Q11Wrap p a {
    display: inline;
  }

  #Q12Wrap .ttlImg {
    position: absolute;
    width: 39.82vw;
    margin: -1vw 2vw 0 0;
    right: 0;
  }

  #Q12Wrap>p {
    width: 28.99vw;
    padding-bottom: 1vw;
  }

  #Q12Wrap li.controllScrollItem {
    width: 16.67vw;
  }

  #Q12Wrap .greenBtn {
    width: 29.06vw;
  }

  #Q12Wrap .greenBtn:last-of-type {
    margin-left: 3.13vw;
  }

  .detail {
    height: 3.8vw;
    width: 21.04vw;
    font-size: 1.41vw;
    border: 2px solid #02797A;
    transition: all .4s;
  }

  .detail:hover {
    background-color: #fff;
    color: #02797A;
  }
}