@import url('https://fonts.googleapis.com/css2?family=Anton&display=swap');
@font-face {
font-family: "degi";
  src: url("Dup/css/degi.otf") format("otf"),url("Dup/css/degi.woff") format("woff"),url("Dup/css/degi.woff2") format("woff2");
}



main.blur {
        background: rgb(4,217,217);
    background: linear-gradient(180deg, rgba(4,217,217,1) 0%, rgba(4,138,191,1) 70%, rgb(0 99 229) 97%, rgba(3,38,83,1) 100%);
}

#intro_wrap{
    position: relative;
}

#intro_wrap:after{
        content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    background-image: url(./Dup/img/light1.png);
    background-position: center;
    background-repeat: no-repeat;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%);
    background-size: cover;
    pointer-events: none;
    animation: pulse 18s ease-in-out infinite alternate-reverse;
    transform-origin: center top;
    z-index: -1;
}


#intro_wrap:before{
        content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0%;
    left: 50%;
    background-image: url(./Dup/img/en.png);
    background-position: center;
    background-repeat: no-repeat;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%);
    background-size: cover;
    pointer-events: none;
    animation: pulse 13s ease-in-out infinite alternate;
    transform-origin: center top;
        z-index: -1;
}

@keyframes pulse {
  from {
    -webkit-transform: translate(-50% , -50%) scaleY(1);
    transform: translate(-50% , -50%) scaleY(1);
    opacity: 0.7;
  }

  50% {
    -webkit-transform: translate(-50% , -50%) scaleY(1.5);
    transform: translate(-50% , -50%) scaleY(1.5);
    opacity: 1;
  }


70% {
    -webkit-transform: translate(-50% , -50%) scaleY(0.9);
    transform: translate(-50% , -50%) scaleY(0.9);
    opacity: 0.6;
  }

75% {
    -webkit-transform: translate(-50% , -50%) scaleY(1.2);
    transform: translate(-50% , -50%) scaleY(1.2);
    opacity: 1;
  }

  to {
    -webkit-transform: translate(-50% , -50%) scaleY(0.8);
    transform: translate(-50% , -50%) scaleY(0.8);
    opacity: 0.6;
  }
}


.dep{
        position: fixed;
    bottom: 10px;
    left: 40px;
    z-index: 999;
    color: white;
    font-size: 80px;
    font-family: degi;
    text-align: center;
    line-height: 1.2em;
}

#top_cms{
    position: relative;
}

#top_cms:before, .page_container:before{
        content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: calc(50% + 75px);
    left: 50%;
    background-image: url(./Dup/img/foot.png);
    background-position: center bottom;
    background-repeat: no-repeat;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%);
    background-size: 100%;
    pointer-events: none;
    z-index: -1;
}

#pc_nav li a, #footer_nav li a {
    position: relative;
    display: inline-block;
    text-decoration: none;
    color: white;
}

.slash {
    font-family: 'degi';
}

.slash2{
    font-size: 40px;
    color: #3b4183;
}

.bg_color3, .hvr_bg_color3:hover {
    background-color: #e7ef25;
}

#contents .con_title {
    margin-bottom: 5px;
        margin-bottom: 5px;
    color: white;
}

.sliceTxt1, .sliceTxt2{
    color: yellow;
}

#contents{
        background-image: url(./Dup/img/foot.png);
    background-attachment: fixed;
    background-position: center bottom;
    background-size: 100%;
    background-repeat: no-repeat;
}

header.scr_header {
    background-color: rgba(5, 5, 98, 0.6) !important;
}

#contents_wrap{
        padding-bottom: 250px;
    margin-bottom: 0;
}

.con_photo{
    position: relative;
}

.con_photo:before{
     content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    background-image: url(./Dup/img/fish1.png);
    background-position: center;
    background-repeat: no-repeat;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%);
    background-size: 60%;
    pointer-events: none;
    animation: move 20s ease-in-out infinite;
}

@keyframes move {
  from {
    left: 200%;
  }

  to {
    left: -200%;
  }
}

#wrap.pagemain.blur {
    background: rgb(4,217,217);
    background: linear-gradient(180deg, rgba(4,217,217,1) 0%, rgba(4,138,191,1) 46%, rgba(4,96,217,1) 85%, rgba(3,38,83,1) 100%);
}

.moji{
        position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
    color: white;
    font-size: 60px;
    font-family: 'Anton', sans-serif;
}

#logo a img{
    max-width: 180px;
}

.page_container{
    position: relative;
        padding-bottom: 500px;
}

.bubble {
  position: fixed;
  border-radius: 100%;
  border: 1px solid #fff;
  bottom: 1px;
  z-index: 9999;
}

.page_container:before{
    
}

