html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent}

body{
  line-height:1}

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{
  display:block}

ul{
  list-style:none}

blockquote,q{
  quotes:none}

blockquote:before,blockquote:after,q:before,q:after{
  content:"";
  content:none}

a{
  margin:0;
  padding:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
  text-decoration:none;
  color:inherit}

ins{
  background-color:#ff9;
  color:#000;
  text-decoration:none}

mark{
  background-color:#ff9;
  color:#000;
  font-style:italic;
  font-weight:700}

del{
  text-decoration:line-through}

abbr[title],dfn[title]{
  border-bottom:1px dotted;
  cursor:help}

table{
  border-collapse:collapse;
  border-spacing:0}

hr{
  display:block;
  height:1px;
  border:0;
  border-top:1px solid #cccccc;
  margin:1em 0;
  padding:0}

input,select{
  vertical-align:middle}

input[type=submit],input[type=button]{
  border-radius:0;
  -webkit-box-sizing:content-box;
  -webkit-appearance:button;
  -moz-appearance:button;
  appearance:button;
  border:none;
  box-sizing:border-box}

input[type=submit]::-webkit-search-decoration,input[type=button]::-webkit-search-decoration{
  display:none}

input[type=submit]::focus,input[type=button]::focus{
  outline-offset:-2px}

.hamburger{
  display:none}

.hamburger.active span:nth-of-type(1){
  transform:translateY(1.35rem) rotate(45deg)}

.hamburger.active span:nth-of-type(2){
  opacity:0}

.hamburger.active span:nth-of-type(3){
  transform:translateY(-1.35rem) rotate(-45deg)}

@media screen and (max-width: 800px){
  .hamburger{
  display:block;
  z-index:109000;
  position:fixed;
  top:0;
  right:2rem;
  cursor:pointer;
  width:5rem;
  height:5.6rem}

}

@media screen and (max-width: 800px){
  .hamburger span{
  transition:all .5s;
  position:absolute;
  left:0;
  width:100%;
  height:.4rem;
  background-color:#fff;
  border-radius:4px}

.hamburger span:nth-child(1){
  top:25%}

.hamburger span:nth-of-type(2){
  top:50%}

.hamburger span:nth-of-type(3){
  top:75%}

}

.drawer-nav{
  width:200px;
  background-color:#fd624a;
  z-index:10000}

.drawer-menu{
  padding-top:120px}

.drawer--right .drawer-nav{
  right:-200px}

.drawer-menu-item{
  padding-left:40px;
  color:#fff!important;
  margin-bottom:10px;
  text-decoration:none!important}

.drawer-menu-item span{
  display:inline-block;
  font-size:1.6rem}

