/* Base */
*{
margin:0;
padding:0;
line-height:170%;
}
html { 
font-size: 62.5%; 
}
body {
margin:0 auto;
padding:0;
text-align:center;
color: #222;
background:#fff;
font-size:1.4rem;
font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}
@media all and (-ms-high-contrast:none) {
body {
font-family: "メイリオ",Meiryo,"游ゴシック",YuGothic,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック","MS PGothic",sans-serif;
font-weight: normal;
}
}
body.is-fixed {
  overflow: hidden;
  height: 100vh;
}
/* Windows */
@font-face {
  font-family: YuGothicM;
  font-weight: 400;
  src: local('YuGothic-Medium'),  /* Mediumを明示的に指定 */
       local('Yu Gothic Medium'), /* Chrome用 */
       local('YuGothic-Regular'); /* Windows8.1ではMediumがないのでRegularを指定 */
}
@font-face {
  font-family: YuGothicM;
  font-weight: bold;
  src: local('YoGothic-Bold'), /* Boldはそのまま */
       local('Yu Gothic');     /* Chrome用 */
}
body.noscroll {
position: fixed;
width:100%;
overflow-y: scroll;
}
a:link {
color:#222;
text-decoration:underline;
}
a:hover {
color:#333;
text-decoration:underline;
}
a:active {
color:#333;
text-decoration:underline;
}
a:visited {
color:#333;
text-decoration:underline;
}
img{
margin: 0;
padding: 0;
vertical-align: bottom;
border:none;
}
input, button, textarea, select {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
ul li{
list-style:none;
}
.mbotom5 {
margin-bottom:5px;
}
.font-50 {
font-size:5remx;
}
.font-40 {
font-size:4rem;
}
.font-30 {
font-size:3rem;
}
.font-24 {
font-size:2.4rem;
}
.font-22 {
font-size:2.2rem;
}
.font-20 {
font-size:2rem;
}
.font-18 {
font-size:1.8rem;
}
.font-16 {
font-size:1.6rem;
}
.font-14 {
font-size:1.4rem;
}
.font-12 {
font-size:1.2rem;
}
.font-10 {
font-size:1rem;
}
.font-8 {
font-size:0.8rem;
}
.mbotom10 {
margin-bottom:10px;
}
.mbotom15 {
margin-bottom:15px;
}
.mbotom20 {
margin-bottom:20px;
}
.mbotom25 {
margin-bottom:25px;
}
.mbotom30 {
margin-bottom:30px;
}
.mbotom35 {
margin-bottom:35px;
}
.mbotom40 {
margin-bottom:40px;
}

.mbotom50 {
margin-bottom:50px;
}
.mbotom60 {
margin-bottom:60px;
}
.mbotom70 {
margin-bottom:70px;
}
.mbotom80 {
margin-bottom:80px;
}
.mbotom90 {
margin-bottom:90px;
}
.mbotom100 {
margin-bottom:100px;
}
.mbotom110 {
margin-bottom:110px;
}
.mbotom120 {
margin-bottom:120px;
}
.mbotom130 {
margin-bottom:130px;
}
.mbotom140 {
margin-bottom:140px;
}
.mbotom150 {
margin-bottom:150px;
}
.mtop10 {
margin-top:10px;
}
.mtop15 {
margin-top:15px;
}
.mtop20 {
margin-top:20px;
}
.mtop30 {
margin-top:30px;
}
.mtop40 {
margin-top:40px;
}
.mleft10 {
margin-left:10px;
}
.mleft15 {
margin-left:15px;
}
.mleft20 {
margin-left:20px;
}
.mleft30 {
margin-left:30px;
}
.mleft40 {
margin-left:40px;
}
.mright10 {
margin-right:10px;
}
.mright15 {
margin-right:15px;
}
.mright20 {
margin-right:20px;
}
.mboth10 {
margin:10px 0px;
}
.mboth15 {
margin:15px 0px;
}
.mboth20 {
margin:20px 0px;
}
.mboth30 {
margin:30px 0px;
}
.mboth_lr10 {
margin:0px 10px;
}
.mboth_lr15 {
margin:0px 15px;
}
.mboth_lr20 {
margin:0px 20px;
}
.mboth_all10 {
margin:10px;
}
.mboth_all15 {
margin:15px;
}
.mboth_all20 {
margin:20px;
}
.padbottom10 {
padding-bottom:10px;
}
.padbottom15 {
padding-bottom:15px;
}
.padbottom20 {
padding-bottom:20px;
}
.padbottom30 {
padding-bottom:30px;
}
.padbottom40 {
padding-bottom:40px;
}
.padtop10 {
padding-top:10px;
}
.padtop15 {
padding-top:15px;
}
.padtop20 {
padding-top:20px;
}
.padtop30 {
padding-top:30px;
}
.padtop40 {
padding-top:40px;
}
.padleft10 {
padding-left:10px;
}
.padleft15 {
padding-left:15px;
}
.padleft20 {
padding-left:20px;
}
.padleft30 {
padding-left:30px;
}

.padright10 {
padding-right:10px;
}
.padright15{
padding-right:15px;
}
.padright20 {
padding-right:20px;
}
.padboth10 {
padding:10px 0px;
}
.padboth15 {
padding:15px 0px;
}
.padboth20 {
padding:20px 0px;
}
.padboth_lr10 {
padding:0px 10px;
}
.padboth_lr15 {
padding:0px 15px;
}
.padboth_lr20 {
padding:0px 20px;
}
.padboth_all10 {
padding:10px;
}
.padboth_all15 {
padding:15px;
}
.padboth_all18 {
padding:18px;
}
.padboth_all20 {
padding:20px;
}
.padboth_all30 {
padding:30px;
}
.height2em{
height:2em;
}
.height25em{
height:2.5em;
}
.height3em{
height:3em;
}
.img_float_right_top {
padding-left:10px;
padding-bottom:10px;
float:right;
}
.img_float_left_top {
padding-right:10px;
padding-bottom:10px;
float:left;
}
.img_align_left_top {
padding-right:10px;
padding-bottom:10px;
}
.img_align_right_top {
padding-left:10px;
padding-bottom:10px;
}

.indent-5em {
padding-left:0.5em;
text-indent:-0.5em;
}
.indent1em {
padding-left:1em;
text-indent:-1em;
}
.indent15em  {
padding-left:1.7em;
text-indent:-1.7em;
}
.indent2em  {
padding-left:2em;
text-indent:-2em;
}
.indent3em  {
padding-left:3em;
text-indent:-3em;
}
.indent6em  {
padding-left:6em;
text-indent:-6em;
}

.text-height-4em{
height:4em;
}
.text-height-3em{
height:3em;
}
.text-height-2em{
height:3em;
}

.font-bold {
font-weight:bold;
}

br.brake{
display:block;
}
br.no-brake{
display:none;
}
.align_left{
text-align:left;
}
.align_center{
text-align:center;
}
.align_right{
text-align:right;
}

/*基本カラー*/
.keycolor-font-ptn1 {
color:#8f1d22;
}
.keycolor-font-ptn2 {
color:#222;
}
.keycolor-font-ptn3 {
color:#6f1714;
}
.keycolor-font-ptn4 {
color:#FF9900;
}
.keycolor-font-ptn5 {
color:#FF3300;
}

.button{
cursor: pointer;
}
.button:hover{
filter:alpha(opacity=70);
-moz-opacity: 0.7;
opacity: 0.7;
}
.vertical_bottom{
vertical-align:bottom;
}
br.break{
display:block;
}
br.sp-break{
display:none;
}
.disp-pc{
display:block;
}
.disp-sp{
display:none;
}

@media (max-width: 768px) {
br.brake{
display:none;
}
br.sp-break{
display:block;
}
}

.img_hover:hover{
filter:alpha(opacity=70);
-moz-opacity: 0.7;
opacity: 0.7;
}

::-moz-selection {
    background: #222;
    text-shadow: none;
    color:#fff;
}

::selection {
    background: #222;
    text-shadow: none;
    color:#fff;
}

input{
vertical-align:middle; 
}
:placeholder-shown {color: #999}
/* Google Chrome, Safari, Opera 15+, Android, iOS */
::-webkit-input-placeholder {color: #999; }
/* Firefox 18- */
:-moz-placeholder {color: #999; opacity: 1; }
/* Firefox 19+ */
::-moz-placeholder {color: #999; opacity: 1; }
/* IE 10+ */
:-ms-input-placeholder {color: #999; }

.jp-font{
font-family:"Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
}
.Oswald-font{
font-family: 'Oswald', sans-serif;
font-weight:100;
}
.Teko-font{
font-family: 'Teko', sans-serif;
font-weight:100;
}


/****imgwid***/
img.img-full-wid{
width:100%;
height:auto;
}
img.img-max-wid{
max-width:100%;
height:auto;
}
img.vtop{
vertical-align: top;
}
/****imgwid***/

	
	
/*========= LoadingのためのCSS ===============*/
#loading {
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 99999999;
	background:#fff;
	text-align:center;
	color:#fff;
}

#loading-img {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

#loading-img img {
	width:260px;
}

.fadeUp{
animation-name: fadeUpAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity: 0;
}

@keyframes fadeUpAnime{
  from {
    opacity: 0;
	transform: translateY(100px);
  }

  to {
    opacity: 1;
	transform: translateY(0);
  }
}



/****pagetop***/
#pagescrolltop {
display: none;
position: relative;
right: 10px;
width:35px;
height:35px;
cursor: pointer;
background: url(images/pagetop.png) no-repeat center top;
overflow:hidden;
z-index:200;
transition: 0.3s ease;
zoom:1;
}

#pagescrolltop:hover{
filter:alpha(opacity=80);
-moz-opacity: 0.8;
opacity: 0.8;
transition: 0.3s ease;
}
#pagescrolltop span{
  display: none;
}



/* ### load ## */
/* 非表示 */
.is-hide {
    display: none;
}
/* LOADING */
#loader-bg {
  background: #8F1D22;
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 20000;
}
#loader {
  height: 120px;
  left: 50%;
  margin-left: -60px;
  margin-top: -60px;
  position: fixed;
  top: 50%;
  width: 120px;
}
#loader p {
display: none;
    color: #fff;
    font-size: 1.2rem;
    line-height: 1.4;
    text-align: center;
}
#loader p img {
    display: inline-block;
}