.txt_color3, .hvr_txt_color3:hover {
    color: #f7f7f7;
}

p.con_txt{
    font-size: 40px;
    font-weight: bold;
}

.box_link{
        max-width: 300px;
    margin-top: 30px;
    padding-left: 15px;
}

.modal_title1 span.sliceTxt1, .modal_title1 span.sliceTxt2{
    color:black;
}

.linkStyle{
color: yellow;
font-weight: bold;
}

.tyu{
        margin: 150px auto;
    padding: 0 5%;
    position: relative;
    z-index: 1;
}

#page9 p a{
    color: black;
}

.links div a{
    text-align: center;
    padding: 70px 0;
    background-color: rgba(29, 26, 79, 0.7);
    font-size: 24px;
    color: white;
    display: block;
    transition: 0.3s;
}

.links div a:hover{
        transition: 0.3s;
    background-color: rgba(29, 26, 79, 0.2);
}

.pic0{
    background-image: url(./Dup/img/pic0.jpg);
    background-position: center;
    background-size: cover;
}

.pic1{
    background-image: url(./Dup/img/pic1.jpg);
    background-position: center;
    background-size: cover;
}

.pic2{
    background-image: url(./Dup/img/pic2.jpg);
    background-position: center;
    background-size: cover;
}

.pic3{
    background-image: url(./Dup/img/pic3.jpg);
    background-position: center;
    background-size: cover;
}

.flow_type3 .cate{counter-reset: box;}
.flow_type3 .cate_box{counter-increment: box;}
.flow_type3 .box_item{padding-top: 60px;}
.flow_type3 .box_title1{z-index: 0}
.flow_type3 .box_title1::before, .flow_type3 .box_title1::after{
	position: absolute;
	content: "";
	display: block;
	pointer-events: none
}
.flow_type3 .box_title1::before {
	content: "0"counter(box);
	font-size: 86px;
	    color: #31eef7;
	left: 0;
	top: -70px;
	z-index: -1;
}
.flow_type3 .box_title1::after{
	width: 100%;
	height: 1px;
	bottom: 0;
	left: 0;
	background-color: #222
}

.contact_tel a{
    color: black;
    text-align: center;
        padding: 20px 30px;
}

.fix_banner .more a:hover{
    color: black;
}

.fix_banner .more a:hover:before{
        background: #383838 !important;
}



/*--20230306 correct start--*/

.kesi{
    display: none;
}

#top_cms{
    display: none;
}

/*--20230306 correct end--*/


/*--20230322 correct start--*/

.banner a{
    margin: 10px;
}

/*--20230322 correct end--*/

/*--20230501 correct start--*/

.top_title h2 {
    font-size: clamp(2vw, (1rem + 4vw), 5vw);
}

#luxy{
    min-width: 1080px;
}

.hikari{
    height: 1000px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    overflow: hidden;
    opacity: 0.75;
    pointer-events: none;
}

.hikari:after{
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    background-image: url(./Dup/img/light1.png);
    background-position: top center;
    background-repeat: no-repeat;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%);
    background-size: contain;
    pointer-events: none;
    animation: pulse 18s ease-in-out infinite alternate-reverse;
    transform-origin: center top;
    z-index: -1;
}


.hikari:before{
        content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0%;
    left: 50%;
    background-image: url(./Dup/img/en.png);
    background-position: top center;
    background-repeat: no-repeat;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%);
    background-size: contain;
    pointer-events: none;
    animation: pulse 13s ease-in-out infinite alternate;
    transform-origin: center top;
    z-index: -1;
}

.con_box{
        position: relative;
    z-index: 1;
}

/*--20230501 correct end--*/

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){

#video {
    height: 65vh !important;
}

#video video {
    width: auto!important;
    height: 100%;
}

#contents .con_title {
    font-size: 60px;
}

.page_container {
    padding-bottom: 150px;
}

#luxy{
    min-width: 100%;
}

}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){

.moji {
    font-size: 30px;
}

.dep {
   font-size: 30px;
    bottom: 60px;
}

p.con_txt{
    font-size: 24px;
    font-weight: bold;
}

#contents .con_title {
    font-size: 48px;
}

footer {
    z-index: 1000;
}

header {
    z-index: 1001;
}

.flow_type3 .box_title1::before{
	left: auto;
	right: 0;
	top: -50px
}
.flow_type3 .box_item {
    padding-top: 36px;
}

.banner{
        margin-top: 100px;
    max-width: 100%;
}

.ip678 #video {
    height: 100vh;
}

.fix_banner {
    max-width: 100%;
}

.more_item::before {
    width: 17px;
}

.more_item {
    letter-spacing: 0.01em;
        padding: 6px 1px;
}

.more_item:hover::before {
    width: 17px;
    left: 5px;
}

}