/*! Writen  by SCSS */
body {
  background: #000;
  color: #FFF; }

.sec_img {
  text-align: center;
  margin-bottom: clamp(40px, 5vw, 60px); }

.mainvisual .page_ttl_group {
  position: relative;
  padding-top: clamp(40px, 6.667vw, 80px); }

.sec_ttl {
  margin-bottom: 2em;
  margin-bottom: 2.25em; }
  @media screen and (max-width: 480px) {
    .sec_ttl {
      margin-bottom: 1em; } }

@media screen and (max-width: 480px) {
  .loaded .sec01 .img {
    opacity: 1; } }

.sec01 {
  margin-bottom: 75px;
  margin-bottom: clamp(70px, 8.334vw, 100px); }
  .sec01 .img {
    text-align: center;
    transition: opacity 1.5s ease-in-out 0s;
    opacity: 0;
    margin-bottom: 20px;
    margin-top: 20px;
    margin-bottom: 40px; }
    @media screen and (max-width: 480px) {
      .sec01 .img {
        transition: opacity 1.5s ease-in-out 0s;
        opacity: 0;
        margin-top: 0;
        margin-bottom: 0; } }
    .sec01 .img.p-view {
      opacity: 1; }
  .sec01 .text_wrap {
    margin-bottom: clamp(40px, 7.5vw, 90px); }
    .sec01 .text_wrap .read_flex {
      display: flex;
      flex-direction: column;
      row-gap: 2em;
      row-gap: 2.5em; }
      @media screen and (max-width: 480px) {
        .sec01 .text_wrap .read_flex {
          row-gap: 1em; } }
  .sec01 .img02 {
    position: relative;
    max-width: 1299px;
    margin-inline: auto;
    margin-bottom: 40px;
    /*.img02_2 {
    	position: absolute;
    	inset: 0;
    	z-index: -1;
    	
    	//clip-path: polygon(50% 0%, 50% 0, 50% 100%, 50% 100%);
    	top: auto;
    	
    	img {
    		width: 90px;
    		height: 659px;
    		margin-inline: auto;
    		transition: all 1.2s ease-in-out 1.1s;
    		opacity: 0;
    		
    	}
    	
    	&.p-view {
    		img {
    			width: 100%;
    			opacity: 1;
    		}
    		//clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    	}
    }*/ }
    @media screen and (max-width: 480px) {
      .sec01 .img02 {
        margin-bottom: 20px; } }
    .sec01 .img02 .img02_1 {
      position: relative;
      transition: all 0.6s ease-in-out 0.5s; }
    .sec01 .img02 .img02_2 {
      position: absolute;
      inset: 0;
      justify-content: center;
      display: flex;
      align-items: center; }
      .sec01 .img02 .img02_2 img {
        transform: scale(0.1, 1);
        height: 100%;
        opacity: 0;
        transition: 1s all ease-in-out 1s; }
      .sec01 .img02 .img02_2.p-view img {
        transform: scale(1, 1);
        opacity: 1; }
    @media screen and (max-width: 480px) {
      .sec01 .img02 {
        margin-inline: -100px; } }
    .sec01 .img02 .cap {
      right: 9.62%;
      bottom: 16.67%; }
      @media screen and (max-width: 480px) {
        .sec01 .img02 .cap {
          right: 100px;
          bottom: 11%; } }
  .sec01 .img03 .box_sld {
    overflow: hidden; }
    .sec01 .img03 .box_sld img {
      transform: scale(1.3);
      transition: transform 1.2s ease-out; }
      @media screen and (max-width: 480px) {
        .sec01 .img03 .box_sld img {
          transform: scale(1); } }
  .sec01 .img03.p-view img {
    transform: scale(1); }
  @media screen and (max-width: 480px) {
    .sec01 .img03 .sld1 img {
      max-width: 580px;
      width: 580px; } }

.sec02 {
  position: relative;
  margin-bottom: clamp(80px, 20vw, 240px); }
  @media screen and (max-width: 480px) {
    .sec02 {
      margin-bottom: 80px; } }
  .sec02 .text_wrap .ttl01 {
    color: #b09c52;
    font-size: clamp(30px, 5.5vw, 66px);
    line-height: 1;
    margin-bottom: clamp(25px, 5vw, 60px); }
  .sec02 .img01 {
    position: absolute;
    inset: 0;
    top: auto;
    text-align: center;
    transform: translateY(50%);
    max-width: 100%; }

/*# sourceMappingURL=concept.css.map */