.self-building-square-spinner, .self-building-square-spinner * {
      box-sizing: border-box;
    }

    .self-building-square-spinner {
      height: 40px;
      width: 40px;
      margin: 0 auto;
      top: calc( 50% - 20px );
       position:relative;
    }

    .self-building-square-spinner .square {
      height: 10px;
      width: 10px;
      top: calc( -10px * 2 / 3);
      margin-right: calc(10px / 3);
      margin-top: calc(10px / 3);
      background: #fff;
      float: left;
      position:relative;
      opacity: 0;
      animation: self-building-square-spinner 6s infinite;
      /* transform: rotate(-45deg);*/
    }

    .self-building-square-spinner .square:nth-child(1) {
      animation-delay: calc(300ms * 6);
    }

    .self-building-square-spinner .square:nth-child(2) {
      animation-delay: calc(300ms * 7);
    }

    .self-building-square-spinner .square:nth-child(3) {
      animation-delay: calc(300ms * 8);
    }

    .self-building-square-spinner .square:nth-child(4) {
      animation-delay: calc(300ms * 3);
    }

    .self-building-square-spinner .square:nth-child(5) {
      animation-delay: calc(300ms * 4);
    }

    .self-building-square-spinner .square:nth-child(6) {
      animation-delay: calc(300ms * 5);
    }

    .self-building-square-spinner .square:nth-child(7) {
      animation-delay: calc(300ms * 0);
    }

    .self-building-square-spinner .square:nth-child(8) {
      animation-delay: calc(300ms * 1);
    }

    .self-building-square-spinner .square:nth-child(9) {
      animation-delay: calc(300ms * 2);
    }

    .self-building-square-spinner .clear{
      clear: both;
    }

    @keyframes self-building-square-spinner {
      0% {
        opacity: 0;
      }
      5% {
        opacity: 1;
        top: 0;
      }
      50.9% {
        opacity: 1;
        top: 0;
      }
      55.9% {
        opacity: 0;
        top: inherit;
      }
    }
    

