﻿@import url('https://fonts.googleapis.com/css2?family=Zilla+Slab:ital,wght@1,400;1,600;1,700&display=swap');
.font1{
    font-family: 'Zilla Slab', serif;
    line-height: 1.3;
}



.sample_txt {
    z-index: 2;
    font-size: 2rem;
    text-shadow: 2px 2px 0 rgba(0,0,0,0.5);
    display: none;
}


/*--all page---------------------------
-------------------------------------*/

.font_14{
    font-size:17px;
}

.linkStyle{
    color:#0C1E7F;
    transition:all 0.3s;
    text-decoration:underline;
}
.linkStyle:hover{
    opacity:0.7;
}

body{
    overflow:hidden;
}

#header{
    top:0;
    left:0;
}
#header.scr_header #pc_nav .hd_contact span{
    color:#fff!important;
}
#pc_nav {
    margin-right: 25px;
}
#pc_nav .hd_contact{
    padding: 10px 20px;
    margin-left: 10px;
}

#page-top{
    font-size:14px;
}


/*--top page---------------------------
-------------------------------------*/
header span.before,header span.after{
    display:none;
}
.catch {
    top: 27%;
    left: 5%;
    z-index: 2;
}
.catch1 {
    width: min(45vw,1100px);
    margin-bottom: 50px;
    animation: flash .03s infinite;
}
.catch2{
    font-size:2rem;
    line-height:1.5;
}
.catch2 span{
    font-size:2.5rem;
}
@keyframes flicker {
  0%, 18%, 22%, 25%, 53%, 57%, 100% {
      text-shadow:
      0 0 4px #fff,
      0 0 11px #fff,
      0 0 19px #fff,
      0 0 40px #777,
      0 0 80px #777,
      0 0 90px #777,
      0 0 100px #777,
      0 0 150px #777;
  }
  20%, 24%, 55% {
      text-shadow: none;
  }
}

.message_video,.main_outer{
    background-image: url(./Dup/img/bg2.png),url(./Dup/img/bg1.png);
    background-repeat:no-repeat,no-repeat;
    background-position:right top,left bottom;
    background-size:1000px,1000px;
    background-color: #f6f6f6;
}
.message_video,.main_outer,#top_cms{
    background-image: url(./Dup/img/bg2.png);
    background-repeat:no-repeat;
    background-position:right top;
    background-size:1000px;
    background-color: #f6f6f6;
}

#con1_video{
    height:535px;/*videoの高さを想定*/
}
#con1_video .video/*video入れて不要なら削除する*/{
    width:100%!important;
    height:auto!important;
}

.more a:hover{
    animation: flash .03s infinite;
}
@keyframes flash {
  0% {
    opacity: 1;
  }
  100% {
    opacity: .8;
  }
}



.video_wrap {
    height: 550px;
}
video {
    z-index: 1;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

#top_contents1 h3::before{
    color: #FFC600;
}
#top_contents2 h3::before{
    color:#E900FF;
}
#top_contents1 div span.after{
    background-color: transparent;
    background: linear-gradient(90deg, rgba(12,30,127,1) 0%, rgba(233,0,255,1) 100%);
}
#top_contents2 div span.after{
    background-color: transparent;
    background: linear-gradient(90deg, rgba(44,211,225,1) 0%, rgba(12,30,127,1) 100%);
}

/*--under page---------------------------
-------------------------------------*/
.page .cms_box,
.page_box{
    padding:50px;
    background-color:#fff;
}

#page_title{
    margin-bottom:0;
}
.page main{
    padding-top:150px;
    padding-bottom:150px;
    margin-bottom:0;
    
}
#page_title h2{
    color:#fff;
}

/* ---------- responshive ---------- */
@media screen and (max-width: 1536px){

}


@media screen and (max-width: 1366px){

}


/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
.catch {
    top: 54%;
}
.catch1 {
    width: min(86vw,1100px);
}
#con1_video{
    height: 53vw;
}
.l-hdr-toggle__line{
    box-shadow: 2px 2px 0 #fff;    
}
.is-active .l-hdr-toggle__line--middle,
.is-active .l-hdr-toggle__line--close{
    box-shadow:none;
}
.l-menu__nav {
    border-top: 1px solid #fff;
}
.message_video, .main_outer, #top_cms{
    background-size: 600px;
}
#filter_white {
    padding: 150px 0px 100px;
}
}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
.font_14{
    font-size:15px;
}
.sample_txt{
    font-size:1rem;
}
.catch {
    top: 48%;
}
.catch1 {
    width: min(91vw,1100px);
}
.catch2 {
    font-size: 1.2rem;
    line-height: 1.7;
}
.catch2 span {
    font-size: 1.4rem;
}
#con1_video{
    height: 51vw;
}
.page .cms_box, .page_box {
    padding: 20px;
}

}




