*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  font-family: sans-serif;
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  -ms-overflow-style: scrollbar;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  background: #000;
  opacity: 0;
}
html.active { opacity: 1; }

@-ms-viewport {
  width: device-width;
}

article, aside, figcaption, figure, footer, header, hgroup, main, nav, section {
  display: block;
}

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, Noto Sans, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.7;
  color: #212529;
  text-align: left;
  background-color: #fff;
}

[tabindex="-1"]:focus {
  outline: 0 !important;
}

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
}

h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  margin-bottom: 0.5rem;
}

p {
  margin-top: 0;
  margin-bottom: 1rem;
}
p:last-child {
  margin-bottom: 0;
}

abbr[title],
abbr[data-original-title] {
  text-decoration: underline;
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted;
  cursor: help;
  border-bottom: 0;
}

address {
  margin-bottom: 1rem;
  font-style: normal;
  line-height: inherit;
}

ol,
ul,
dl {
  margin-top: 0;
  margin-bottom: 1rem;
}

ol ol,
ul ul,
ol ul,
ul ol {
  margin-bottom: 0;
}

dt {
  font-weight: 700;
}

dd {
  margin-bottom: .5rem;
  margin-left: 0;
}

blockquote {
  margin: 0 0 1rem;
}

b,
strong {
  font-weight: bolder;
}

small {
  font-size: 80%;
}

sub,
sup {
  position: relative;
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline;
}

sub {
  bottom: -.25em;
}

sup {
  top: -.5em;
}

a {
  color: #007bff;
  text-decoration: none;
  background-color: transparent;
}

a:hover {
  color: #0056b3;
  text-decoration: underline;
}

a:not([href]):not([tabindex]) {
  color: inherit;
  text-decoration: none;
}

a:not([href]):not([tabindex]):hover, a:not([href]):not([tabindex]):focus {
  color: inherit;
  text-decoration: none;
}

a:not([href]):not([tabindex]):focus {
  outline: 0;
}

pre,
code,
kbd,
samp {
  font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 1em;
}

pre {
  margin-top: 0;
  margin-bottom: 1rem;
  overflow: auto;
  -ms-overflow-style: scrollbar;
}

figure {
  margin: 0 0 1rem;
}

img {
  vertical-align: middle;
  border-style: none;
}

svg {
  overflow: hidden;
  vertical-align: middle;
}

table {
  border-collapse: collapse;
}

caption {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  color: #6c757d;
  text-align: left;
  caption-side: bottom;
}

th {
  text-align: inherit;
}

label {
  display: inline-block;
  margin-bottom: 0.5rem;
}

button {
  border-radius: 0;
}

button:focus {
  outline: 0px dotted;
  outline: 0px auto -webkit-focus-ring-color;
}

input,
button,
select,
optgroup,
textarea {
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

button,
input {
  overflow: visible;
}

button,
select {
  text-transform: none;
}

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  padding: 0;
  border-style: none;
}

input[type="radio"],
input[type="checkbox"] {
  box-sizing: border-box;
  padding: 0;
}

input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"] {
  -webkit-appearance: listbox;
}

textarea {
  overflow: auto;
  resize: vertical;
}

fieldset {
  min-width: 0;
  padding: 0;
  margin: 0;
  border: 0;
}

legend {
  display: block;
  width: 100%;
  max-width: 100%;
  padding: 0;
  margin-bottom: .5rem;
  font-size: 1.5rem;
  line-height: inherit;
  color: inherit;
  white-space: normal;
}

progress {
  vertical-align: baseline;
}

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

[type="search"] {
  outline-offset: -2px;
  -webkit-appearance: none;
}

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  font: inherit;
  -webkit-appearance: button;
}

output {
  display: inline-block;
}

summary {
  display: list-item;
  cursor: pointer;
}

template {
  display: none;
}

[hidden] {
  display: none !important;
}





video:focus{ outline:none;}




/**********ALL************/
html{
  font-size: 4.266vw;
  line-height: 1.7;;
}
body{
  font-size: 4.266vw;
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
  /*cursor: none;*/
}