/***fadein***/
.fadein {
  opacity: 0;
  transform : translate(0, 50px);
  transition : all 2000ms;
}

.fadein.scrollin{
  opacity: 1;
  transform: translate(0, 0);
}



/***fontanime***/
.char {
  -webkit-animation-delay: var(--del);
          animation-delay: var(--del);
  -webkit-animation-direction: var(--dir, normal);
          animation-direction: var(--dir, normal);
  -webkit-animation-duration: var(--dur);
          animation-duration: var(--dur);
  -webkit-animation-iteration-count: var(--it, infinite);
          animation-iteration-count: var(--it, infinite);
  -webkit-animation-name: var(--name);
          animation-name: var(--name);
  -webkit-animation-timing-function: var(--tf);
          animation-timing-function: var(--tf);
  -webkit-animation-fill-mode: var(--fill, forwards);
          animation-fill-mode: var(--fill, forwards);
  display: inline-block;
  position: relative;
  -webkit-transform-origin: 50% 100%;
          transform-origin: 50% 100%;
  z-index: 1;
}

.headline--float .char {
  --name: float;
  --dur: 1500ms;
  --del: calc(var(--char-index) * -0.5s);
  --tf: ease-in-out;
  --dir: alternate;
}
.headline--float .char:nth-child(2n) {
  --name: float-alt;
}
@-webkit-keyframes float {
  from {
    -webkit-transform: translate(2%, -6%) rotate(-1deg);
            transform: translate(2%, -6%) rotate(-1deg);
  }
  to {
    -webkit-transform: translate(-2%, 6%) rotate(3deg);
            transform: translate(-2%, 6%) rotate(3deg);
  }
}
@keyframes float {
  from {
    -webkit-transform: translate(2%, -6%) rotate(-1deg);
            transform: translate(2%, -6%) rotate(-1deg);
  }
  to {
    -webkit-transform: translate(-2%, 6%) rotate(3deg);
            transform: translate(-2%, 6%) rotate(3deg);
  }
}
@-webkit-keyframes float-alt {
  from {
    -webkit-transform: translate(0%, -6%) rotate(-1deg);
            transform: translate(0%, -6%) rotate(-1deg);
  }
  to {
    -webkit-transform: translate(2%, 6%) rotate(3deg);
            transform: translate(2%, 6%) rotate(3deg);
  }
}
@keyframes float-alt {
  from {
    -webkit-transform: translate(0%, -6%) rotate(-1deg);
            transform: translate(0%, -6%) rotate(-1deg);
  }
  to {
    -webkit-transform: translate(2%, 6%) rotate(3deg);
            transform: translate(2%, 6%) rotate(3deg);
  }
}
/***fontanime***/

	
	
	:root {
      --easing: cubic-bezier(0.2, 1, 0.2, 1);
      --transition: 0.8s var(--easing);
      --color-base: #f8f8f8;
      --color-gray: #ddd;
      --color-theme: #000;
      --color-theme-darken: #f12617;
      --box-shadow: 0.8rem 0.8rem 1.2rem rgba(0, 0, 0, 0.05),
        -0.8rem -0.8rem 1.2rem #fff;
      --box-shadow-hover: 1rem 1rem 1.5rem rgba(0, 0, 0, 0.08),
        -1rem -1rem 1.5rem #fff;
      --box-shadow-inset: inset 0.8rem 0.8rem 1.2rem rgba(0, 0, 0, 0.05),
        inset -0.8rem -0.8rem 1.2rem #fff;
      --box-shadow-dark: 0.8rem 0.8rem 1.2rem rgba(0, 0, 0, 0.1),
        -0.8rem -0.8rem 1.2rem rgba(#fff, 0.2);
    }
#wrapper {
/*display: flex;*/
/*flex-direction: column;*/
/*position: relative;*/
}
.c-loader-bg {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #fff;
z-index: 100;
display: grid;
place-items: center;
		pointer-events: none;
		
}

.c-optext {
display: inline-flex;
align-items: center;
justify-content: start;
pointer-events: none;
}

