﻿/*--------link_font--------*/
.linkStyle{color: #333333; text-decoration: underline;}

/*--------all_page--------*/
#logo{max-width: 100px;}
#header .h_box_mail a{background-color: #eb8286;}
#header .h_box_mail a:hover{    background-color: #fff;}
.main_title {
    width: 12%!important;
    opacity: 0.6;
}

.overlay.open {
    background-image: url(./Dup/img/back_01.png);
    background-repeat: no-repeat;
    background-position: 0% 40%;
    background-size: cover;
}
.overlay .menu-box .menu_list > li:not(:nth-of-type(11)) a {
    font-size: 1.15em;
}
.section{
    background-color: #f7f0f0;
    background-image: url(./Dup/img/back_01.png);
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
}
#s_content2 .c2_box_txt .d_flex {
    background-image: url(./Dup/img/back_01.png);
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: auto;
}
.modal_wrap .txt_white{color: #3c3c3c;}
.more_btn > span,.more_btn a {
    font-size: 1.2em;
}

#logo2 img{max-width: 135px;}
.cms_box .cms_box_bg {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 30%, #f3e2e2);
}

.contents_no {
    font-weight: bold;
}


/*--------subpage--------*/


/*--------mobile_tb--------*/
@media screen and (max-width: 768px){
    #loading.loading_top{position: fixed;}
    
.section {
    background-size: 350%;
}
    #s_content2 .c2_box_txt .d_flex {
    background-size: 233%;
}

}

/*--------mobile_sp--------*/
@media screen and (max-width: 667px){
    #logo {
    max-width: 65px;
}
#s_content1 .intro_img img{
    height: auto!important;
    width: 95%!important;
    margin: 0 auto;
}
#logo2{text-align:center;}
}


/*--------------------------------------------
IE
--------------------------------------------*/
@media all and (-ms-high-contrast:none){
.cms_1-a figure img{width:100%!important;height:auto!important;}

}


/*--------animation--------*/
#loading{
    background-color: #ead0d1;
    background: -webkit-linear-gradient(to left, #8f94fb, #4e54c8);  
    width: 100%;
    height:100vh;
}
#loading.loading_sub{position: fixed;}
.flow{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
#main_img .flow{
    z-index: 5;
    opacity: 0.85;
}
.flow li{
    position: absolute;
    display: block;
    list-style: none;
    width: 6%;
    height: 15%;
    background-size: contain;
    background-repeat: no-repeat;
    animation: animate 25s infinite;
    bottom: -150px;
    }
    @media screen and (max-width: 768px){
        .flow li {width: 10%;}
    }
.flow li:nth-child(1){
    left: 25%;
    background-image:url('./Dup/img/item_01.png');
    animation-delay: -5s;
}
.flow li:nth-child(2){
    left: 10%;
    background-image:url('./Dup/img/item_02.png');
    animation-delay: -2s;
    animation-duration: 18s;
}
.flow li:nth-child(3){
    left: 70%;
    background-image:url('./Dup/img/item_03.png');
    animation-delay: -4s;
}
.flow li:nth-child(4){
    left: 40%;
    animation-delay: -7s;
    background-image:url('./Dup/img/item_04.png');
    animation-duration: 14s;
}
.flow li:nth-child(5){
    left: 65%;
    background-image:url('./Dup/img/item_05.png');
    animation-delay: -6s;
}
.flow li:nth-child(6){
    left: 82%;
    background-image:url('./Dup/img/item_06.png');
    animation-delay: -3s;
}
.flow li:nth-child(7){
    left: 35%;
    background-image:url('./Dup/img/item_07.png');
    animation-delay: -2s;
}
.flow li:nth-child(8){
    left: 50%;
    background-image:url('./Dup/img/item_08.png');
    animation-delay: -1s;
    animation-duration: 20s;
}
.flow li:nth-child(9){
    left: 20%;
    background-image:url('./Dup/img/item_09.png');
    animation-delay: -2s;
    animation-duration: 18s;
}
.flow li:nth-child(10){
    left: 85%;
    background-image:url('./Dup/img/item_10.png');
    animation-delay: -5s;
    animation-duration: 16s;
}
@keyframes animate {
    0%{
        transform: translateY(0) rotate(-30deg);
        opacity: 1;
    }
    100%{
        transform: translateY(-1000px) rotate(30deg);
        opacity: 0;
        display: none;
        z-index: -1;
    }
}

#loading .catch{
    position: absolute;
    top: 50%;
    left: 50%;
    animation-name:smoothAnime;
	animation-duration:2s;
	animation-fill-mode:forwards;
  　transform-origin: left;
	opacity:0;
}

@keyframes smoothAnime{
  from {
  transform: translate3d(-70%, 100%, 0) skewY(12deg);
  opacity:0;
  }

  to {
  transform: translate3d(-50%, -50%, 0) skewY(0);
  opacity:1;
  }
}
/*--------------------------------------------
2023/06/29　カラー変更
--------------------------------------------*/
.bg_color1 {
    background-color: #d9d491;
}
.bg_color2 {
    background-color: #f6f6e7;
}
.bg_color3 {
    background-color: #ebd482;
}
.bg_color5 {
    background-color: #fafbf2;
}
.txt_color1 {
    color: #cdc07e;
}
.txt_color2 {
    color: #f6f6e7;
}
.txt_color3 {
    color: #ebd482;
}
.border_color1 {
    border-color: #cdc07e;
}
.border_color2 {
    border-color: #f6f6e7;
}
.border_color3 {
    border-color: #ebd482;
}
.hvr_bg_color1:hover {
    background-color: #d9d491;
}
.hvr_bg_color2:hover {
    background-color: #f6f6e7;
}
.hvr_bg_color3:hover {
    background-color: #ebd482;
}
.hvr_txt_color1:hover {
    color: #cdc07e;
}
.hvr_txt_color2:hover {
    color: #f6f6e7;
}
.hvr_txt_color3:hover {
    color: #ebd482;
}
#loading {
    background-color: #d9d491;
}
#header .h_box_mail a {
    background-color: #ebd482;
}
.section {
    background-color: #f7f7f0;
}
.cms_box .cms_box_bg {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 30%, #f3f0e2);
}
/*メインビジュアルの画像の位置調整*/
video {
   top: 70%!important; 
}