body.en{ font-family: 'Lato', "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;}
/*
.cursor,
.follower {
  border-radius: 50%;
  position: absolute;
  left: 0; 
  cursor: none;
  posinter-events: none;
}
 
.cursor {
  width: 8px;
  height: 8px;
  background-color: #000;
  z-index: 10010;
}
 
.follower {
  width: 40px;
  height: 40px;
  background-color: #fdfe00;
  z-index: 10008;
}*/

img{ width: 100%; height: auto;}
.wrapper_inner{ padding: 15.6vw 0 17.6vw; position: relative; height: 100%;}
.title{ font-family: 'Lato', sans-serif; font-style: italic;}

.bold{ font-weight: bold;}
.big{ font-size: 1.2em;}
.pc{ display: none;}

.fadein {
  opacity : 0;
  transform : translate(0, 0);
  transition: 2s cubic-bezier(.9,0,.09,1);
}
.about_img .fadein {transform : translate(50px, 0px);}
.fadein.leftfadein {transform : translate(-50px, 0);}
.fadein.rightfadein {transform : translate(50px, 0);}
.fadein.scrollin {
  opacity : 1;
  transform : translate(0, 0);
}

/*.fadein { transform: translateX(0) translateZ(0); will-change: opacity, transform; animation: textOut cubic-bezier(.9,0,.09,1) 2s forwards; opacity: 1}*/
.fadein_transition-0 { animation-delay: 0s}
.fadein_transition-1 { animation-delay: .05s}
.fadein-transition-2 { animation-delay: .1s}
.fadein-transition-3 { animation-delay: .15s}
.fadein-transition-4 { animation-delay: .2s}
.fadein-transition-5 { animation-delay: .25s}
.fadein-transition-6 { animation-delay: .3s}

@keyframes textIn {
  0% { transform: translateY(40px) translateZ(0); opacity: 0 }
  to { transform: translateY(0) translateZ(0); opacity: 1}
}

@keyframes textOut {
  0% { transform: translateX(40px) translateZ(0); opacity: 0 }
  to { transform: translateX(0px) translateZ(0); opacity: 1}
}

@media screen and (min-width: 900px) {
  html{font-size: 1.1111111vw;}
  body{font-size: 1.1111111vw;}
  .sp{ display: none;}
  .pc{ display: block;}

  .wrapper_inner{ padding: 10.666vw 0; }
}


/**********HEADER************/
.main_header{ position: fixed; width: 100vw; top: 0; left: 0; padding: 2.4vw; line-height: 1; box-sizing: border-box; z-index: 10000;}
.main_header h1{ font-size: 1.8rem; color: #fff; letter-spacing: 0.1em; margin-bottom: 0; transition: 0.6s;}
.main_header a{ color: #fff;}

.mine_nav{ position: absolute; right: 0; top: 50%; }
.mine_nav .mine_navInner{ position: fixed; top: 0; left: 100%; background: #002a5a; height: 100vh; width: 100vw; display: block; transition: 0.7s cubic-bezier(.9,0,.09,1);}
.mine_nav .mine_navInner.active{ left: 0; }
.mine_nav .mine_navInner a{ font-size: 2.4rem; line-height: 1.4;}
.mine_nav .mine_navInner ul{ position: absolute; top: 10%; left: 5%; }
.mine_nav .mine_navInner ul li{ margin-bottom: 0rem;}
.mine_nav .mine_navInner ul li{ opacity : 0; transform : translate(50px, 0); transition: 1s cubic-bezier(.9,0,.09,1);}
.mine_nav .mine_navInner ul li:nth-child(2){transition-delay:0.1s;}
.mine_nav .mine_navInner ul li:nth-child(3){transition-delay:0.2s;}
.mine_nav .mine_navInner ul li:nth-child(4){transition-delay:0.3s;}
.mine_nav .mine_navInner ul li:nth-child(5){transition-delay:0.4s;}
.open_btn{}

.open_btn.active + .mine_navInner{ display: block; overflow: scroll;}

.mine_navInner.active ul li{ opacity : 1; transform : translate(0px, 0); list-style: none;}

.open_btn{display: block; width: 40px; height: 40px; position: absolute; top: 50%; right: 2.4vw; transform: translateY( -50% ); cursor: pointer;}
.open_btn > span{ content: ""; display: block; width: 28px;height: 3px;background: #fff; position: absolute; transition: 0.6s; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%);}
.open_btn:before,
.open_btn:after{ content: ""; display: block; width: 28px;height: 3px;background: #fff; position: absolute; transition: 0.6s; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%);}
.open_btn:before{ top: calc( 50% - 8px);}
.open_btn::after{ top: calc( 50% + 8px);}

.close_btn{display: block; width: 40px; height: 40px; position: absolute; top: 2.4vw; right: 2.4vw; cursor: pointer;}
.close_btn:before,
.close_btn:after{ content: ""; display: block; width: 3px;height: 28px;background: #fff; position: absolute;}
.close_btn:before{ top: 50%; left: 50%; transform: translateX( -50% ) translateY( -50% ) rotate(45deg);}
.close_btn:after{ top: 50%; left: 50%; transform: translateX( -50% ) translateY( -50% ) rotate(-45deg);}


.main_header.on h1 a{ color: #002a5a ;}
.main_header.on .open_btn > span,
.main_header.on .open_btn:before,
.main_header.on .open_btn:after{ background: #002a5a; }
.vjs-poster{ display: none; }

/*.language_btn { position: fixed; top: 1.8vh; left: auto; right: 32vw; line-height: 1;}*/
.language_btn {
  line-height: 1; display: block; position: absolute; top: 54%; padding-left: 40px; left: 5%;
  transform: translate(50px, 0); transition: 1s cubic-bezier(.9,0,.09,1);
  transition-delay: 0.5s;
  opacity: 0;
  top: calc( 7% + 2.4rem * 1.4 * 5 + 5%);
}


.mine_navInner.active .language_btn { transform: translate(0px, 0); opacity: 1; font-size: 1.5rem;color: #fff; }
.language_btn a,
.language_btn span{ color: #fff; display: inline-block; padding: 0.2em 0.4em 0.14em; border: none; font-weight: bold;}

.mine_nav .mine_navInner .language_btn a{ font-size: 1.5rem; }
.mine_nav .mine_navInner .language_btn span{ font-size: 1.5rem; }

.main_header.on + .language_btn a{ color: #002a5a; border: 1px solid #002a5a;}

@media screen and (min-width: 900px) {
  .main_header{ padding: 2.0833vw; }
  .main_header h1{ font-size: 2.5vw; color: #fff; letter-spacing: 0.1em; margin-bottom: 0;}
  .open_btn{ right: 2.0833vw;}

  .mine_nav .mine_navInner{ top: 0; left: 100%; height: 100vh; width: 32vw; display: block; z-index: 10;}
  .mine_nav .mine_navInner.active{ top: 0; left: 76%; height: 100vh; width: 24vw; }

  .close_btn{ width: 40px; height: 40px; top: 2.0833vw; right: 2.0833vw;}
  .close_btn:before,
  .close_btn:after{ width: 3px;height: 28px; }
  .mine_navInner .language_btn.sp{ display: none; }
  .language_btn { color: #fff; line-height: 1; display: block; position: absolute; top: 2.54vw; padding-left: 40px; left: auto; opacity: 1; right: calc( 120px + 2.0833vw);}
  .language_btn a{ color: #fff; display: inline-block; padding: 0.2em 0.1em 0.14em; border: none; font-size: 1.2vw;}
  .language_btn span{ color: #fff; display: inline-block; padding: 0.2em 0.1em 0.14em; border: none; font-size: 1.2vw;}

  .on .language_btn,
  .on .language_btn a,
  .on .language_btn span{ color: #002a5a ;}
}


/**********TOP_VISIAL************/
.all_wrapper{overflow: hidden;}
.wrapper{overflow: hidden;}
.TOP_VISIAL{
  width: 100%; height: 80vw;
  background: url(../img/main.jpg) center center / auto 100% no-repeat;
  background: url(../img/main.jpg) cover no-repeat;
  position: relative; font-size: 0; line-height: 0;
}
.mov_box{ position: absolute; top: 0; left: 0; width: 100%; height: 80vw; overflow: hidden; font-size: 0; line-height: 0;}
.mov_box video{ position: absolute; top: 0; left: 50%; width: auto; height: 80vw; transform: translateX( -50% ) translateY( 0% ); font-size: 0; line-height: 0;}
.mov_box:after{ content: ""; position: absolute; top: 0; left: 0; width: 100%;height: 80vw; background: rgba(0, 0, 0, 0);}
.play_btn{
  position: absolute; top: 50%; left: 50%;
  transform: translateX( -50% ) translateY( -50% );
  color: #fff;
  text-align: center;
  z-index: 100;;
}
.play_btn span{
  width: 50vw; height: 50vw; border: 2px solid #ffffff;
  display: block; border-radius: 50%; position: relative;
}

.play_btn span svg{
  position: absolute; top: 50%; left: 50%;
  transform: translateX( -40% ) translateY( -50% );
  width: 25%;
}

@media screen and (min-width: 900px) {
  .TOP_VISIAL{
    width: 100%; height: 56.25vw;
    background: url(../img/main.jpg) center center / auto 100% no-repeat;
    background: url(../img/main.jpg) cover no-repeat;
    position: relative;
  }
  .play_btn{ font-size: 1.7rem; margin-top: ; cursor: pointer; }
  .play_btn span { width: 13.88vw; height: 13.88vw; border: 2px solid #ffffff; margin-bottom: 0.8rem; position: relative; transition: 0.3s;}

  .play_btn span:before{
    content: "";
    width: 13.88vw; height: 13.88vw; border: 2px solid #ffffff;
    display: block; border-radius: 50%; position: absolute;
    position: absolute; top: 50%; left: 50%;
  transform: translateX( -50% ) translateY( -50% );
  }
  .play_btn:hover span:before{ animation: blink-btn 0.5s infinite;}
  .play_btn:hover span{ animation: blink-btn_case 0.5s infinite;}
  .play_btn:hover span svg{ opacity: 0.6;}

  .mov_box{ position: absolute; top: 0; left: 0; width: 100%; height: 56.25vw;}
  .mov_box .video-js .vjs-tech { position: absolute; top: 0; left: 50%; width: auto; height: 62.5vw; transform: translateX( -50% ) translateY( 0% );}
  /*.mov_box .video-js{ width: 100%; height: 100%;}*/
  .mov_box video{ position: absolute; top: 0; left: 0; width: auto; height: 56.25vw; transform: translateX( 0% ) translateY( 0% );}
  /*.mov_box:after{ content: ""; position: absolute; top: 0; left: 0; width: 100%;height: 62.5vw; background: rgba(0, 0, 0, 0.4);}*/

}

@keyframes blink-btn{
  0% { transform: translateX( -50% ) translateY( -50% ) scale(1); opacity: 0.8;}
  100% {  transform: translateX( -50% ) translateY( -50% )  scale(1.1); opacity: 0.1;}
}
@keyframes blink-btn_case{
  0% { opacity: 1;}
  100% { opacity: 0.9;}
}




/**********ABOUT************/
.about_visial{
  width: 100%; margin: 0 auto; position: relative; overflow: hidden; padding: 14vw 10vw 0;
  backface-visibility:hidden; -webkit-backface-visibility:hidden;
}
.about_visial .title{ font-size: 4rem; text-align: center; line-height: 1;}
.about_section01TitleBox{
  text-align: center; position: relative;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}
.about_visial .titleDeco{
  top: -6vw; left: 90vw;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  display: block;
}
.about_visial .titleDeco{ top: -6vw; left: 180vw; }
.about_visial figure{ position: relative; backface-visibility:hidden; -webkit-backface-visibility:hidden;}
.about_visial figure img{backface-visibility:hidden; -webkit-backface-visibility:hidden;}

.title{ color: #002a5a;}
.titleDeco{
  position: absolute;line-height: 1;
  font-size: 10rem; font-family: 'Lato', sans-serif; font-weight: bold;  font-style: italic;
  -webkit-text-stroke: 2px #002a5a;　text-stroke: 2px #002a5a; color: #ffffff;
  transform: translate3d(0, 0, 0);
  backface-visibility:hidden; -webkit-backface-visibility:hidden;
}

.about_section01 .titleDeco{  padding: 0 20px}
.about_SecondDeco{font-size: 6rem;}
.txtArea{ padding: 10.666vw 5.333vw;}

.about_moreAbout{ text-align: center; position: relative; height: 21vw;}
.about_moreAboutInner{ font-family: 'Lato', sans-serif; font-weight: 100; font-size: 1.4rem; position: relative; height: 100%;}
.about_moreAboutInner span{
  width: 1px; height: 10.666vw; background: #002a5a; display: block;
  position: absolute; top: auto; left: 50%; bottom: 0;
  transform: translateX( -50% ) translateY( 0% );
}
.about_moreAboutInner span:before{
  content: ""; display: block; width: 7vw; height: 7vw;
  border-right: 1px solid #002a5a; border-bottom: 1px solid #002a5a;
  position: absolute; top: 50%; left: 50%;
  transform: translateX( -50% ) translateY( -38% ) rotate(45deg);
}
.about_moreAbout:before,
.about_moreAbout:after{
  content: "" ; height:1px; width: 43vw; background: #002a5a; position: absolute; bottom: 1.2vw;
}
.about_moreAbout:before{ left: 0;}
.about_moreAbout:after{ right: 0;}

.about_SecondSection{ padding: 5.333vw ; margin: 10.666vw 0 0; position: relative;}
.about_SecondSection + .about_SecondSection{ margin: 5.333vw 0 0;}
.about_SecondSection:last-child{ padding: 5.333vw 5.333vw 0; }
.about_SecondTxtbox{ position: relative;}
.about_SecondTxtbox .title{ font-size: 2.8rem; line-height: 1; position: relative; z-index: 100; text-transform: uppercase;text-shadow: 2px 2px 0px #FFF, -2px -2px 0px #fff, -2px 2px 0px #fff, 2px -2px 0px #fff; margin: 0.6rem 0 0.4rem ;}
.about_SecondDeco{ top: -16vw; left: 70vw; line-height: 1; text-transform: uppercase;}

.about_section03 .about_SecondDeco{ line-height: 0.7; -webkit-text-stroke: 4px #002a5a;　text-stroke: 4px #002a5a;}
.about_section03 .about_SecondDeco span.sclAnime_LeftIn{ top: 0; right: 0; position: absolute;}
.about_section03 .about_SecondDeco span.sclAnime_LeftIn02{ top: 10.666vw; right: 0; position: absolute;}
.about_visial03 figure{ margin: 0;}

.about_SecondDecoInner{ -webkit-text-stroke: 0px #002a5a;　text-stroke: 0px #002a5a; color: #ffffff; position: absolute; top: 0; z-index: 80; display: block; left: 0;}
.about_section04 .about_SecondDeco{ font-size: 10rem; -webkit-text-stroke: 4px #002a5a; text-stroke: 4px #002a5a; left: 58vw; top: -29vw; padding: 0 20px}
.about_section04 .about_SecondDeco span{ display:  none;}
.about_section04 .about_SecondDeco span.active{ display: block; }

@media screen and (min-width: 900px) {

  .about_section{ text-align: center;}

  .about_visial{ width: 100%; margin: 0 auto; position: relative; overflow: hidden; padding: 0vw 0vw 0;}
  .about_visial figure{ width: 53.8vw; margin: 5.4vw auto 0;}
  .about_visial .title{ font-size: 7.2rem; text-align: center; line-height: 1; margin-top: 5.9vw;}
  .about_visial .titleDeco{ top: -3.0vw; left: 70vw; font-size: 20rem; display: block; }
  .about_visial figure{ position: relative;}
  /*.titleDeco{ font-size: 11rem; -webkit-text-stroke: 4px #002a5a;　text-stroke: 4px #002a5a; color: #ffffff; }*/
  .titleDeco{
    font-size: 11rem;
    filter:dropshadow(color=#002a5a,offX= 0,offY=-1)
    dropshadow(color=#002a5a,offX= 1,offY= 0)
    dropshadow(color=#002a5a,offX= 0,offY= 1)
    dropshadow(color=#002a5a,offX=-1,offY= 0);

    -webkit-text-stroke-color: #002a5a;
    -webkit-text-stroke-width: 4px;

    text-shadow: #002a5a 2px 2px 0px, #002a5a -2px 2px 0px,
    #002a5a 2px -2px 0px, #002a5a -2px -2px 0px;

    text-stroke: 4px #002a5a;

    color: #ffffff; }

  @media all and (-ms-high-contrast: none) {
    .titleDeco{
      text-shadow: #002a5a 2px 2px 0px, #002a5a -2px 2px 0px, #002a5a 2px -2px 0px, #002a5a -2px -2px 0px;
    }
  }
  .about_section01TitleBox p{ font-size: 1.875vw;}

  .about_moreAboutInner{ font-size: 2.5vw; }
  .about_moreAboutInner span{ width: 1px; height: 4.1666vw;}
  .about_moreAboutInner span:before{
    width: 3vw; height: 3vw;
    position: absolute; top: 50%; left: 50%;
    transform: translateX( -50% ) translateY( -50% ) rotate(45deg);
  }

  .about_moreAbout:before,
  .about_moreAbout:after{ height:1px; width: 46vw; bottom: 0.8vw; }

  .txtArea{ width: 40vw; padding: 0; text-align: left; display: inline-block; margin: 6.25vw 3.125vw;  font-size: 1.125rem; line-height: 2;}
  .txtArea p + p{ margin-top: 3.375vw;}
  .imgArea{ width: 24vw; display: inline-block; vertical-align: top; position: relative; margin: 3.5vw 3.125vw;}

  .about_img{  position: absolute;}
  .about_img01{ width: 67.3%; top: 5.2vw; left: 0;}
  .about_img02{ width: 22.222%; top: 0; right: 0;}
  .about_img03{ width: 37.14%; top: 14.23vw; right: 2.777vw;}
  .about_img04{ width: 47.62%; top: 21.7vw; right: 6.6vw;}

  .about_moreAbout { height: 9vw; margin-top: 2vw; }

  .about_visial02{ width: 50vw; display: inline-block; position: relative; z-index:0;}

  .about_SecondSection { padding: 13.88vw 5.333vw 0; margin: 0; position: relative;}
  .about_SecondSection .titleDeco {  -webkit-text-stroke: 2px #002a5a; text-stroke: 2px #002a5a;}
  .about_SecondTxtbox{ position: relative; display: inline-block; width: calc( 100vw - 50vw); vertical-align: top;}

  .about_section02 .about_SecondTxtbox{ width: calc( 100vw - 50vw - 13vw);  }
  .about_SecondTxtbox{font-size: 1.125rem;}
  .about_SecondTxtbox p{ line-height: 2;}

  .about_section03 .about_SecondDeco span.sclAnime_LeftIn{ top: 0; right: 0; position: absolute;}
  .about_section03 .about_SecondDeco span.sclAnime_LeftIn02{ top: 5.9vw; right: 0; position: absolute;}
  
  .about_SecondSection.about_section02 .titleDeco { top: -8vw; left: -10vw;}
  .about_SecondSection.about_section02 .titleDeco { top: -8vw; left: 30vw;}
  .about_SecondSection .title{ font-size: 5rem; text-align: center; text-shadow: 2px 2px 0px #FFF, -2px -2px 0px #fff, -2px 2px 0px #fff, 2px -2px 0px #fff; margin-bottom: 1rem;}
  .about_section02 .about_SecondTxtbox p{ padding-left: 2vw;}

  .about_visial03{ position: absolute; right: 0; width: 43.229vw;}
  .about_SecondSection.about_section03 .title { text-align: left;}

  .about_SecondSection.about_section03 .titleDeco{ -webkit-text-stroke: 4px #002a5a; text-stroke: 4px #002a5a; line-height: 0.5; left: 12vw; top: 8vw;}
  .about_SecondSection.about_section03 .about_SecondTxtbox{ padding-top: 16vw; margin-bottom: 2.9vw;}
  .about_SecondSection.about_section03 .about_SecondTxtbox p{ padding-left: 5vw;}

  .about_visial04{ width: 31.25vw; position: absolute; right: 0;}
  .about_visial04_1{ width: 19.02vw; position: absolute; left: 0; bottom: 5.2vw;}

  .about_section04 .about_SecondTxtbox{ padding-left: 24.69vw; box-sizing: content-box; width: calc( 100vw - 50vw - 5.333vw - 12vw); padding-top: 15vw; padding-bottom: 12.8vw;}
  .about_section04.about_SecondSection .title { text-align: left;}
  .about_section04 .about_SecondDeco{ font-size: 20rem; -webkit-text-stroke: 4px #002a5a; text-stroke: 4px #002a5a; left: 8vw; top: 2vw;}
  .about_section04 .about_SecondDeco span{ display:  none;}
  .about_section04 .about_SecondDeco span.active{ display: block; }
  
}





/**********WORK************/
.work{ background: #dee9f5;}

.work .title { font-size: 4rem; text-align: center; line-height: 1; margin: 0;}
.work_area{padding: 5.33vw 5.33vw 0;}
.work .work_area .title { font-size: 2rem; font-weight: 100; line-height: 1.4}
.work .work_area .title span{ font-size: 1rem; font-weight: 100; font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif; display: block;}
.work_area article{ padding: 5.33vw 0; border-top: 1px solid #002a5a;}
.work_area article:last-child{ padding: 5.33vw 0 0;}
.work_area article > div{ position: relative; margin-bottom: 5.33vw;}
.work_area article a > div{ position: relative; margin-bottom: 5.33vw; color: #002a5a;}
.work_area article figure{ margin: 0; font-family: 'Lato', sans-serif;}

.work_nv{
  position: absolute; top: 50%; left: 0%;
  transform: translateY( -50% );
}

.titleDeco.work_Deco{ bottom: 5.3vw; left: 31vw; transform: translate3d(0, 0, 0) rotate(90deg); padding:  20px 20px;}
article.otherLink .title{ background: url(../img/icon_otherLink_b.png) right 5px center / auto 2rem no-repeat;}
.otherLink
.comingsoon{}
article.otherLink.comingsoon .title{ background: none; position: relative; }
article.otherLink.comingsoon .title:after{ content: "coming soon"; font-size: 0.8em}

.work_area article.comingsoon figure{ position: relative; }
.work_area article.comingsoon figure:before{
  content: '' ; position: absolute; top: 0; left: 0; width: 100%; height: 100%;
  text-align: center; color: #fff; background: rgba(0, 0, 0, 0.8); font-family: 'Lato', sans-serif;
  z-index: 100;
}
.work_area article.comingsoon figure:after{
  content: 'Coming Soon' ; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  font-family: 'Lato', sans-serif; color: #fff; z-index: 101; font-size: 1.4rem; text-indent: initial;
  font-weight: 100; font-style: italic;
}

@media screen and (min-width: 900px) {

  .work_area article.comingsoon figure.work_thm,
  .work_thm{ position: absolute; top: 50%; right: 7%; display: none; width: 36vw; transform: translateY(-40%);}
  .work_area article.comingsoon:hover figure.work_thm,
  .work_area article:hover .work_thm{ display: block;}
  .work_area article:hover{ background: #598ac9; color: #fff;}
  .work_area article.otherLink:hover{ background: #fff; color: #002a5a;}
  .work_area article.otherLink:hover a{ color: #002a5a;}
  .work_area article:hover .title{ color: #fff; background: url(../img/icon_play_w.png) right 5px center / auto 100% no-repeat;}
  .work_area article.comingsoon:hover .title{background: none;}

  article.otherLink.comingsoon .title:after{ content: "coming soon"; font-size: 0.8em; margin-left: 0.75vw;}

  article.otherLink .title{ background: url(../img/icon_otherLink_b.png) right 20px center / auto 2rem no-repeat;}
  .work_area article.otherLink:hover .title{ color: #002a5a; background: url(../img/icon_otherLink_b.png) right 20px center / auto 100% no-repeat;}
  .work_area article.otherLink.comingsoon:hover .title{background: none;}
  /*article.otherLink.comingsoon:hover .title:after{font-size: 1em;}*/
  .work_area article.comingsoon:hover{ background: none; color: #002a5a;}

  .work .work_area .title span{ display: inline-block;}
  .work .title { font-size: 7.2rem; text-align: center; line-height: 1; margin-top: 0;}
  .work_area{ width: 43.75vw; box-sizing: content-box; z-index: 1000; }
  .work .work_area .title{ margin: 0; font-size: 1.875vw; font-weight: 100 ; text-align: left; padding-left: 5.333vw; display: inline-block; padding-right: 4.2vw;}
  .work_area article > div { margin-bottom: 0;}
  .work_area article a > div{  margin-bottom: 0;}
  .work_area article{ padding: 2.5vw 0; cursor: pointer;}
  .work_area article.comingsoon{ cursor: default; }
  .work_area article:last-child{ border-bottom: 1px solid #002a5a; padding: 2.5vw 0;}
  .work .titleDeco { font-size: 20rem; left: 56vw; bottom: -0vw; color: #dee9f5;}
  .work_nv { left: 2%;}
}

/**********company************/

.COMPANY .title { font-size: 4rem; text-align: center; line-height: 1; margin: 0 auto 2.666vw; width: 92vw;; padding-right: 0; background: none;}

.company_date{padding: 0 5.333vw; position: relative; background: url(../img/logo.png) top 0vw right 8.333vw / auto 14.666vw no-repeat;}
.company_date dl dt{ }
.company_date dl dd{ margin-bottom: 0.8em; }
.company_date dl dd + dt{ border-top: 1px solid #002a5a; padding-top: 0.8em;}
.map{ margin-top: 2.666vw;;}
.access_box + .access_box{ margin-top: 5.333vw;}

.titleDeco.company_Deco{ bottom: 0vw; left: 80vw;}
.titleDeco.company_Deco{ bottom: 0vw; left: 100vw;}

@media screen and (min-width: 900px) {
  .COMPANY .title { font-size: 7.2rem; text-align: left; line-height: 1; margin-top: 5.333vw; margin-left: 5.333vw; padding-right: 8vw; width: auto; display: inline-block;}
  .company_visial{ position: absolute; right: 0; top: 11.8vw; width: 43.055vw;}
  .company_date{ width: 65.625vw; box-sizing: content-box; background: url(../img/logo.png) top 0vw left 48vw / auto 7.8vw no-repeat}

  .company_date dl dd + dt { border-top: none; padding-top: 0em;}

  .company_date dl dt{ font-weight: 100; width: 12.5vw; display: inline-block; line-height: 1.9; margin-bottom: 3.125vw; }
  .company_date dl dd{ width: calc( 100% - 13vw ) ; display: inline-block;  vertical-align: top; line-height: 1.9; margin-bottom: 3.125vw;}
  .access_box{ display: inline-block; width: 49%; padding-right: 40px;}
  .access_box{ display: inline-block; width: 60%; padding-right: 40px;}

  .access_box + .access_box { margin-top: 0;}
  .COMPANY .titleDeco { font-size: 20rem; bottom: 0vw}

}


/**********RECRUIT************/
.RECRUIT{ background: url( ../img/recruit_visial.jpg) top left / cover ;}
.RECRUIT .wrapper_inner{ background: rgba( 255, 255, 255, 0.8); margin: 2.666vw; padding: 10.666vw 5.333vw;}

.RECRUIT .title { font-size: 4rem; text-align: center; line-height: 1; margin: 0 auto 2.666vw;}

ul.entry_job{ margin: 0; padding: 0;}
.entry_job li{ display: inline-block;}

.btn_box a{
  display: inline-block; line-height: 2; background: #fff; padding: 2.666vw 5.333vw; margin-top: 5.333vw;
  border: 2px solid #000; color: #000; font-size: 0.8rem; font-weight: bold; width: 100%; text-align: center;
}


@media screen and (min-width: 900px) {
  .RECRUIT .wrapper_inner { margin: 0 0 0 44.44vw; padding: 12vw;}
  .RECRUIT .title { font-size: 7.2rem; text-align: center; }
  .btn_box a { padding: 1rem;  margin-top: 3vw;}
}


/**********CONTACT************/

.CONTACT{ background: #002a5a; color: #fff;}
.CONTACT .title { font-size: 4rem; text-align: center; line-height: 1; margin: 0 auto 2.666vw; color: #fff;}
.CONTACT .wrapper_inner{ padding: 10.666vw 5.333vw;}


.contact_box h3{ font-style: italic; font-family: 'Lato', sans-serif; font-size: 0.8rem; margin: 0;;}
.contact_box p{ font-size: 1.7rem; font-family: 'Lato', sans-serif; font-weight: 100;}
.contact_box a{ color: #fff; }

@media screen and (min-width: 900px) {
  .CONTACT .title { font-size: 7.2rem; text-align: left; }
  .contact_boxInner{ display: inline-block; width: 58%; vertical-align: top;}
  .contact_boxInner + .contact_boxInner{ width: 40%;}
  .CONTACT .wrapper_inner{ padding: 5.333vw;}
  .contact_box h3 { font-size: 1.4rem;}
}

/**********FOOTER************/

.main_footer{ background: #002a5a; color: #fff; text-align: center; padding: 5.333vw; border-top: 2px solid #ffffff;}
.main_footer p{ margin: 0; font-size: 1.8rem; text-transform: uppercase; font-family: 'Lato', sans-serif; font-weight: 100;}

@media screen and (min-width: 900px) {
  .main_footer {padding: 0vw}
}

.company_visial .background{ overflow: hidden; position: relative;}
.company_visial .background > div.bgInner{ content: ""; display: block; background: url(../img/company_visial.jpg) center top / 100% auto; width: 140%; height: 160%; position: absolute; top: 0; left: -4vw;}
.company_visial .background img{ opacity: 0;}

.RECRUIT{ overflow: hidden; position: relative;}
.RECRUIT_background{ position: absolute; top: 0; left: 0; background: url(../img/recruit_visial.jpg) center top / 100% auto; width: 100%; height: 100%; }
.RECRUIT_background > div.bgInner{ position: absolute; top: 0; left: 0; background: url(../img/recruit_visial.jpg) left top / auto 100%; width: 120%; height: 110%; }

@media screen and (min-width: 900px) {
  .RECRUIT_background > div.bgInner{ position: absolute; top: 0; left: 0; background: url(../img/recruit_visial.jpg) center top / 100% auto; width: 120%; height: 110%; }
}


.video_modal{
  position: fixed; z-index: 10000;
  top: 0; left: 0; width: 100%; height: 100vh;
  background: rgba(0, 0, 0, 1);
  padding: 0 10.666vw; display: none;
}
.video_modal.active{ display: block}
.video_modal_box{
  width: 80vw; position: absolute;
  position: absolute; top: 50%; left: 50%;
  transform: translateX( -50% ) translateY( -50% );
}
.video_modal_box video{ width: 80vw ; height: auto;}

.Video_modalOver{
  position: fixed; z-index: 10000;
  top: 0; left: 0; width: 100%; height: 100vh;
}



.work_img{ width: 28vw; position: absolute; top: 50%; right: 12vw; transform: translateY(-30%);}

.youtubeBox iframe,
  iframe.youtubeBox{
    width: 177.777777778vh; height: 56.25vw; position: absolute; top: 0; left: 50%; transform: translateX(-50%) translateY(0);
    width: 142.2222vw; height: 80vw;
  }

.youtubeBoxs{ width: 100%; height: 0; padding-bottom: 56.25%; position: relative; }
.youtubeBoxs iframe{ position: absolute; width: 100%; height: 100%; top: 0; left: 0; }


@media screen and (min-width: 900px) {
  .youtubeBox{}
  .youtubeBox iframe,
  iframe.youtubeBox{ width: 100%; height: 56.25vw; }
}