.c-optext>span {
 display: block;
font-size:30px;
font-weight:bold;
color:#fff;
}

.c-optext>span+span {
margin-left: 3rem;
}


/****openning****/
.openning-area{
width:100%;
height:100vh;
display: flex;
justify-content: center;
align-items: center
}
.openning-area>p img{
width:200px;
height:auto;
}


/****main****/
#main-wrap{
width:100%;
margin:0 auto;
text-align:center;
		position:relative;
			background-color:#000;
			overflow:hidden;
}
#main-wrap img{
max-width:100%;
height:auto;
}
.main-img-box{
position:relative;
/*height:1087px;*/
height:100vh;
}
.main-img1,
.main-img2,
.main-img3,
.main-img4,
.main-img5,
.main-img6,
.main-img7,
.main-img8,
.main-img9,
.main-img10,
.main-img11,
.main-img12,
.main-img13,
.main-img14,
.main-img15,
.main-img16,
.main-img17,
.main-img18,
.main-img19,
.main-img20,
.main-img21,
.main-img22,
.main-img23{
position: absolute;
}
.main-img1{
top:0;
left:0;
}
.main-img2{
top:0;
left:16.8%;
}
.main-img3{
top:28.5%;
left:0px;
}
.main-img4{
top:17%;
left:15.7%;
}
.main-img5{
left:0px;
bottom:10%;
}
.main-img6{
left:19%;
bottom:18%;
}
.main-img7{
left:17%;
bottom:0px;
}
.main-img8{
left:0;
bottom:0;
}
.main-img9{
left:32%;
top:0;
}
.main-img10{
right:17%;
top:0;
}
.main-img11{
right:0;
top:0;
}
.main-img12{
right:0;
top:21%;
}
.main-img13{
left:21%;
top:28%;
}
.main-img14{
right:16%;
top:29%;
}
.main-img15{
right:0px;
bottom:27%;
}
.main-img16{
right:21%;
bottom:20%;
}
.main-img17{
right:0;
bottom:0;
}
.main-img18{
left:28%;
bottom:0;
}
.main-img19{
left:44%;
top:22.5%;
}
.main-img20{
left:39%;
top:39%;
}
.main-img21{
right:31%;
top:43%;
}
.main-img22{
right:27.3%;
bottom:0;
}
.main-img23{
right:13.2%;
bottom:0;
}
	
#head{
position: absolute;
top:4%;
left:3.5%;
z-index:20;
}
.head-container{
width:100%;
margin:0 auto;
text-align:center;
}
.head-container>h1{
text-align:left;
}
.head-container>h1 img{
width:188px;
height:auto;
}

#title{
position: absolute;
width:100%;
margin:0 auto;
text-align:center;
top:0;
left:0;
z-index:15;
/*background: rgba(97,83,66,0.6);*/
background: rgba(34,34,34,0.4);
}
.title-container{
width:100%;
height:100vh;
display: flex;
justify-content: center;
align-items: center
}
.title-container>h2 img{
width:300px;
height:auto;
}
#main-mv{
position: absolute;
bottom:5%;
right:5%;
z-index:15;
}
#main-mv img{
border-radius:20px;
}

@media screen and (min-width:1400px) and ( max-width:1600px) {

}
@media screen and (min-width:1000px) and ( max-width:1100px) {
#main-mv img{
width:90%;
}
}
@media (width <= 768px) {
	
}
/****main****/

			
#policy-wrap{
width:100%;
margin:0 auto;
text-align:center;
padding-top:300px;
padding-bottom:300px;
}
.policy-container{
width:100%;
margin:0 auto;
text-align:center;
position:relative;
}
.policy-container>h3{
margin-bottom:50px;
}
.policy-container>h3 p{
font-size:7rem;
line-height:100%;
letter-spacing: .3rem;
font-weight:bold;
}
.policy-container>h3 p:nth-child(1){
margin-bottom:30px;
}
.policy-read>p{
font-size:2rem;
line-height:220%;
letter-spacing: .3rem;
font-weight:bold;
}
.policy-read>p:nth-child(2){
font-size:3rem;
}
@media (max-width: 768px) {
#policy-wrap{
width:94%;
padding-top:150px;
padding-bottom:150px;
}
.policy-container>h3{
margin-bottom:30px;
}
.policy-container>h3 p{
font-size:3rem;
line-height:140%;
}
.policy-container>h3 p:nth-child(1){
margin-bottom:0px;
}
.policy-read>p{
font-size:1.6rem;
line-height:180%;
}
.policy-read>p:nth-child(2){
font-size:2rem;
}
}




#ceo-wrap{
width:100%;
margin:0 auto;
text-align:center;
background-color:#8f1d22;
background-repeat:repeat;
background-position:top center;
background-image:url(../img/bg_content_red.jpg);
background-attachment: fixed;
}
#ceo-wrap img{
max-width:100%;
height:auto;
}
.ceo-container {
width:100%;
margin:0 auto;
text-align:center;
position: relative;
display: flex;
justify-content: space-between;
/*z-index:60;*/
}
/*コンテンツ*/
.ceo-row {
width: 45%;
}
.ceo-row div {
padding-top: 60vh;
/*padding-right:10vh;*/
padding-right:10%;
color:#fff;
}
.ceo-row div:last-child {
padding-bottom: 60vh;
			}