.drawer-menu-item span:after{
  transition:.2s;
  display:block;
  content:"";
  width:0%;
  height:2px;
  margin-top:2px;
  background-color:#000}

.drawer-menu-item span:hover{
  color:#000!important}

.drawer-menu-item span:hover:after{
  width:100%}

.drawer-overlay{
  z-index:9000}

.scrollLine{
  width:100vw;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  margin-top:200px;
  position:relative;
  overflow:hidden;
  z-index:1000000}

.scrollLine__text{
  font-size:2.4rem;
  margin-bottom:16px}

.scrollLine__lineBox{
  height:120px;
  width:1px;
  overflow:hidden}

.scrollLine__lineBox__line{
  height:100%;
  background-color:#000;
  animation:lineAnimation 2s infinite}

.scrollLine__bar{
  position:absolute;
  top:0;
  left:0;
  height:100%;
  width:0;
  max-width:100%;
  background-color:#fff;
  animation:slideup 1s;
  display:flex;
  align-items:center;
  justify-content:center}

.scrollLine__bar--black{
  background-color:#000}

.scrollLine__bar--lightGray{
  background-color:#fafafa}

@keyframes lineAnimation{
  0%{
  transform:translateY(0)}

to{
  transform:translateY(100%)}

}

@keyframes slideup{
  0%{
  height:0}

to{
  height:100vh}

}

.header{
  height:100%;
  min-height:800px;
  flex-direction:row;
  align-items:center;
  position:fixed;
  left:0;
  top:0;
  display:flex;
  background-color:#fff;
  z-index:1000000}

.header--black,.header--transparent{
  background-color:transparent}

@media screen and (max-width: 800px){
  .header{
  display:none}

}

.header__follow{
  height:1px;
  width:0px;
  animation:follow 1s;
  animation-fill-mode:forwards;
  animation-delay:.5s;
  background-color:#000;
  z-index:100;
  position:absolute;
  top:0;
  bottom:0;
  right:50px;
  margin:auto}

@media screen and (max-width: 480px){
  .header__follow{
  display:none}

}

.header__line{
  height:0;
  min-height:0;
  width:1px;
  background-color:#000;
  animation:lineanimation 1s;
  animation-delay:1.5s;
  animation-fill-mode:forwards}

.header__line--white{
  background-color:#fff}

.header__content{
  min-height:800px;
  width:100%;
  width:50px}

.header__content__top{
  width:100%;
  height:33vh;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  padding-top:80px}

.header__content__top__icon{
  width:100%;
  -o-object-fit:cover;
  object-fit:cover;
  opacity:0;
  animation-delay:2s;
  animation:bottom-text 1s;
  animation-fill-mode:forwards}

.header__content__middle{
  display:flex;
  flex-direction:row;
  justify-content:center;
  align-items:center;
  width:100%;
  height:22vh}

.header__content__middle__text{
  transform:rotate(90deg);
  white-space:nowrap;
  color:#fff;
  font-size:1.2rem;
  opacity:0;
  animation-delay:2s;
  animation:middle-text 1s;
  animation-fill-mode:forwards}

.header__content__bottom{
  display:flex;
  justify-content:center;
  width:100%;
  height:33vh}

.header__content__bottom__wrap{
  display:flex;
  align-items:center;
  writing-mode:vertical-rl}

.header__content__bottom__text{
  white-space:nowrap;
  color:#fff;
  font-size:1.2rem;
  opacity:0;
  animation-delay:2s;
  animation:middle-text 1s;
  animation-fill-mode:forwards}

.header__hamburger{
  width:24px;
  position:absolute;
  top:20px;
  left:calc((100% - 24px)/2);
  cursor:pointer}

.header__hamburger--sp{
  left:auto;
  position:fixed;
  right:16px;
  top:16px;
  z-index:100000;
  display:none;
  padding:16px}

@media screen and (max-width: 800px){
  .header__hamburger--sp{
  display:block}

}

.header__hamburger span{
  display:block;
  height:1px;
  background-color:#000;
  transition:.4s}

.header__hamburger span:nth-child(2){
  margin:4px 0}

.header__hamburger--white span{
  background-color:#fff}

.header__hamburger.active span:nth-of-type(1){
  transform:translateY(5px) rotate(35deg)}

.header__hamburger.active span:nth-of-type(2){
  opacity:0}

.header__hamburger.active span:nth-of-type(3){
  transform:translateY(-5px) rotate(-35deg)}

.border-black{
  border-left:1px solid black}

.background-black{
  background-color:#000}

.background-white{
  background-color:#fff}

.text-black{
  color:#000}

@keyframes follow{
  0%{
  width:0px;
  right:300px}

50%{
  width:200px;
  right:80px}

to{
  width:0px;
  right:50px}

}

@keyframes lineanimation{
  0%{
  min-height:0%}

to{
  min-height:100%}

}

@keyframes bottom-text{
  0%{
  opacity:0}

88%{
  opacity:0}

to{
  opacity:1}

}

@keyframes middle-text{
  0%{
  opacity:0}

80%{
  opacity:0}

to{
  opacity:1}

}

.navigation{
  position:fixed;
  top:0;
  left:0;
  width:100vw;
  height:100vh;
  display:none;
  justify-content:center;
  align-items:center;
  z-index:100002;
  background-color:#fff}

.navigation__circleWrap{
  width:10vw;
  height:110vh;
  position:relative;
  pointer-events:none}

.navigation__circleWrap img{
  height:180%;
  min-width:198vh;
  position:absolute;
  left:-40%;
  top:-40%}

.navigation__subtitle{
  width:8vw;
  margin-right:5vw}

.navigation__nav{
  display:flex;
  margin-right:60px}

.navigation__nav__list{
  display:grid;
  grid-template-columns:repeat(2,max-content);
  grid-template-rows:repeat(4,max-content);
  grid-auto-flow:column;
  gap:60px}

.navigation__nav__list__item{
  transition:all .5s}

.navigation__nav__list__item:hover .navigation__nav__list__item__title,.navigation__nav__list__item:hover .navigation__nav__list__item__no{
  color:#fff;
  transform:scale(1.1);
  text-shadow:#000 1px 1px 0px,#000 -1px 1px 0px,#000 1px -1px 0px,#000 -1px -1px 0px}

.navigation__nav__list__item:hover .navigation__nav__list__item__border{
  opacity:0}

.navigation__nav__list__item:last-child{
  margin-bottom:0}

.navigation__nav__list__item a{
  display:flex;
  align-items:center;
  color:#000;
  text-decoration:none}

.navigation__nav__list__item__no{
  font-size:2.4rem;
  line-height:1}

.navigation__nav__list__item__border{
  display:block;
  width:32px;
  height:1px;
  background-color:#000;
  margin:0 8px;
  overflow:hidden}

.navigation__nav__list__item__title{
  font-size:4rem;
  line-height:6rem;
  line-height:1;
  left:15%;
  transition:all .5s}

.sp_navigation{
  display:none;
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background-color:#fff;
  z-index:100000}

@media screen and (max-width: 800px){
  .sp_navigation{
  flex-direction:column;
  align-items:center}

}

.sp_navigation__top{
  width:100%;
  margin-top:32px}

.sp_navigation__title{
  width:50%;
  margin-top:16px;
  margin-bottom:0}

@media screen and (max-width: 480px){
  .sp_navigation__title{
  width:60%}

}

.sp_navigation__title img{
  width:100%}

.sp_navigation__nav{
  margin-top:16px}

.sp_navigation__nav__list__item{
  margin-bottom:20px}

.sp_navigation__nav__list__item a{
  display:flex;
  align-items:center;
  color:#000;
  text-decoration:none}

.sp_navigation__nav__list__item__no{
  font-size:1.2rem;
  line-height:1}

.sp_navigation__nav__list__item__border{
  display:block;
  width:32px;
  height:1px;
  background-color:#000;
  margin:0 16px}

.sp_navigation__nav__list__item__title{
  font-size:2.4rem;
  line-height:1}

.sp_navigation__bottom{
  display:flex;
  justify-content:center;
  margin-top:0}

.sp_navigation__bottom__icon{
  width:60px}

@keyframes zoomOut{
  0%{
  transform:scale(0)}

to{
  transform:scale(1)}

}

.animated-circle{
  animation:rotate 80s infinite linear}

@keyframes rotate{
  0%{
  transform:rotate(-360deg)}

to{
  transform:rotate(0)}

}

.imgAnimation__wrapper{
  overflow:hidden;
  position:relative;
  opacity:0}

.imgAnimation--animated{
  opacity:1}

.imgAnimation--animated:before{
  animation:img-wrap 2s cubic-bezier(.4,0,.2,1) forwards;
  background:#FFFFFF;
  bottom:0;
  content:"";
  left:0;
  pointer-events:none;
  position:absolute;
  right:0;
  top:0;
  z-index:1}

.imgAnimation--black:before{
  background:#000;
  bottom:0;
  content:"";
  left:0;
  position:absolute;
  right:0;
  top:0;
  z-index:1}

@keyframes img-wrap{
  to{
  transform:translateY(-100%)}

}

.magic-text span{
  opacity:0;
  transform:translateY(3.5px);
  transition:all .25s ease-out}

.magic-text span.is-visible{
  opacity:1;
  transform:translateY(0)}

.ml6{
  position:relative;
  font-weight:900}

.ml6 .text-wrapper{
  position:relative;
  display:inline-block;
  overflow:hidden}

.ml6 .letter{
  display:inline-block;
  font-size:7.2rem;
  letter-spacing:.6rem;
  height:7.2rem}

.textZoomIn{
  animation:zoomin .5s forwards}

.videofadeIn{
  animation:videoFadein 3s forwards}

.fadeIn{
  animation:fadein 1s forwards}

@keyframes videoFadein{
  0%{
  opacity:0}

to{
  opacity:.6}

}

@keyframes zoomin{
  0%{
  transform:scale(0)}

to{
  transform:scale(1);
  opacity:1}

}

.text-focus-in{
  animation:text-focus-in 1s cubic-bezier(.55,.085,.68,.53) both}

@keyframes text-focus-in{
  0%{
  filter:blur(12px);
  opacity:0}

to{
  filter:blur(0px);
  opacity:1}

}

.pages{
  width:80%;
  margin:0 auto;
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  position:relative;
  min-height:50px}

.pages a.page-numbers,.pages span.current{
  font-size:1.6rem;
  color:#fff;
  margin:0 6px}

.pages--black a.page-numbers,.pages--black span.current{
  font-size:1.6rem;
  color:#000;
  margin:0 6px}

.pages span.current{
  opacity:.38}

.prev img,.next img{
  width:30px}

.prev span,.next span{
  font-size:1.6rem;
  font-weight:700}

.prev{
  position:absolute;
  left:0}

.next{
  position:absolute;
  right:0}

.countLoading{
  position:fixed;
  top:0;
  left:0;
  width:100vw;
  height:100vh;
  margin:auto;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  pointer-events:none;
  animation:darkGrayChange 1s forwards 2s}

.countLoading__text{
  font-size:4rem;
  line-height:6rem;
  color:#fff;
  z-index:40}

@keyframes darkGrayChange{
  to{
  color:#171717}

}

.bgTitle{
  position:fixed;
  top:0;
  bottom:0;
  right:0;
  left:0;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:auto;
  font-size:14vw;
  pointer-events:none;
  animation:borderChange 2s forwards;
  text-shadow:#171717 1px 1px 0px,#171717 -1px 1px 0px,#171717 1px -1px 0px,#171717 -1px -1px 0px;
  color:#000}

.bgTitle-white{
  position:fixed;
  top:0;
  bottom:0;
  right:0;
  left:0;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:auto;
  font-size:14vw;
  pointer-events:none;
  animation:borderWhiteChange 2s forwards;
  text-shadow:#F5F5F5 1px 1px 0px,#F5F5F5 -1px 1px 0px,#F5F5F5 1px -1px 0px,#F5F5F5 -1px -1px 0px;
  color:#fff}

.bgTitle-gray{
  position:fixed;
  top:50%;
  left:50%;
  font-size:14vw;
  transform:translate(-50%,-50%);
  background-color:#fafafa;
  pointer-events:none;
  animation:borderGrayChange 2s forwards;
  text-shadow:#FFFFFF 1px 1px 0px,#FFFFFF -1px 1px 0px,#FFFFFF 1px -1px 0px,#FFFFFF -1px -1px 0px;
  color:#fafafa}

.nextTitle{
  position:absolute;
  opacity:0;
  width:100vw;
  top:50%;
  left:50%;
  font-size:14vw;
  transform:translate(-50%,-50%);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  text-shadow:#F5F5F5 1px 1px 0px,#F5F5F5 -1px 1px 0px,#F5F5F5 1px -1px 0px,#F5F5F5 -1px -1px 0px}

.nextTitle-gray{
  position:absolute;
  opacity:0;
  width:100vw;
  top:50%;
  left:50%;
  font-size:14vw;
  transform:translate(-50%,-50%);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fafafa;
  text-shadow:#FFFFFF 1px 1px 0px,#FFFFFF -1px 1px 0px,#FFFFFF 1px -1px 0px,#FFFFFF -1px -1px 0px}

.nextTitle-black{
  position:absolute;
  opacity:0;
  width:100vw;
  top:50%;
  left:50%;
  font-size:14vw;
  transform:translate(-50%,-50%);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#000;
  text-shadow:#171717 1px 1px 0px,#171717 -1px 1px 0px,#171717 1px -1px 0px,#171717 -1px -1px 0px}

.mainContentsVisible{
  opacity:0;
  animation:fadein 1s forwards;
  animation-delay:2s}

@keyframes fadein{
  0%{
  opacity:0}

to{
  opacity:1}

}

@keyframes borderChange{
  to{
  color:#171717}

}

@keyframes borderWhiteChange{
  to{
  color:#f5f5f5}

}

@keyframes borderGrayChange{
  to{
  color:#fff}

}

.bg-white{
  background-color:#fff}

.bg-black{
  background-color:#000}

.font-black{
  color:#000}

.font-white{
  color:#fff}

@font-face{
  font-family:Futura;
  src:url(../font/futura_medium_bt.ttf) format("ttf")}

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,button,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{
  font-size:62.5%;
  font-family:Futura;
  line-height:2}

body{
  overflow-x:hidden}

div[aria-label],div[aria-label] span{
  font-size:100%}

.wpcf7-form-control-wrap{
  height:100%;
  width:100%}

.ajax-loader{
  display:none!important}

.wpcf7 form.invalid .wpcf7-response-output,.wpcf7 form.unaccepted .wpcf7-response-output,.wpcf7 form.sent .wpcf7-response-output{
  color:#fff;
  border:none;
  font-size:1.2rem;
  margin:0 auto;
  z-index:10}

.wpcf7-not-valid-tip{
  margin-left:48px;
  font-size:1.2rem!important}

.fadeInChar .letter{
  font-size:inherit;
  color:inherit;
  font-family:inherit;
  font-weight:inherit;
  font-style:inherit}

input:-webkit-autofill,input:focus:-webkit-autofill{
  box-shadow:0 0 0 100px #000 inset}

input:-webkit-autofill{
  -webkit-text-fill-color:#FFFFFF!important}

.disabled-a{
  pointer-events:none}

html{
  scroll-behavior:smooth}

body{
  overflow-x:hidden;
  width:100vw}

.top{
  height:670px;
  width:100%;
  overflow:hidden;
  position:relative}

.top__video{
  position:absolute;
  height:670px;
  width:100%;
  -o-object-fit:cover;
  object-fit:cover}

.top__circle{
  position:absolute;
  top:20%;
  left:50%;
  transform:translate(-50%,-50%);
  -webkit-transform:translate(-50%,-50%);
  -ms-transform:translate(-50%,-50%);
  pointer-events:none;
  overflow:hidden}

.top__circle img{
  height:1000px;
  min-width:1000px}

@media screen and (max-width: 480px){
  .top__circle{
  top:10%}

}

.top__subcircle{
  top:31%;
  width:100px;
  -o-object-fit:contain;
  object-fit:contain;
  position:absolute;
  margin:auto;
  left:0;
  right:0;
  transform:rotate(-90deg)}

@media screen and (max-width: 480px){
  .top__subcircle{
  top:37%;
  width:70px}

}

.top__logo{
  position:absolute;
  width:300px;
  left:0;
  right:0;
  top:-20%;
  bottom:0;
  margin:auto;
  -o-object-fit:contain;
  object-fit:contain}

@media screen and (max-width: 480px){
  .top__logo{
  width:260px}

}

.sp_mission{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  justify-content:center}

.sp_mission__body{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  width:calc(100vw - 50px)}

@media screen and (max-width: 800px){
  .sp_mission__body{
  width:100vw}

}

.sp_mission__body__contents{
  width:70%}

@media screen and (max-width: 480px){
  .sp_mission__body__contents{
  width:94%}

}

.sp_mission__body__contents__title{
  font-size:3.2rem;
  letter-spacing:0rem;
  margin:56px 0}

@media screen and (max-width: 480px){
  .sp_mission__body__contents__title{
  font-size:2.4rem}

}

.sp_mission__body__contents__text{
  font-size:1.6rem;
  letter-spacing:.02rem;
  font-weight:100}

@media screen and (max-width: 480px){
  .sp_mission__body__contents__text{
  font-size:1.2rem;
  letter-spacing:.02rem}

}

@media screen and (max-width: 480px){
  .sp_mission__body__contents__text{
  letter-spacing:0}

}

.sp_business{
  justify-content:center;
  display:flex;
  align-items:center;
  width:100vw;
  margin-top:120px;
  flex-direction:column;
  position:relative;
  overflow-x:hidden}

@media screen and (max-width: 480px){
  .sp_business{
  margin-top:80px}

}

.sp_business__title{
  font-size:4.8rem;
  letter-spacing:.6rem;
  font-weight:100}

.sp_business__circle1{
  position:absolute;
  height:40vw;
  width:40vw;
  color:#fff;
  z-index:-10;
  top:0%;
  left:-25%}

.sp_business__circle1 span{
  line-height:20px;
  letter-spacing:1rem;
  background-color:#000}

.sp_business__circle2{
  position:absolute;
  height:40vw;
  width:40vw;
  color:#fff;
  z-index:-10;
  top:50%;
  right:-25%}

.sp_business__circle2 span{
  line-height:20px;
  letter-spacing:1rem;
  background-color:#000}

.sp_business__circle3{
  position:absolute;
  height:40vw;
  width:40vw;
  color:#fff;
  z-index:-10;
  bottom:5%;
  left:-25%}

@media screen and (max-width: 480px){
  .sp_business__circle3{
  height:150px;
  width:150px}

}

.sp_business__circle3 span{
  line-height:20px;
  letter-spacing:1rem;
  background-color:#000}

.sp_business__body{
  width:100vw;
  display:flex;
  justify-content:center;
  align-items:flex-end;
  flex-direction:column}

@media screen and (max-width: 800px){
  .sp_business__body{
  align-items:center}

}

.sp_business__body__contents{
  width:100vw;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  overflow-y:hidden;
  overflow:hidden;
  margin-bottom:40px}

.sp_business__body__contents__item{
  width:400px;
  margin-top:64px}

@media screen and (max-width: 480px){
  .sp_business__body__contents__item{
  width:260px;
  margin-top:24px}

}

.sp_business__body__contents__item img{
  width:360px;
  margin-left:32px}

@media screen and (max-width: 480px){
  .sp_business__body__contents__item img{
  width:240px;
  margin-left:24px}

}

.sp_business__body__contents__item__no{
  font-size:80px;
  line-height:80px;
  margin-bottom:-24px}

@media screen and (max-width: 480px){
  .sp_business__body__contents__item__no{
  font-size:70px;
  line-height:70px;
  margin-bottom:-24px}

}

.sp_business__body__contents__item__title{
  width:360px;
  font-size:1.6rem;
  letter-spacing:.02rem}

@media screen and (max-width: 480px){
  .sp_business__body__contents__item__title{
  font-size:1.2rem;
  letter-spacing:.02rem}

}

@media screen and (max-width: 480px){
  .sp_business__body__contents__item__title{
  width:240px;
  margin-left:24px}

}

.sp_business__body__contents__item__description{
  width:360px}

@media screen and (max-width: 480px){
  .sp_business__body__contents__item__description{
  width:240px;
  margin-left:24px}

}

.wrapper-news{
  top:-10%;
  right:-650px;
  overflow:hidden;
  position:fixed}

@media screen and (max-width: 800px){
  .wrapper-news{
  right:-25%}

}

@media screen and (max-width: 480px){
  .wrapper-news{
  right:0;
  left:0;
  top:-75%}

}

.animated-circle-text-news text{
  font-family:sans-serif;
  font-size:12px;
  fill:#000}

.animated-circle-text-news text textPath{
  letter-spacing:1px;
  font-family:futura}

.sp_works{
  justify-content:center;
  display:flex;
  align-items:center;
  width:100vw;
  padding-top:40px;
  flex-direction:column;
  background-color:#000}

.sp_works__circle{
  height:300px;
  width:300px;
  left:0;
  top:0;
  bottom:0;
  margin:auto;
  display:flex;
  position:relative;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  right:0;
  top:auto;
  height:320px}

.sp_works__circle__title{
  transform-origin:center;
  font-weight:500;
  transform:rotate(0);
  font-size:4.8rem;
  letter-spacing:.6rem;
  color:#fff}

.sp_works__circle__text{
  position:absolute;
  font-size:44px;
  font-weight:100;
  left:auto;
  font-size:16px;
  top:-2%;
  color:#fff}

.sp_works__body{
  width:100vw;
  display:flex;
  justify-content:center;
  flex-direction:column;
  align-items:center;
  padding-bottom:40px}

.sp_works__body__title{
  transform-origin:center;
  font-weight:500;
  font-size:4.8rem;
  letter-spacing:.6rem;
  color:#fff}

.sp_works__body__contents{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  width:calc(100vw - 50px)}

@media screen and (max-width: 800px){
  .sp_works__body__contents{
  width:100vw}

}

.sp_works__body__contents__title{
  font-size:7.2rem;
  letter-spacing:.6rem;
  color:#000;
  margin-bottom:240px;
  font-weight:400;
  position:fixed;
  right:3%;
  top:50%;
  transform:rotate(-90deg)}

@media screen and (max-width: 800px){
  .sp_works__body__contents__title{
  right:-5%;
  margin-bottom:160px}

}

@media screen and (max-width: 480px){
  .sp_works__body__contents__title{
  position:relative;
  top:10%;
  right:0%;
  transform:rotate(0)}

}

.sp_works__body__contents__main{
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  justify-content:center;
  margin-top:16px}

.sp_works__body__contents__main__item{
  width:400px;
  margin:24px;
  display:flex;
  justify-content:center;
  align-items:flex-start;
  flex-direction:column}

@media screen and (max-width: 480px){
  .sp_works__body__contents__main__item{
  width:80vw}

}

.sp_works__body__contents__main__item img{
  -o-object-fit:cover;
  object-fit:cover;
  width:400px;
  height:300px}

@media screen and (max-width: 480px){
  .sp_works__body__contents__main__item img{
  width:80vw;
  height:60vw}

}

.sp_works__body__contents__main__item__thumbnail{
  height:220px;
  width:320px;
  -o-object-fit:contain;
  object-fit:contain}

.sp_works__body__contents__main__item__title{
  margin-top:16px;
  font-size:1.6rem;
  letter-spacing:.02rem;
  color:#fff;
  font-weight:700}

@media screen and (max-width: 480px){
  .sp_works__body__contents__main__item__title{
  font-size:1.2rem;
  letter-spacing:.02rem}

}

.sp_works__body__contents__main__item__text{
  font-size:1.2rem;
  margin-top:8px;
  color:#fff}

.sp_news{
  justify-content:center;
  display:flex;
  align-items:center;
  width:100vw;
  margin-top:40px;
  flex-direction:column}

.sp_news__body{
  width:100vw;
  display:flex;
  justify-content:center;
  align-items:flex-end;
  flex-direction:column}

@media screen and (max-width: 800px){
  .sp_news__body{
  align-items:center}

}

.sp_news__body__title{
  transform-origin:center;
  font-weight:500;
  font-size:4.8rem;
  letter-spacing:.6rem}

.sp_news__body__contents{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  width:calc(100vw - 50px)}

@media screen and (max-width: 800px){
  .sp_news__body__contents{
  width:100vw}

}

.sp_news__body__contents__title{
  font-size:7.2rem;
  letter-spacing:.6rem;
  color:#000;
  margin-bottom:240px;
  font-weight:400;
  position:fixed;
  right:3%;
  top:50%;
  transform:rotate(-90deg)}

@media screen and (max-width: 800px){
  .sp_news__body__contents__title{
  right:-5%;
  margin-bottom:160px}

}

@media screen and (max-width: 480px){
  .sp_news__body__contents__title{
  position:relative;
  top:10%;
  right:0%;
  transform:rotate(0)}

}

.sp_news__body__contents__main{
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  justify-content:center;
  margin-top:16px}

.sp_news__body__contents__main__item{
  width:400px;
  margin:24px;
  display:flex;
  justify-content:center;
  align-items:flex-start;
  flex-direction:column}

@media screen and (max-width: 480px){
  .sp_news__body__contents__main__item{
  width:80vw}

}

.sp_news__body__contents__main__item img{
  -o-object-fit:cover;
  object-fit:cover;
  width:400px;
  height:300px}

@media screen and (max-width: 480px){
  .sp_news__body__contents__main__item img{
  width:80vw;
  height:60vw}

}

.sp_news__body__contents__main__item__thumbnail{
  height:220px;
  width:320px;
  -o-object-fit:contain;
  object-fit:contain}

.sp_news__body__contents__main__item__title{
  margin-top:16px;
  font-size:1.6rem;
  letter-spacing:.02rem;
  font-weight:700}

@media screen and (max-width: 480px){
  .sp_news__body__contents__main__item__title{
  font-size:1.2rem;
  letter-spacing:.02rem}

}

.sp_news__body__contents__main__item__text{
  font-size:1.2rem;
  margin-top:8px}

.sp_member{
  justify-content:flex-end;
  display:flex;
  align-items:center;
  width:100vw;
  overflow:hidden;
  margin-top:80px;
  flex-direction:column}

.sp_member__body{
  display:flex;
  justify-content:center;
  align-items:center;
  flex-direction:column}

@media screen and (max-width: 800px){
  .sp_member__body{
  width:100vw;
  align-items:center}

}

.sp_member__body__title{
  transform-origin:center;
  font-weight:500;
  font-size:4.8rem;
  letter-spacing:.6rem;
  margin-bottom:24px}

.sp_member__body__cells{
  display:flex;
  flex-direction:row;
  align-items:flex-start;
  justify-content:center;
  margin-top:16px;
  margin-bottom:32px;
  width:80%;
  z-index:10}

@media screen and (max-width: 480px){
  .sp_member__body__cells{
  padding-right:0;
  flex-direction:column;
  align-items:flex-start}

}

.sp_member__body__cells__thumbnail{
  height:130px;
  min-width:130px;
  margin-right:40px}

@media screen and (max-width: 480px){
  .sp_member__body__cells__thumbnail{
  margin-right:0;
  width:80vw;
  height:80vw}

}

.sp_member__body__cells__titles{
  width:80%;
  padding-left:16px}

@media screen and (max-width: 480px){
  .sp_member__body__cells__titles{
  padding-left:0;
  width:100%}

}

.sp_member__body__cells__titles__post{
  color:#c4c4c4;
  font-size:16px;
  font-weight:500;
  margin-top:16px}

.sp_member__body__cells__titles__name{
  font-size:24px;
  font-weight:500}

.sp_member__body__cells__titles__text{
  font-size:1.2rem;
  margin-top:24px;
  font-weight:500}

.sp_product{
  justify-content:flex-end;
  display:flex;
  align-items:center;
  width:100vw;
  overflow:hidden}

.sp_product__body{
  width:100vw}

.sp_product__body__leftBox1{
  width:100vw;
  display:flex;
  justify-content:flex-start;
  margin-top:80px;
  margin-bottom:80px}

.sp_product__body__leftBox1__img{
  padding-left:20%}

.sp_product__body__rightBox2{
  width:100vw;
  display:flex;
  justify-content:flex-end;
  margin-bottom:80px}

.sp_product__body__rightBox2__img{
  padding-right:15%}

.sp_product__body__middle{
  width:100vw;
  display:flex;
  justify-content:space-between;
  align-items:flex-start}

@media screen and (max-width: 800px){
  .sp_product__body__middle{
  flex-direction:column}

}

.sp_product__body__middle__imgLeft{
  padding-left:15%}

@media screen and (max-width: 800px){
  .sp_product__body__middle__imgLeft{
  padding-left:0}

}

.sp_product__body__middle__imgRight{
  margin-top:200px;
  overflow:hidden}

@media screen and (max-width: 800px){
  .sp_product__body__middle__imgRight{
  margin-top:80px;
  padding-left:30%}

}

@media screen and (max-width: 480px){
  .sp_product__body__middle__imgRight{
  padding-left:10%}

}

.sp_product__body__bottom{
  width:100vw;
  display:flex;
  justify-content:flex-start}

@media screen and (max-width: 800px){
  .sp_product__body__bottom__img{
  margin-top:80px}

}

.sp_company{
  justify-content:flex-end;
  display:flex;
  align-items:center;
  width:100vw}

.sp_company__body{
  display:flex;
  flex-direction:column;
  align-items:center;
  padding-top:80px;
  width:100vw}

.sp_company__body__logo{
  width:350px;
  margin-bottom:64px}

@media screen and (max-width: 800px){
  .sp_company__body__logo{
  width:250px;
  margin-bottom:40px}

}

.sp_client{
  justify-content:flex-end;
  display:flex;
  align-items:center;
  width:100vw;
  margin-top:200px}

@media screen and (max-width: 800px){
  .sp_client{
  margin-top:80px}

}

.sp_client__body{
  width:calc(100vw - 50px);
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center}

@media screen and (max-width: 800px){
  .sp_client__body{
  width:100vw}

}

.sp_client__body__title{
  font-size:5.6rem;
  letter-spacing:.6rem;
  font-weight:400;
  padding-bottom:64px}

@media screen and (max-width: 480px){
  .sp_client__body__title{
  font-size:4.8rem;
  letter-spacing:.6rem;
  padding-bottom:40px}

}

.sp_client__body__box{
  display:flex;
  justify-content:center;
  flex-wrap:wrap}

.sp_client__body__box__companys{
  padding:0 16px;
  max-width:440px;
  width:100%}

.sp_client__body__box__companys__text{
  font-size:1.2rem;
  padding-bottom:8px}

.productImg{
  width:33vw;
  -o-object-fit:contain;
  object-fit:contain}

@media screen and (max-width: 800px){
  .productImg{
  width:300px}

}

@media screen and (max-width: 480px){
  .productImg{
  width:250px}

}

table,th,td{
  border-collapse:collapse;
  border-bottom:1px solid #ccc;
  line-height:1.5}

.tr{
  display:inline-block}

table.type06 th{
  width:150px;
  font-weight:700;
  vertical-align:top;
  background:#3f3f3f;
  color:#fff}

table.type06 td{
  width:350px;
  padding:16px 0;
  vertical-align:top;
  font-size:1.2rem}

@media screen and (max-width: 800px){
  table.type06 td{
  width:220px}

}

@media screen and (max-width: 480px){
  table.type06 td{
  width:40vw}

}

.sp_contact{
  display:flex;
  align-items:center;
  flex-direction:column;
  width:100vw;
  min-height:100vh;
  background-color:#000;
  overflow:hidden;
  box-sizing:border-box;
  padding-top:40px;
  padding-bottom:40px;
  margin-top:40px;
  position:relative}

.sp_contact__title{
  font-size:5.6rem;
  letter-spacing:.6rem;
  transform-origin:center;
  font-weight:500;
  color:#fff}

@media screen and (max-width: 800px){
  .sp_contact__title{
  font-size:5.6rem;
  letter-spacing:.6rem}

}

.sp_contact__body{
  display:flex;
  width:100vw;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  padding-top:40px}

.sp_contact__body__title{
  font-size:5.6rem;
  letter-spacing:.6rem;
  color:#fff}

@media screen and (max-width: 480px){
  .sp_contact__body__title{
  font-size:3.2rem;
  letter-spacing:0rem}

}

.sp_contact__body__cells{
  display:flex;
  align-items:flex-start;
  border-bottom:1px solid white;
  width:70vw;
  min-height:56px}

@media screen and (max-width: 480px){
  .sp_contact__body__cells{
  width:90vw}

}

.sp_contact__body__cells__title{
  font-size:1.6rem;
  letter-spacing:.02rem;
  font-weight:400;
  color:#fff;
  min-width:120px}

@media screen and (max-width: 480px){
  .sp_contact__body__cells__title{
  font-size:1.2rem;
  letter-spacing:.02rem}

}

@media screen and (max-width: 480px){
  .sp_contact__body__cells__title{
  min-width:90px;
  font-size:1.6rem;
  letter-spacing:.02rem}

}

.sp_contact__body__cells__text{
  border:none;
  margin-left:48px;
  background-color:#000;
  color:#fff;
  padding-bottom:24px;
  flex:1;
  resize:none;
  font-size:1.6rem;
  letter-spacing:.02rem}

.sp_contact__body__cells__text:focus{
  outline:none}

.sp_contact__body__submit{
  height:40px;
  width:120px;
  background-color:#000;
  color:#fff;
  border:1px solid #FFFFFF!important;
  margin:40px}

.sp_contact__body__submit:disabled{
  color:#fff6;
  background-color:transparent;
  border:1px solid rgba(255,255,255,.4)!important}

.sp_contact__footer{
  display:flex;
  justify-content:space-around;
  height:40px;
  width:100%;
  background-color:#000;
  z-index:1000}

.sp_contact__footer__title{
  font-size:1.6rem;
  letter-spacing:.02rem;
  color:#fff;
  text-align:center}

@media screen and (max-width: 480px){
  .sp_contact__footer__title{
  font-size:1.2rem;
  letter-spacing:.02rem}

}

.contactCheckboxWrap{
  margin-top:40px}

.c-checkbox{
  display:none!important}

.c-checkboxLabel{
  font-size:13px;
  letter-spacing:.2rem;
  line-height:1.5;
  text-align:left;
  display:block;
  position:relative;
  padding-left:35px;
  margin-bottom:20px;
  color:#fff;
  cursor:pointer;
  -webkit-user-select:none;
  -moz-user-select:none;
  -ms-user-select:none}

.c-checkboxLabel a{
  color:#fff;
  text-decoration:underline;
  font-size:13px;
  line-height:1.5}

.c-checkboxLabel:last-child{
  margin-bottom:0}

.c-checkboxLabel:before{
  content:"";
  display:block;
  width:20px;
  height:20px;
  border:1px solid #FFFFFF;
  position:absolute;
  left:0;
  top:0;
  opacity:.6;
  transition:all .12s,border-color .08s}

.c-checkbox:checked+label:before{
  width:10px;
  top:-5px;
  left:5px;
  border-radius:0;
  opacity:1;
  border-top-color:transparent;
  border-left-color:transparent;
  transform:rotate(45deg)}


