@charset "utf-8";
/* CSS Document */

/*
max-width: 768px　-> max-width: 854px
*/

body {
  min-width: 1024px;
  @media screen and (max-width: 854px) {
    min-width: 100%!important;
    .pc{
      display: none;
    }
    .sp{
      display: block;
    }
  }
}
#concept {
  main {
    background-size: 100% auto;
    background-image: url('../img/concept/bg_01.jpg');

    .mainimg {
      position: relative;
      height: 100svh;

      transition: 1s;
      overflow: hidden;

      &-bg {
        &::before {
          mix-blend-mode: multiply;
          background-blend-mode: multiply;
          position: absolute;
          width: 100%;
          height: 100%;
          left: 0;
          top: 0;
          background-size: 100% auto;
          background-repeat: no-repeat;
          background-position: top right;
          background-image: url('../img/concept/img_03.png');
          content: "";
          z-index: 2;
          transform: scale(1.2);
          transition: 2s;
          transform-origin: 100% 0%;
          @media screen and (max-width: 854px) {
            background-image: url('../img/concept/img_03_sp.png');
          }
        }

        &::after {
          mix-blend-mode: multiply;
          background-blend-mode: multiply;
          position: absolute;
          width: 100%;
          height: 100%;
          left: 0;
          top: 0;
          background-size: 100% auto;
          background-repeat: no-repeat;
          background-position: bottom right;
          background-image: url('../img/concept/img_02.png');
          content: "";

          transform: scale(1.2);
          transition: 2s;
          transform-origin: 0 100%;
          z-index: 2;
          @media screen and (max-width: 854px) {
            background-image: url('../img/concept/img_02_sp.png');
          }
        }
      }

      &-logo {
        position: absolute;
        left: 50%;
		  top: 45%;
        z-index: 3;
        width: 60%;
        max-width: 240px;
        opacity: 0;

        transition: 2s;
        filter: blur(16px);
        transform: translateX(-50%) translateY(-50%);

        img {
          display: block;
          vertical-align: bottom;
          width: 100%;
        }
        @media screen and (max-width: 854px) {
          width: 36%;
        }
      }

      &-mainc {
        position: absolute;
        left: 50%;
        top: 45%;
        z-index: 4;
        width: 100%;
        max-width: 1100px;
        transform: translateX(-50%) translateY(-50%);

        @media screen and (max-width: 854px) {
          width: 80vw;
        }
        .i_img_04 {
          display: block;
          vertical-align: bottom;
          width: 100%;
          margin-left: auto;
          margin-right: auto;
          max-width: 800px;
          margin-bottom: 40px;
			transition: 2s;
			filter: blur(16px);
			opacity: 0;

			transform: translateY(40px);
          &.sp{
            display: none;
          }
          @media screen and (max-width: 854px) {
            margin-bottom: 6vw;
            &.pc{
              display: none;
            }
            &.sp{
              display: block;
            }
          }
        }

        .p1 {
          color: #231815;
          text-align: center;
          font-size: 20px;
          line-height: 2;
			filter: blur(16px);
			opacity: 0;
          font-weight: normal;
			transform: translateY(40px);
          @media screen and (max-width: 854px) {
            font-size: 3.8vw;
            font-size: 3.6vw;
            font-size: 3.5vw;
            white-space: nowrap;
            line-height: 2.3;
          }
          span {
            font-size: 26px;
            @media screen and (max-width: 854px) {
              font-size: 5.5vw;
              font-size: 5vw;
            }
          }

          i {
            font-style: normal;
            font-size: 30px;
            @media screen and (max-width: 854px) {
              font-size: 6.5vw;
              font-size: 6vw;
            }
          }
        }
      }

      &.ani1 {
        opacity: 1;

        .mainimg-logo {
          opacity: 1;

          filter: blur(0);
        }

        .mainimg-bg {
          &::before {
            opacity: 1;
            transform: scale(1, 1);

          }

          &::after {
            opacity: 1;
            transform: scale(1, 1);

          }

        }

      }

      &.ani2 {
        .mainimg-logo {
          opacity: 0;
          //filter: blur(16px);
          transition: .6s;
          //transform: translateX(-50%) translateY(-50%) scale(1.2);
        }
		  .mainimg-mainc{
			  .i_img_04 {
				  opacity: 1;
				  transform: scale(1, 1);
				  filter: blur(0);
			  }
			  .p1 {
				    transition: 2s .6s;
				  opacity: 1;
				  transform: scale(1, 1);
				  filter: blur(0);
			  }
		  }
      }
    }


    .seccontent{
      position: relative;
      overflow: hidden;
      .contents-inner{
        box-sizing: border-box;

        padding: 80px 40px;


max-width: 1100px;
        @media screen and (max-width: 854px) {
          padding: 8vw 6vw;
        }
        p.h3t{
          text-align: center;
          color: #00215b;
          font-size: 30px;
          margin-bottom: 40px;
          font-weight: normal;
          @media screen and (max-width: 1080px) {
            font-size: 2.6vw;
          }
          span{
            display: inline-block;
            padding: 6px;
            border-bottom: 1px solid #00215b;
          }
          &.c2{
            color: #727171;
            letter-spacing: .5em;
          }
          @media screen and (max-width: 854px) {
            font-size: 5.5vw;
            font-size: 4.5vw;
            &.c2{
              font-size: 5.5vw;
              font-size: 4.5vw;
              letter-spacing: 0;
            }
          }
        }

        .p1{
          text-align: center;
          color: #000000;
          font-feature-settings : "palt";
          letter-spacing: 0;
          font-weight: normal;
          //font-size: clamp(2.75rem, 1.1557rem + 2.4528vw, 4.375rem);
          font-size: 56px;
          font-size: 52px;
          white-space: nowrap;
          @media screen and (max-width: 1080px) {
            font-size: 4.3vw;
          }
          @media screen and (max-width: 854px) {
            font-size: 6vw;
            font-size: 5vw;
            margin-bottom: 3vw;
          }
          i{
            font-style: normal;
            color: #841218;
            font-size: 80px;
            line-height: 1;
            &.sty2{
              font-size: 56px;
              font-size: 52px;
            }
            @media screen and (max-width: 1080px) {
              font-size: 7vw;
            }
            @media screen and (max-width: 854px) {
              font-size: 11vw;
              &.sty2{
                font-size: 9vw;
              }
            }
          }
          sup{
            font-size: 14px;
display: inline-block;

                   transform: translateY(20px) ;
            margin-right: 4px;
            @media screen and (max-width: 854px) {
              transform: translateY(12px) ;
            }
          }
          @media screen and (max-width: 854px) {

          }
        }
        .p2{
          font-size: 34px;
          font-size: 31px;
          font-feature-settings : "palt";
          letter-spacing: 0;
          font-weight: normal;
          line-height: 2;
          &.tc{
            text-align: center;
          }
          i{
            font-style: normal;
            color: #841218;
            font-size: 60px;
            line-height: 1;
            @media screen and (max-width: 1080px) {
              font-size: 5vw;
            }
            &.sty2{
              font-size: 34px;
            }
          }
          span{

            display: inline-block;
            border-bottom: 1px dashed #000000;
            &.sp{
              display: none;
            }
            @media screen and (max-width: 854px) {
              &.sp{
                display: inline-block;
              }
              &.pc{
                display: none;
              }
            }
          }
          @media screen and (max-width: 854px) {
            font-size: 5vw;
            font-size: 4.5vw;
            i{
              font-size: 8vw;
              font-size: 7vw;
              &.sty2{
                font-size: 6vw;
                font-size: 5vw;
              }
            }
          }
        }
        .p4{
          text-align: center;
          color: #000000;
          font-feature-settings : "palt";
          letter-spacing: 0;
          font-weight: normal;
          //font-size: clamp(2.75rem, 1.1557rem + 2.4528vw, 4.375rem);
          font-size: 14px;
          //white-space: nowrap;
          line-height: 2;
          &.tc{
            text-align: center;
          }
          @media screen and (max-width: 854px) {
            font-size: 3vw;
          }
        }
        .p3{
          text-align: center;
          color: #000000;
          font-feature-settings : "palt";
          letter-spacing: 0;
          font-weight: normal;
          //font-size: clamp(2.75rem, 1.1557rem + 2.4528vw, 4.375rem);
          font-size: 22px;
          //white-space: nowrap;
          line-height: 2;

          &.tc{
            text-align: center;
          }
          @media screen and (max-width: 1080px) {
font-size: 1.8vw;
          }
          @media screen and (max-width: 854px) {
            font-size: 4vw;
          }
        }
        .at1{
          position: relative;
          text-align: center;
          .ap1{
            text-align: center;
            color: #000000;
            font-feature-settings : "palt";
            letter-spacing: 0;
            //font-size: clamp(2.75rem, 1.1557rem + 2.4528vw, 4.375rem);
            font-size: 60px;
            display: inline-block;
            line-height: 1;
            font-weight: normal;
            @media screen and (max-width: 1080px) {
              font-size: 5vw;
            }
            @media screen and (max-width: 854px) {
              //font-size: 8vw;
              font-size: 6vw;
            }
            b{
              text-align: left;
              font-weight: normal;
              //font-size: clamp(1.25rem, 1.0047rem + 0.3774vw, 1.5rem);
              font-size: 18px;
              margin-bottom: 4px;
              display: block;
	margin-left: 0;
		margin-right: auto;
              @media screen and (max-width: 1080px) {
              font-size: 2vw;
              margin-bottom: 0;
              }
              @media screen and (max-width: 854px) {
                font-size: 3.5vw;
                font-size: 3vw;
              }
            }
            span{
              line-height: 1;
              display: inline-block;
              //font-size: clamp(5rem, 1.934rem + 4.717vw, 8.125rem);
              font-size: 80px;
              @media screen and (max-width: 1080px) {
                font-size: 6.5vw;
                font-size: 5.5vw;
              }
              @media screen and (max-width: 854px) {
                font-size: 9vw;
                font-size: 8vw;
              }
            }
            i{
              color: #00215b;
              font-size: 100px;
              //font-size: clamp(6.25rem, 3.184rem + 4.717vw, 9.375rem);
              padding: 0 10px;
              //font-style: normal;
              @media screen and (max-width: 1080px) {
                font-size: 7.5vw;
                font-size: 6.5vw
              }
              @media screen and (max-width: 854px) {
                font-size: 11vw;
                font-size: 10vw;
                padding: 0 0px;
              }
            }
            small{
              font-size: 18px;
              //font-size: clamp(1rem, 0.7547rem + 0.3774vw, 1.25rem);
              @media screen and (max-width: 854px) {
                font-size: 3.5vw;
                display: block;
                width: 100%;
                text-align: right;
              }
            }
          }
        }
        .at2{
          position: relative;
          text-align: left;
          font-feature-settings : "palt";
          letter-spacing: 0;
          line-height: 1;
          font-weight: normal;
          .ap2{
            //font-size: clamp(1.0625rem, 0.8785rem + 0.283vw, 1.25rem);
            font-size: 16px;
            margin-bottom: 10px;
            display: block;
            @media screen and (max-width: 1080px) {
              font-size: 1.6vw;
              margin-bottom: 4px;
            }
            @media screen and (max-width: 854px) {
              font-size: 3.5vw;
              font-size: 3vw;
              &.sty3{
                padding-left: 13vw;
                margin-top: 3vw;
              }
            }
          }
          .ap3{
            font-size: 40px;
            //font-size: clamp(2.5rem, 1.8868rem + 0.9434vw, 3.125rem);
            @media screen and (max-width: 1080px) {
              font-size: 3.5vw;
            }
            @media screen and (max-width: 854px) {
              font-size: 6vw;
              font-size: 5vw;
            }
            span{
              //font-size: clamp(3.75rem, 3.1368rem + 0.9434vw, 4.375rem);
              font-size: 50px;
              @media screen and (max-width: 1080px) {
                font-size: 4.5vw;
              }
              @media screen and (max-width: 854px) {
                width: 100%;
                font-size: 9vw;
                font-size: 8vw;
              }
            }
            i{
              padding: 0 10px;
              //font-size: clamp(3.75rem, 3.1368rem + 0.9434vw, 4.375rem);
              font-size: 64px;
              &.c2{
                color: #00215b;
                font-size: 70px;
                @media screen and (max-width: 1080px) {
                  font-size: 5vw;
                }
                @media screen and (max-width: 854px) {
                  font-size: 10vw;
                  font-size: 9vw
                }
              }
              @media screen and (max-width: 1080px) {
                font-size: 5.5vw;
              }
              @media screen and (max-width: 854px) {
                font-size: 11vw;
                font-size: 10vw;
                padding: 0 0px;
              }
            }
            @media screen and (max-width: 854px) {
              text-align: center;
            }
          }
          .ap4{
            font-size: 14px;
            margin-top: 10px;
            &.tr{
              text-align: right;
            }
            @media screen and (max-width: 854px) {
              font-size: 3vw;
              line-height: 1.8;
              font-size: 2.5vw;
              margin-top: 0;
              line-height: 1.3;
            text-align: center;
              &.sty2{
                width: 100%;
                text-align: center;

                //font-size: 2.5vw;
                //padding-left: 10vw;

              }
            }
          }
        }

        .ap5{
          font-feature-settings : "palt";
          letter-spacing: 0;
          line-height: 1;
          font-weight: normal;
          font-size: 22px;
          margin-bottom: 10px;
          span{
            font-size: 28px;
            @media screen and (max-width: 1080px) {
              font-size: 2.5vw;
            }
          }
          @media screen and (max-width: 1080px) {
            font-size: 2vw;
          }
        }
        .ap6{
          font-feature-settings : "palt";
          letter-spacing: 0;
          line-height: 1;
          font-weight: normal;
          font-size:24px;
          span{
            //font-size: clamp(3.75rem, 3.1368rem + 0.9434vw, 4.375rem);
            font-size: 34px;
            @media screen and (max-width: 1080px) {
              font-size: 3vw;
            }
          }
          i{
            color: #00215b;
            padding: 0 10px;
            //font-size: clamp(3.75rem, 3.1368rem + 0.9434vw, 4.375rem);
            font-size:34px;
            @media screen and (max-width: 1080px) {
              font-size: 3vw;
            }
          }
          @media screen and (max-width: 1080px) {
            font-size: 2.2vw;
          }
          @media screen and (max-width: 854px) {
            font-size: 3.5vw;
            font-size: 3vw;
            line-height: 1.7;
            span{
              font-size: 5.5vw;
              font-size: 4.5vw;
            }
            i{
              padding: 0 0px;
              font-size: 6vw;
              font-size: 5vw;
            }
          }
        }
        .ap7{
          font-size: 14px;
          font-weight: normal;
          margin-top: 6px;
          @media screen and (max-width: 854px) {
            font-size: 3vw;
            font-size: 2.5vw;
            line-height: 1.3;
          }
        }

      }
      figure{
        margin: 0;
        padding: 0;
        position: relative;
        .note{
              position: absolute;
                  right: 5px;
                  bottom: 5px;
          color: #fff;
          font-size: 12px;
          z-index: 3;
          &.b{
            color: #000;
          }
          @media screen and (max-width: 854px) {
            font-size: 0.7em;
            //line-height: 1;
          }
        }
        img{
          	display: block;
          		vertical-align: bottom;
          		width: 100%;
        }

        &.i_h3img{
          width: 90%;
          margin-left: 0;
          margin-right: auto;
          max-width: 1800px;
          &.r{
            margin-left: auto;
            margin-right: 0;
          }
        }
      }

      &.sec1{
        margin-top: -60px;
        z-index: 7;

        .i_img_06{
          position: absolute;
          width: 100%;
          height: 100%;
          left: 0;
          top: 0;
          z-index: 2;
        }
      }
      &.sec2{
        z-index: 7;

        max-width: 1800px;
        margin-left: auto;
        margin-right: auto;
        position: relative;
        .p1{
position: absolute;
          font-size:60px;
          line-height: 2;
text-align: center;
          color: #fff;
          z-index: 2;
          right: 10%;
          top: 30%;
          font-weight: normal;
          @media screen and (max-width: 1080px) {
            font-size: 4.5vw;
          }
          @media screen and (max-width: 854px) {
            font-size: 9vw;
            font-size: 6.5vw;
            right: auto;
            left: 5%;
          }
        }
      }
      &.sec5{
        z-index: 7;

        max-width: 1800px;
        margin-left: auto;
        margin-right: auto;
        position: relative;

        .p1{
          position: absolute;
          font-size:60px;
          line-height: 2;
          text-align: center;
          color: #231815;
          z-index: 2;
          left: 5%;
          top: 36%;
          font-weight: normal;
          @media screen and (max-width: 1080px) {
            font-size: 4.5vw;
          }
          @media screen and (max-width: 854px) {
            font-size: 9vw;
            font-size: 6.5vw;
            left: 5%;
            top: 12%;
          }
        }
      }
      &.sec10{
        z-index: 7;

        max-width: 1800px;
        margin-left: auto;
        margin-right: auto;
        position: relative;

        .p1{
          position: absolute;
          font-size:60px;
          line-height: 2;
          text-align: center;
          color: #fff;
          z-index: 2;
          left: 5%;
          top: 36%;
          font-weight: normal;
          @media screen and (max-width: 1080px) {
            font-size: 4.5vw;
          }
          @media screen and (max-width: 854px) {
            font-size: 9vw;
            font-size: 6.5vw;
          }
        }
      }
      &.sec13{
        .i_img_53{
          margin-top: 60px;
          margin-bottom: 20px;
          .pc{

          }
          .sp{
display: none!important;
          }
          @media screen and (max-width: 854px) {
            margin-top: 8vw;
            margin-bottom: 3vw;
            .pc{

              display: none;
            }
            .sp{
              display: block!important;
            }
          }
        }
      }
      &.sec12{
        z-index: 7;

        max-width: 1800px;
        margin-left: auto;
        margin-right: auto;
        position: relative;

        .p1{
          position: absolute;
          font-size:60px;
          line-height: 2;
          text-align: center;
          color: #fff;
          z-index: 2;
          right: 5%;
          top: 36%;
          font-weight: normal;
          @media screen and (max-width: 1080px) {
            font-size:4.5vw;
          }
          @media screen and (max-width: 854px) {
            font-size: 9vw;
            font-size: 6.5vw;
            top: 16%;
          }
        }
      }
      &.sec6{
        padding-top:80px ;


        @media screen and (max-width: 854px) {
          padding-top:10vw;

        }
        .sec6b{
          display: flex;
          justify-content: center;
          align-items: center;
          flex-wrap:wrap;

          max-width: 860px;
          margin-left: auto;
          margin-right: auto;
          margin-top: 60px;
          dt{
            width: 20%;
            .i_img_16{
              width: 170%;
             margin-left: -110px;
              @media screen and (max-width: 854px) {
                width: 170%;
                margin-left: -100px;
              }
              @media screen and (max-width: 380px) {
                margin-left: -74px;
              }
            }

            .i_img_22{
              width: 170%;
              margin-left: -110px;
              @media screen and (max-width: 854px) {
                margin-left: -60px;
                margin-top: -180px;
              }
            }
            @media screen and (max-width: 854px) {
              width: 30%;
            }
          }
          dd{
            width: 80%;
            display: flex;
            justify-content: center;
            align-items: center;
            flex-wrap:wrap;
            padding-left: 20px;
            @media screen and (max-width: 854px) {
              padding-left: 0px;
              width: 70%;
            }
            .sec6b_22{
              @media screen and (max-width: 854px) {
                margin-right: -14vw;
                        transform: translateY(-40px) ;
              }
            }
            .p2{
              width: 100%;
              margin-bottom: 30px;
            }
            .i_img_17{
              width: 38%;
              position: relative;
              .note{
                position: absolute;
                right: auto;
                left: 0;
                bottom: -20px;
                font-feature-settings : "palt";
                letter-spacing: 0;

                white-space: nowrap;
              }
              @media screen and (max-width: 854px) {
                width: 62%;

                margin-left: 3vw;
                margin-right: auto;
                .note{
                  bottom: -40px;
                }
              }
            }
            .i_img_18{
              width: 38%;
              margin-left: 20px;
              .note{
                position: absolute;
                right: auto;
                left: 0;
                bottom: -20px;
                font-feature-settings : "palt";
                letter-spacing: 0;

                white-space: nowrap;
              }
              @media screen and (max-width: 854px) {
                width: 64%;
                margin-top: 13vw;
       	margin-left: auto;
       		margin-right: 0;

              }
            }

            .i_img_23{
              width: 36%;
              margin-top: 30px;
              .note{
                position: absolute;
                right: auto;
                left: 0;
                bottom: -20px;
                font-feature-settings : "palt";
                letter-spacing: 0;

                white-space: nowrap;
              }
              @media screen and (max-width: 854px) {
                width: 48%;
                margin-left: 20px;
                position: absolute;
                left: 40px;
                margin-top: 300px;
              }
            }
            .i_img_24{
              width: 36%;
              margin-left: 30px;
              margin-bottom: 30px;
              .note{
                position: absolute;
                right: auto;
                left: 0;
                bottom: -20px;
                font-feature-settings : "palt";
                letter-spacing: 0;

                white-space: nowrap;
              }
              @media screen and (max-width: 854px) {
                width: 56%;
                margin-right: -20px;

                width: 76%;
                margin-left: 30px;
                margin-bottom: 50px;
                .note{
                  left: auto;
                  right: 0;
                  text-align: right;
                  bottom: -40px;
                }
              }
            }
          }
        }
        .sec6a{
          display: flex;
          justify-content: center;
          align-items: center;
          flex-wrap:wrap;

          max-width: 860px;
          margin-left: auto;
          margin-right: auto;
          margin-top: 60px;
          dt{
            width: 60%;
            position: relative;
            @media screen and (max-width: 854px) {
              width: 100%;
            }
          }
          dd{
           width: 38%;
            position: relative;
            @media screen and (max-width: 854px) {
              width: 100%;
            }
          }
          &.sty2{
            dt{
              width: 70%;
              position: relative;
              @media screen and (max-width: 854px) {
                width: 100%;
              }
            }
            dd{
              width: 30%;
              position: relative;
              @media screen and (max-width: 854px) {
                width: 100%;
              }
            }

          }
          .i_img_21{
            width: 110%;
            margin-right: -20px;
            margin-top: 20px;
            @media screen and (max-width: 854px) {
              width: 50%;
              	margin-left: auto;
              		margin-right: 0;
              margin-top: -20px;
            }
          }
          .i_img1920{
            display: flex;
            justify-content: center;
            align-items: center;

            flex-wrap:wrap;
            margin-top: 30px;
            @media screen and (max-width: 854px) {
              margin-top: 10px;
              margin-left: -40px;
            }
          }
          .i_img_19{
            width: 42%;
            z-index: 2;
            margin-top: -40px;
            .note{
              position: absolute;
              right: auto;
              left: 0;
              bottom: -20px;
              font-feature-settings : "palt";
              letter-spacing: 0;

              white-space: nowrap;
            }
            @media screen and (max-width: 854px) {
              .note{
                bottom: -40px;
              }
              //margin-top: -20px;
              	margin-left: 40px;
              margin-top: 60px;
              		margin-right: auto;
            }
          }
          .i_img_20{
            width: 42%;
            position: relative;
            z-index: 3;
            margin-top: 80px;
            margin-left: -40px;
            .note{
              position: absolute;
              right: auto;
              left: 0;
              bottom: -20px;
              font-feature-settings : "palt";
              letter-spacing: 0;

              white-space: nowrap;
            }
            @media screen and (max-width: 854px) {
              .note{
                bottom: -40px;
              }
              margin-left: 0;
              margin-top: -60px;
              margin-right: auto;

            }
          }

          .i_img_14{
            position: relative;
            z-index: 3;
            width: 80%;
            margin-left: auto;
            margin-right: 0;
            display: block;
            @media screen and (max-width: 854px) {
              width: 56%;
            }
          }
          .i_img_15{
            display: block;
            width: 70%;
            position: relative;
            margin-top: -20px;
            z-index: 1;
            	margin-left: 0;
            		margin-right: auto;
            overflow: visible;
            .note{
              position: absolute;
              right: auto;
              left: 0;
              bottom: -20px;
              font-feature-settings : "palt";
              letter-spacing: 0;

              white-space: nowrap;
            }
            @media screen and (max-width: 854px) {
              width: 56%;
            }
          }


          .i_img_26{
            position: relative;
            z-index: 3;
            width: 74%;
            margin-left: -60px;
            margin-right: auto;
            display: block;
            .note{
              position: absolute;
              right: auto;
              left: 0;
              bottom: -20px;
              font-feature-settings : "palt";
              letter-spacing: 0;

              white-space: nowrap;
            }
            @media screen and (max-width: 854px) {
              width: 56%;
              margin-left: 30px;
            }

          }
          .i_img_25{
            display: block;
            width:84%;
            position: relative;
            margin-bottom: -40px;
            z-index: 1;

            margin-left: auto;
            margin-right: 0;
            @media screen and (max-width: 854px) {
              width:56%;
              margin-right: -20px;
              margin-top: -80px;
            }
          }
        }
      }
      &.sec11{
        position: relative;
        .sec11a{
          display: flex;
          justify-content: space-between;
          align-items: flex-start;
          flex-wrap:wrap;
          margin-top: 60px;
          margin-bottom: 20px;
          @media screen and (max-width: 854px) {
            margin-top: 8vw;
            margin-bottom: 3vw;
          }
          .p3{
            text-align: left;
            color: #231815;
            position: relative;
            z-index: 3;

          }
          .ico{
            position: absolute;
            width: 140px;
            left: -40px;
            top: -10px;
            z-index: 2;
            @media screen and (max-width: 854px) {
              width: 120px;
              left: -20px;
            }
          }
          dt{
            width: 48%;
            position: relative;
            @media screen and (max-width: 854px) {
              width: 100%;
              margin-bottom: 6vw;
            }
          }
          dd{
            width: 48%;
            position: relative;
            @media screen and (max-width: 854px) {
              width: 100%;
            }
          }
        }
        .sec11b{
          display: flex;
          justify-content: space-between;
          align-items: flex-start;
          flex-wrap:wrap;
          margin-top: 60px;
          margin-bottom: 20px;
          @media screen and (max-width: 854px) {
            margin-top: 8vw;
            margin-bottom: 3vw;
          }
          .p3{
            text-align: left;
            color: #231815;
            position: relative;
            z-index: 3;
          }
          .ico{
            position: absolute;
            width: 140px;
            left: -40px;
            top: -10px;
            z-index: 2;
            @media screen and (max-width: 854px) {
              width: 120px;
              left: -20px;
            }
          }
          dt{
            width: 48%;
            position: relative;
            @media screen and (max-width: 854px) {
              width: 100%;
              order: 2;
            }

          }
          dd{
            width: 48%;
            position: relative;
            @media screen and (max-width: 854px) {
              width: 100%;
              order: 1;
              margin-bottom: 6vw;
            }
          }
        }
      }
      &.sec7{
        overflow: hidden;
        .sec7a{
          display: flex;
          justify-content: center;
          align-items: flex-start;
          flex-wrap:wrap;

          max-width: 860px;
          margin-left: auto;
          margin-right: auto;
          margin-top: 60px;
          dt{
            position: relative;
            width: 20%;
            .i_img_28{
              width: 150%;
              margin-left: -110px;
              @media screen and (max-width: 854px) {
                margin-left: -30px;
                margin-left: 0;
                margin-right: auto;
                width: 48%;
              }
            }
            .i_img_32{
              width: 160%;
              margin-left: -110px;
            }
            @media screen and (max-width: 854px) {
              width: 100%;
              order: 2;
              .i_img_29{
right: 0;
                  position: absolute;

                  top: 0;
                  width: 50%;
                  margin-left: auto;
                  margin-right: 0;
                .note{
                  bottom: -20px;
                }
              }
            }
          }
          dd{
            position: relative;
            width: 80%;
            display: flex;
            justify-content: flex-start;
            align-items: center;
            flex-wrap:wrap;
            padding-left: 20px;
            padding-top: 100px;
            @media screen and (max-width: 854px) {
              padding-left: 0px;
            }
            .p2{
              width: 100%;
              margin-bottom: 30px;
            }
            .i_img_29{
              width: 34%;
              position: absolute;
              right: -60px;
              //top: -80px;
              top: 0;
              .note{
                position: absolute;
                right: auto;
                left: 0;
                bottom: -0px;
                font-feature-settings : "palt";
                letter-spacing: 0;

                white-space: nowrap;
              }
              @media screen and (max-width: 854px) {
                position: relative;
                right: auto;
                top: auto;
                width: 50%;
                	margin-left: auto;
                		margin-right: 0;
                .note{
                  bottom: -40px;
                }
              }
            }

            position: relative;
            .i_img_33{
              position: relative;
              z-index: 3;
              width: 42%;
margin-top: 20px;
              display: block;
              @media screen and (max-width: 854px) {
                width: 60%;
                margin-left: -50px;

              }
            }
            .i_img_34{
              display: block;
              width: 34%;
              position: relative;
margin-top: -20px;
              z-index: 1;
              .note{
                position: absolute;
                right: auto;
                left: 0;
                bottom: -20px;
                font-feature-settings : "palt";
                letter-spacing: 0;

                white-space: nowrap;
              }
              @media screen and (max-width: 854px) {
                width: 56%;
                position: absolute;
                right: 0;
                //top: 200px;
                bottom: 40px;

              }

            }
            @media screen and (max-width: 854px) {
              width: 100%;
              padding-top: 0px;
              order: 1;
            }
          }
        }
        .i_img_32{
          @media screen and (max-width: 854px) {
            width: 52%;
            position: relative;
            	margin-left: auto;
            		margin-right: -10px;
            margin-bottom: -80px;
          }
        }
        .sec7b{
          display: flex;
          justify-content: center;
          align-items: center;
          flex-wrap:wrap;

          max-width: 860px;
          margin-left: auto;
          margin-right: auto;
          margin-top: 60px;
          dt{
            position: relative;
            width: 74%;
            .p2{
              width: 100%;

            }
            @media screen and (max-width: 854px) {
              width: 100%;
              order: 1;
            }
          }
          dd{
            width: 26%;
            position: relative;

            display: flex;
            justify-content: flex-start;
            align-items: center;
            flex-wrap:wrap;
            padding-left: 20px;

            .i_img_30{
              display: block;
	margin-left: -230px;
              margin-top: -100px;
		margin-right: auto;
              width: 130%;
              padding-bottom: 20px;
              z-index: 3;
              position: relative;
              .note{
                right: 60px;

              }
              @media screen and (max-width: 854px) {
                margin-left: auto;
                width: 60%;
                margin-right: 0;
                margin-top: -60px;
              }
            }
            .i_img_31{
              z-index: 2;
              display: block;
              margin-left: auto;
              margin-right: 0;
              margin-top: -70px;
              width: 100%;
              position: relative;
              .note{
                position: absolute;
                right: auto;
                left: 0;
                bottom: -20px;
                font-feature-settings : "palt";
                letter-spacing: 0;

                white-space: nowrap;
              }
              @media screen and (max-width: 854px) {
                width: 64%;
                	margin-left: -10px;
                		margin-right: auto;
              }
            }
            .i_img_35{
              padding-bottom: 20px;
              //width: 130%;
              display: block;
              position: relative;
              //margin-left: -100px;
              //margin-left: -160px;
              margin-left: -143px;
              @media screen and (max-width: 854px) {
                margin-left: 40px;
                width: 70%;
                margin-top: 20px;
              }
            }
            @media screen and (max-width: 854px) {
              width: 100%;
              order:2;
            }
          }
        }
      }
      &.sec8{
        z-index: 7;

        max-width: 1800px;
        margin-left: auto;
        margin-right: auto;
        position: relative;

        .i_img_36{
          .note{
            right: 15px;
            @media screen and (max-width: 854px) {
              right: 5px;
            }
          }
        }
        .p1{
          position: absolute;
          font-size:60px;
          line-height: 2;
          text-align: center;
          color: #fff;
          z-index: 2;
          right: 5%;
          top: 36%;
          font-weight: normal;
          @media screen and (max-width: 1080px) {
            font-size: 4.5vw;
          }
          @media screen and (max-width: 854px) {
            font-size: 9vw;
            font-size: 6.5vw;
            right: 5%;
            top: 12%;
          }
        }
      }
      &.sec9{

        max-width: 1800px;
        margin-left: auto;
        margin-right: auto;
        position: relative;

        .p1{
          margin-bottom: 40px;
        }
        .sec9a{
          position: relative;
          .i_img_37_01{
            position: relative;
            .note{
              bottom:13%;
              right: 31%;
            }
          }
          .i_img_37_02{
            position: absolute;
            width: 100%;
            height: 100%;
            left: 0;
            top: 0;
            z-index: 2;
            .note{
              bottom: 40%;
            }
          }
        }

        .i_img_38{
          width: 100vw;
                  margin-left: calc(-1 * (100vw - 100%) / 2);
          margin-top: 60px;
          margin-bottom: 60px;
          .note{
            right: 25px;
          }
          @media screen and (max-width: 854px) {
            margin-top: 8vw;
            margin-bottom: 8vw;
            .note{
              right: 6px;
            }
          }
        }
        .i_img_44{
          margin-top: 60px;
          margin-bottom: 60px;
          @media screen and (max-width: 854px) {
            margin-top: 8vw;
            margin-bottom: 8vw;
          }
        }
        .sec9b{
          border: 1px solid #000;
          border-top:none;
          margin-top: 80px;
          margin-bottom: 60px;

          &::before{
                width: 20%;
                    height: 1px;
                    content: "";
                    background-color: #000;
                    position: absolute;
                    left: 0;
                    top:0;

          }
          &::after{
            width: 20%;
            height: 1px;
            content: "";
            background-color: #000;
            position: absolute;
            right: 0;
            top:0;

          }
          @media screen and (max-width: 854px) {
            margin-top: 10vw;
            margin-bottom: 8vw;
          }
          position: relative;
          padding: 40px;
          padding-top: 10px;
          padding-bottom: 20px;
          @media screen and (max-width: 854px) {
            padding: 3vw;
          }
          .p2{
            text-align: center;

                transform:  translateY(-30px);
            line-height: 1;
            span{

            }
            @media screen and (max-width: 854px) {
              line-height: 1.8;
              transform:  translateY(-40px);
              font-size: 4.5vw;
            }
          }
        }
        .sec9c{
          display: flex;
          justify-content: center;
          align-items: center;
          flex-wrap:wrap;
          gap: 20px;
          box-sizing: border-box;

          @media screen and (max-width: 854px) {
            gap: 1%;
            margin-top: -6vw;
          }
          li{
            width: 18%;
            @media screen and (max-width: 854px) {
              width: 30%;
              box-sizing: border-box;
              margin-bottom: 3vw;
              p{
                font-size: 3vw;
              }
            }
          }
        }

      }
      &.sec3{
        padding-top:80px ;
        overflow: hidden;

        @media screen and (max-width: 854px) {
          padding-top:10vw;

        }
        .i_img_09{
          max-width: 800px;
          margin-left: auto;
          margin-right: auto;
          margin-top: 60px;
          margin-bottom: 60px;
          @media screen and (max-width: 854px) {
            margin-top: 8vw;
            margin-bottom: 8vw;
            .note{
              bottom: -12px;
              right: 0;
            }
          }
        }
        .sec3a{
          display: flex;
          justify-content: center;
          align-items: center;
          flex-wrap:wrap;

          max-width: 860px;
          margin-left: auto;
          margin-right: auto;
          margin-top: 60px;
          @media screen and (max-width: 854px) {
            margin-top:1vw;
          }
          dt{
            width: auto;
            display: inline-block;
            position: relative;
            padding-right: 20px;
            &::before{
                  width: 1px;
                      height: 60%;
                      content: "";
                      background-color: #000;
                      position: absolute;


right: 0;
              top: 50%;
                      transform: translateY(-50%);

            }
            @media screen and (max-width: 854px) {
              width: 100%;
              padding-right: 0;
              &::before{
                display: none;
              }

              .at2{
                margin-bottom: 3vw;
                .ap2.sty2{
                  padding-left: 18vw;
                }
                .ap2.sty3{
                  margin-top: 3vw;
                  padding-left: 13vw;
                }
              }
            }
          }
          dd{
            padding-left: 20px;
            width: auto;
            display: inline-block;
            @media screen and (max-width: 854px) {
              width: 100%;
              padding-left: 0;
            }
          }
        }
        .sec3b{
          max-width:1000px;
          margin-left: auto;
          margin-right: auto;
        }

      }
      &.sec4 {
        padding-top: 80px;
        overflow: hidden;

        @media screen and (max-width: 854px) {
          padding-top: 10vw;

        }
        .i_img_11{
          max-width: 800px;
          margin-left: auto;
          margin-right: auto;
          margin-top: 60px;
          margin-bottom: 60px;
          @media screen and (max-width: 854px) {
            margin-top: 8vw;
            margin-bottom: 8vw;
          }
        }
        .sec4a{
          display: flex;
          justify-content: center;
          align-items: center;
          flex-wrap:wrap;

          max-width: 1000px;
          margin-left: auto;
          margin-right: auto;
          margin-top: 60px;
          @media screen and (max-width: 854px) {
            margin-top: 8vw;
          }
          dt{
            width: auto;
            display: inline-block;
            position: relative;
            padding-right: 20px;

            &::before{
              width: 1px;
              height: 60%;
              content: "";
              background-color: #000;
              position: absolute;


              right: 0;
              top: 50%;
              transform: translateY(-50%);

            }
            @media screen and (max-width: 854px) {
              padding-right: 0px;
              &::before{
                display: none;
              }
            }
          }
          dd{
            padding-left: 20px;
            width: auto;
            display: inline-block;
            @media screen and (max-width: 854px) {
              padding-left: 0px;
            }
          }
        }
      }

    }
  }


  @media screen and (max-width: 1080px) {
  .sp1{
    display: block!important;
  }
  }
  @media screen and (max-width: 854px) {
    p.caution {
padding-left: 3vw;
      padding-right: 3vw;
    }
    img.pc{
      display: none!important;
    }
  }

}