.ceo-row div>h2 { 
font-size: 3.6rem;
text-align:left;
margin-bottom:40px;
color:#fff;
}
.ceo-row div>h3 { 
font-size: 2.6rem;
text-align:left;
margin-bottom:30px;
color:#fff;
}
.ceo-row div>p {
font-size:2rem;
line-height:100%;
text-align:left;
margin-bottom:40px;
font-weight:bold;
color:#fff;
}
.ceo-row div>span {
display:block;
font-size:1.4rem;
line-height:220%;
text-align: justify;
text-justify: inter-ideograph;
color:#fff;
overflow-wrap: break-word;
word-break: break-all;
}
.ceo-row div>strong {
margin-top:50px;
display:block;
text-align: left;
}
/*画像*/
.ceo-imgs {
width: 45%;
height:100vh;/*画像サイズ固定*/
display: flex;
align-items: center;
position: sticky;/*画像固定*/
position: -webkit-sticky;/*Safari用*/
top:0%;
}
.ceo-imgs img {
object-fit: cover;
}
.ceo-imgs p {
height:100vh;
margin: auto;
display: block;
visibility: hidden;/*要素の領域は確保されたまま不可視状態*/
position: absolute;
top: 0;
bottom: 0;
transition: .8s !important;
opacity: 0;
/*left:-100%;*/
transform: rotate(-5deg);
}
.ceo-imgs p:first-child,
.ceo-imgs p.active {
visibility: visible;
opacity: 1;
/*left:0%;*/
transform: rotate(0deg);*/
}
.ceo-col-sp{
display:none;
width:94%;
margin:0 auto;
text-align:center;
}
.ceo-sp{
margin-bottom:60px;
text-align:left;
}
.ceo-sp:last-child {
margin-bottom:0px;
}
.ceo-img-sp{
margin-bottom:25px;
width:100%;
margin-left:auto;
margin-right:auto;
text-align:center;
}
.ceo-sp h2 { 
font-size: 2.6rem;
margin-bottom:30px;
color:#fff;
}
.ceo-sp h3 { 
font-size: 2rem;
margin-bottom:15px;
color:#fff;
}
.ceo-sp p {
font-size:1.8rem;
margin-bottom:15px;
font-weight:bold;
color:#fff;
}
.ceo-sp span {
display:block;
font-size:1.4rem;
line-height:170%;
text-align: justify;
text-justify: inter-ideograph;
				color:#fff;
				overflow-wrap: break-word;
word-break: break-all;
}
.ceo-sp strong {
margin-top:50px;
display:block;
text-align: right;
}
@media (width <= 768px) {
#ceo-wrap{
padding-top:80px;
padding-bottom:70px;
}
.ceo-container {
display:none;
}
.ceo-col-sp{
display:block;
}
}


#history-wrap{
width:100%;
margin:0 auto;
text-align:center;
background-color:#f5f4f4;
padding-top:220px;
}
.history-container{
width:100%;
margin:0 auto;
text-align:center;
}
.history-container img{
max-width:100%;
height:auto;
}
.history-container>h3{
margin-bottom:100px;
position:relative;
}
.history-container>h3::before{
content: "";
width: 53px;
height: 1px;
display: block;
position: absolute;
bottom: -25px;
left: 48%;
margin: auto;
background-color: #c3abab;
margin:0 auto;
text-align:center;
}
.history-container>h3 p{
font-size:5rem;
line-height:100%;
letter-spacing: .15rem;
margin-bottom:30px;
}
.history-container>h3 span{
display:block;
font-size:1.6rem;
line-height:100%;
letter-spacing: .15rem;
}
.history-row{
padding-bottom:200px;
}


.side-scroll {
height: 65vh;
width: 100%;
z-index:0;
}
.side-scroll-container {
  align-items: center;
  display: flex;
  height: 65vh;
  margin-inline: auto;
  overflow: hidden;
  width: 100%;
/*border-top:1px solid #c3abab;*/
background-repeat:repeat-x;
background-position:top 12px center;
background-image:url(../img/line_ristory.png);
}
/*safari*/
_::-webkit-full-page-media, _:future, :root .side-scroll-container {
background-position:top 20px center;
}
/*Firefox*/
@-moz-document url-prefix() {
    .side-scroll-container {
        background-position:top 25px center;
    }
}
.side-scroll-list {
/*margin-left:15%;*/
padding-left: 10%;   /* ←これに置き換え */
padding-right: 15%;
display: flex;
gap: 6vw;
}
.side-scroll-item{
width:330px;
margin:0 auto;
text-align:center;
position:relative;
}
.side-scroll-item::before{
content: "";
position:absolute;
margin:0 auto;
text-align:center;
width:19px;
height:19px;
border-radius:100px;
top:1%;
left:47%;
background-color:#c3abab;
}
.side-scroll-item>h4{
font-size:3.4rem;
line-height:100%;
color:#c3abab;
margin-bottom:60px;
margin-top:80px;
}

.side-scroll-item>p{
font-size:1.5rem;
height:10em;
overflow-wrap: break-word;
word-break: break-all;
}
.side-scroll-item>span{
display:block;
width:100%;
margin:0 auto;
text-align:center;
}
@media screen and (min-width: 769px) and (max-width: 1024px){
.side-scroll-container {
height: 100vh;
background-image:none;
}
.side-scroll-item::after{
content: "";
position:absolute;
margin:0 auto;
text-align:center;
width:100%;
height:1px;
top:-5%;
left:0%;
background-color:#c3abab;
}
.side-scroll {
height: 100vh;
}
.side-scroll-item::before{
top:-38px;
}
}
@media (max-width: 768px) {
.history-container>h3::before{
left: 43%;
}
.history-container>h3 p{
font-size:3rem;
line-height:150%;
}
.side-scroll-container {
height: 100vh;
background-image:none;
}
.side-scroll-item::after{
content: "";
position:absolute;
margin:0 auto;
text-align:center;
width:100%;
height:1px;
top:-18%;
left:0%;
background-color:#c3abab;
}
.side-scroll {
height: 100vh;
}
.side-scroll-list {
margin-left:0%;
gap: 0;
}
.side-scroll-item::before{
top:-80px;
left:47%;
}
.side-scroll-item>h4{
font-size:2.8rem;
margin-top:-30px;
}
.side-scroll-item>p{
font-size:1.4rem;
}
}
			


.reverse{
overflow:hidden;
width:100%;
line-height:0;
}

.reverse-track{
  display: inline-flex;   /* ← ここが重要：内容幅に縮む */
  flex-wrap: nowrap;
  will-change: transform;
animation: marquee 60s linear infinite;
  animation-play-state: paused;
}

.reverse-inner{
  display:flex;
  flex-wrap: nowrap;
line-height:0;
}

.slider__item{
  flex:0 0 auto;
line-height:0;
}

.slider__item img{
  display:block;
  height:auto;
}

/* 右→左に流したいなら 0 → -50% が基本で安定 */
@keyframes marquee{
  from { transform: translate3d(-50%,0,0); }
  to   { transform: translate3d(0,0,0); }
}
.reverse-track.is-rev{
  animation-name: marquee-rev;
}
/* JSでクラス付けたら動かす */
.reverse-track.is-ready{
  animation-play-state: running;
}


			
			
#movie-wrap{
width:100%;
margin:0 auto;
text-align:center;
background-repeat:repeat;
background-position:top center;
background-image:url(../img/bg_content_red.jpg);
padding-top:220px;
padding-bottom:220px;
}
.movie-container{
width:100%;
margin:0 auto;
text-align:center;
}
.movie-container img{
max-width:100%;
height:auto;
}
.movie-container>h3{
margin-bottom:100px;
position:relative;
}
.movie-container>h3::before{
content: "";
width: 53px;
height: 1px;
display: block;
position: absolute;
bottom: -25px;
left: 48%;
margin: auto;
background-color: #fff;
margin:0 auto;
text-align:center;
}
.movie-container>h3 p{
font-size:5rem;
line-height:100%;
letter-spacing: .15rem;
margin-bottom:30px;
color: #fff;
}
.movie-container>h3 span{
display:block;
font-size:1.6rem;
line-height:100%;
letter-spacing: .15rem;
color: #fff;
}
.movie-row{
width:94%;
background-color:#fff;
margin:0 auto;
text-align:center;
}
.movie-row>video{
width:100%;
display:block;
line-height:0;
}
@media (max-width: 768px) {
.movie-container>h3::before{
left: 43%;
}
.movie-container>h3 p{
font-size:4rem;
line-height:150%;
}
}

#concept-wrap{
width:100%;
margin:0 auto;
text-align:center;
position:relative;
background-color:#222;
background-repeat:no-repeat;
background-position:right bottom;
background-image:url(../img/bg_content_black.jpg);
}
.concept-container{
width:100%;
margin:0 auto;
text-align:center;
padding-top:200px;
padding-bottom:200px;
}
.concept-container img{
max-width:100%;
height:auto;
}
.concept-row{
width:90%;
margin:0 auto;
text-align:center;
}
.concept-col{
text-align:left;
}
.concept-col>h3{
margin-bottom:70px;
}
.concept-col>h3 p{
line-height:100%;
color:#fff;
font-size:10rem;
font-weight:bold;
letter-spacing: .15rem;
}
.concept-col>h3 p:nth-child(1){
margin-bottom:40px;
}
.concept-col>p{
line-height:300%;
color:#fff;
font-size:2rem;
font-weight:bold;
text-align: justify;
letter-spacing: .15rem;
}
@media (max-width: 768px) {
.concept-container{
padding-top:100px;
padding-bottom:100px;
}
.concept-row{
width:94%;
}
.concept-col>h3{
margin-bottom:50px;
}
.concept-col>h3 p{
line-height:150%;
font-size:3.5rem;
}
.concept-col>h3 p:nth-child(1){
margin-bottom:0px;
}
.concept-col>p{
line-height:200%;
font-size:1.6rem;
}
}


.loop-text {
  position: relative;
  z-index: 20;
}
.loop-text .text_deg {
    position: absolute;
    left: 0%;
    top: -100px;
    z-index: 50;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
overflow: hidden;
 /*-webkit-transform: rotate(4deg);
            transform: rotate(4deg);
    -webkit-box-sizing: border-box;
            box-sizing: border-box; */
}
.loop-text .text_deg p {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-animation: loop-slide 30s infinite linear 1s both;
				animation: loop-slide 30s infinite linear 1s both;
				animation-direction: reverse;
}
.loop-text .text_deg.-rev p {
  /*animation-direction: reverse;*/
}
@keyframes loop-slide {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}





.section-mask{
min-height: 100vh;  /* height固定ではなくmin-height */
position: relative;
z-index: 0;
}
.sc{
overflow: hidden;
}
.sc:nth-child(even){
  background: #fff;
}
/************************/

/*******GSAPマスク*******/
.door-wrap {
	position: relative;
	height: 100vh;
	width:100%;
	z-index: 1;
}
.door-mask{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: 10;
	overflow: hidden;
	z-index: 1;
}
.door-mask img.mask{
width: 100%;
height: 100%;
object-fit: cover;
}
.content-mask {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
	width: 100%;
}

.inner-mask{
position: relative;
height:100vh;
width:100%;
}
.inner-mask img{
height:100vh;
width:100%;
object-fit: cover;
transform: scale(0.3);
}
.inner-mask-text{
height:100vh;
width:100%;
display: flex;
justify-content: center;
align-items: center;
}
.inner-mask p{
  opacity: 0; /* 初期状態で非表示 */
 transform: translateX(0px);  /*初期状態で下に50px移動 */
  position: absolute;
  width: 100%;
 top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
  z-index: 50;
 /*font-size: clamp(0.9rem, 1.5vw, 0.8rem);*/
 /* text-align: justify;*/
  line-height: 160%;
color: #fff;
margin:0 auto;
text-align:center;
letter-spacing: .2rem;
}
.inner-mask p>strong {
display:block;
font-size: clamp(2rem, 2.2vw, 4rem);
text-align:center;
letter-spacing:0.7rem;
}
@media (width <= 768px) {
.inner-mask p{
/*width: 100%;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);*/
letter-spacing: .0rem;
}
.inner-mask p>strong {
width: 100%;
margin:0 auto;
letter-spacing:0.7rem;
}
}
			


/****foota****/
#footer{
width:100%;
margin-top:-1px;
margin-left:auto;
margin-right:auto;
text-align:center;
overflow:hidden;
zoom:1;
}
#footer a:hover{
transition: 0.3s ease;
opacity:0.7;
}
#footer-bnr{
width:100%;
margin:0 auto;
text-align:center;
overflow:hidden;
zoom:1;
}
#footer-bnr>ul li{
width:50%;
float:left;
}
#footer-bnr>ul li:nth-child(1){
background-image:url(https://www.shinei-g.co.jp/wp-content/themes/custom/images/bg_foota_recruit.jpg);
background-repeat:no-repeat;
background-position:center top;
background-size: cover;
}
#footer-bnr>ul li:nth-child(2){
background-image:url(https://www.shinei-g.co.jp/wp-content/themes/custom/images/bg_foota_contact.jpg);
background-repeat:no-repeat;
background-position:center top;
background-size: cover;
}
#footer-bnr>ul li a{
display:block;
text-decoration:none;
color:#fff;
transition: 0.3s ease;
}
#footer-bnr>ul li a:hover{
transition: 0.3s ease;
transition-duration: 0.3s;
transform: scale(1.2);
}

#footer-bnr .menu-name>p{
width:300px;
padding-top:220px;
padding-bottom:200px;
margin:0 auto;
text-align:center;
color:#fff;
}
#footer-bnr .menu-name>p .en{
display:block;
font-size:40px;
font-weight:bold;
margin-bottom:20px;
line-height:100%;
}
#footer-bnr .menu-name>p .jp{
display:block;
font-size:20px;
line-height:100%;
font-weight:bold;
}
#footer-menu{
width:100%;
margin:0 auto;
text-align:center;
background-image:url(https://www.shinei-g.co.jp/wp-content/themes/custom/images/bg_foota.png);
background-repeat:no-repeat;
background-position:center top;
background-color:#222;
}
#footer-inner{
width:1200px;
margin:0 auto;
text-align:center;
padding-top:100px;
padding-bottom:100px;
overflow:hidden;
zoom:1;
}
.footer-border{
border-bottom:1px solid #999;
padding-bottom:50px;
margin-bottom:50px;
overflow:hidden;
zoom:1;
}
.footer-left{
width:260px;
float:left;
}
.footer-right{
width:550px;
float:right;
}
.footer-logo .logo{
width:100%;
margin-bottom:20px;
margin-left:auto;
margin-right:auto;
text-align:center;
}
.footer-logo .logo img{
width:180px;
height:auto;
}
.footer-logo .info{
margin:0 auto;
text-align:center;
}
.footer-logo .info>p{
color:#fff;
line-height:100%;
font-size:14px;
margin-bottom:15px;
}
.footer-logo .info>p:last-child{
margin-bottom:0px;
}
.footer-global-navigation{
overflow:hidden;
zoom:1;
}
.footer-global-navigation>ul li{
float:left;
/*padding-right:280px;*/
padding-bottom:30px;
}
.footer-global-navigation>ul li:nth-child(1),
.footer-global-navigation>ul li:nth-child(3),
.footer-global-navigation>ul li:nth-child(5),
.footer-global-navigation>ul li:nth-child(7){
width:360px;
}
.footer-global-navigation>ul li:nth-child(2),
.footer-global-navigation>ul li:nth-child(4),
.footer-global-navigation>ul li:nth-child(6){
width:170px;
}
.footer-global-navigation>ul li:nth-child(2n){
/*padding-right:0px;*/
}
.footer-global-navigation>ul li:nth-child(5){
/*padding-right:270px;*/
}
.footer-global-navigation>ul li:nth-child(7),
.footer-global-navigation>ul li:nth-child(8){
padding-bottom:0px;
}
.footer-global-navigation>ul li a{
display:block;
text-decoration:none;
background-image:url(https://www.shinei-g.co.jp/wp-content/themes/custom/images/arrow_foota_link.png);
background-repeat:no-repeat;
background-position:left 4px;
text-align:left;
padding-left:30px;
}
.footer-global-navigation .en-text{
font-size:16px;
line-height:100%;
margin-bottom:8px;
color:#fff;
}
.footer-global-navigation .jp-text{
font-size:14px;
line-height:100%;
color:#999;
}
.footer-affiliated{
overflow:hidden;
zoom:1;
clear:both;
margin-bottom:50px;
}
.footer-affiliated-left{
width:730px;
float:left;
}
.footer-affiliated-right{
width:420px;
float:right;
}
.footer-affiliated .affiliated{
text-align:left;
overflow:hidden;
zoom:1;
}
.footer-affiliated .affiliated>p{
font-size:16px;
line-height:100%;
margin-bottom:25px;
color:#fff;
}
.footer-affiliated .affiliated>ul li{
float:left;
padding-right:40px;
padding-bottom:20px;
}
.footer-affiliated .affiliated>ul li:nth-child(1){
padding-right:47px;
}
.footer-affiliated .affiliated>ul li:nth-child(4){
padding-right:60px;
}
.footer-affiliated .affiliated>ul li:nth-child(5){
padding-right:109px;
}
.footer-affiliated .affiliated>ul li:nth-child(3n){
padding-right:0px;
}
.footer-affiliated .affiliated>ul li:nth-child(4),
.footer-affiliated .affiliated>ul li:nth-child(5),
.footer-affiliated .affiliated>ul li:nth-child(6){
padding-bottom:0px;
}
.footer-affiliated .affiliated>ul li a{
display:block;
text-decoration:none;
background-image:url(https://www.shinei-g.co.jp/wp-content/themes/custom/images/arrow_foota_link.png);
background-repeat:no-repeat;
background-position:left center;
text-align:left;
padding-left:20px;
font-size:14px;
color:#fff;
}
.footer-affiliated .affiliated>ul li p{
text-align:left;
font-size:14px;
color:#fff;
}
.footer-affiliated .banner-flex{
display: -webkit-flex;
display: flex;
justify-content: space-between;
}
.footer-copyright{
width:100%;
margin:0 auto;
text-align:center;
}
.footer-copyright>p{
color:#fff;
font-size:14px;
}
/****foota****/


@media screen and (min-width: 769px) and (max-width: 1199px){
/****foota****/
#footer-inner{
width:1000px;
}
.footer-affiliated-left{
width:600px;
float:left;
}
.footer-affiliated-right{
width:400px;
float:right;
}
.footer-affiliated .affiliated>ul li{
padding-right:0px;
width:280px;
}
.footer-affiliated .affiliated>ul li:nth-child(1){
padding-right:0px;
}
.footer-affiliated .affiliated>ul li:nth-child(4){
padding-right:0px;
}
.footer-affiliated .affiliated>ul li:nth-child(2n){
padding-right:0px;
}
.footer-affiliated .affiliated>ul li:nth-child(5){
padding-right:0px;
}
.footer-affiliated .affiliated>ul li:nth-child(3n){
padding-right:0px;
}
.footer-affiliated .affiliated>ul li:nth-child(4),
.footer-affiliated .affiliated>ul li:nth-child(5),
.footer-affiliated .affiliated>ul li:nth-child(6){
padding-bottom:20px;
}
/****foota****/
}
@media screen and (min-width: 319px) and (max-width: 768px){
/****foota****/
#footer img{
max-width:100%;
height:auto;
}
#footer-bnr>ul li{
width:100%;
float:none;
margin:0 auto;
text-align:center;
}
#footer-bnr .menu-name>p{
width:100%;
padding-top:150px;
padding-bottom:100px;
}
#footer-inner{
width:96%;
padding-top:50px;
padding-bottom:50px;
}
.footer-left{
width:100%;
float:none;
margin-bottom:20px;
margin-left:auto;
margin-right:auto;
text-align:center;
}
.footer-right{
width:100%;
float:none;
margin-bottom:20px;
margin-left:auto;
margin-right:auto;
text-align:center;
}
.footer-global-navigation>ul li{
float:left;
padding-right:0px;
padding-bottom:30px;
}
.footer-global-navigation>ul li:nth-child(1),
.footer-global-navigation>ul li:nth-child(3),
.footer-global-navigation>ul li:nth-child(5),
.footer-global-navigation>ul li:nth-child(7){
width:50%;
}
.footer-global-navigation>ul li:nth-child(2),
.footer-global-navigation>ul li:nth-child(4),
.footer-global-navigation>ul li:nth-child(6){
width:50%;
}
.footer-global-navigation>ul li:nth-child(1){
padding-right:0px;
}
.footer-global-navigation>ul li:nth-child(5){
padding-right:0px;
}
.footer-affiliated-left{
width:100%;
float:none;
margin-bottom:20px;
margin-left:auto;
margin-right:auto;
text-align:center;
}
.footer-affiliated-right{
width:100%;
float:none;
margin-bottom:20px;
margin-left:auto;
margin-right:auto;
text-align:center;
}
.footer-affiliated .affiliated>ul li{
float:none;
padding-right:0px;
padding-bottom:20px;
}
.footer-affiliated .affiliated>ul li:nth-child(1){
padding-right:0px;
}
.footer-affiliated .affiliated>ul li:nth-child(4){
padding-right:0px;
}
.footer-affiliated .affiliated>ul li:nth-child(5){
padding-right:0px;
}
.footer-affiliated .affiliated>ul li:nth-child(4),
.footer-affiliated .affiliated>ul li:nth-child(5),
.footer-affiliated .affiliated>ul li:nth-child(6){
padding-bottom:20px;
}

/****foota****/
}