/* all page */
/*fonts*/

/* color ---------------------------------------------------------------------------------------------*/
.linkStyle{color: #5a7c6d;text-decoration: underline;transition: opacity .3s;}
.linkStyle:hover{opacity: 0.7}
.txt_color1{color: #87ac89;} /* メインカラー */
.txt_color2{color: #e6e6e6} /* サブカラー */
.txt_color3, .hvr_txt_color3:hover{color: #8fb3b2;} /* アクセントカラー1 */
.txt_color4{color: #c9baa9} /* アクセントカラー2 */

/* background-color */
.bg_color1{background-color: #9ebea0;} /* メインカラー */
.bg_color2{background-color: #eee9cd;} /* サブカラー */
.bg_color3, .hvr_bg_color3:hover{background-color: #8fb3b2;} /* アクセントカラー1 */
.bg_color4{background-color: #c9baa9} /* アクセントカラー2 */

/* border-color ※!important */
.border_color1{border-color: #87ac89;}
.border_color2{border-color: #e6e6e6}
.border_color3, .hvr_border_color3:hover{border-color: #8fb3b2;}
.border_color4{border-color: #c9baa9}

.border_black {border-color: #828282;}


/* top ----------------*/

/* header */
#header #logo{
    max-width: 300px;
}

/* main img */
#main_img .swiper-wrapper::before {
    background-image: radial-gradient(rgba(255,255,255,0.2) 40%, transparent 40%);
}
#main_img{
    overflow: hidden;
}
.main_img_txt {
    font-weight: normal;
    left: 20%;
    color: #787878;
    -webkit-box-reflect: below -85px -webkit-gradient(linear, left bottom, left top, from(rgba(255,255,255,0.4)), to(transparent));
}
.main_img_txt2 {
    letter-spacing: 4px;
    text-indent: 4px;
    z-index: 3;
    left: auto;
    right: 20%;
    transform: translate(50%,-50%);
    color: #787878;
    -webkit-box-reflect: below -85px -webkit-gradient(linear, left bottom, left top, from(rgba(255,255,255,0.4)), to(transparent));
}
/*アニメーション*/
/*.ani_fadein{*/
/*	display: none;*/
/*}*/
.ani {
  animation: slideIn 2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1 forwards;
  animation-delay: 2s;
}
.ani2 {
  animation: slideIn2 2.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1 forwards;
  animation-delay: 2s;
}
.ani3 {
  animation: slideIn3 2.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1 forwards;
  animation-delay: 2s;
}
.ani4 {
  animation: slideIn4 2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1 forwards;
  animation-delay: 2s;
}
.leaf_lt{
    top: 0;
    left: 0;
    z-index: 5;
    filter: blur(3px);
}
.leaf_lb{
    bottom: 0;
    left: 0;
    z-index: 5;
    filter: blur(8px);
}
.leaf_rt{
    top: 0;
    right: 0;
    z-index: 5;
    filter: blur(4px);
}
.leaf_rb{
    bottom: 0;
    right: 0;
    z-index: 5;
    filter: blur(6px);
}
@keyframes slideIn {
  0% {
    transform: translate(0,0);
  }
  100% {
    transform: translate(-180px,-40px);
  }
}
@keyframes slideIn2 {
  0% {
    transform: translate(0,0);
  }
  100% {
    transform: translate(-470px,450px);
  }
}
@keyframes slideIn3 {
  0% {
    transform: translate(0,0);
  }
  100% {
    transform: translate(250px,-350px);
  }
}
@keyframes slideIn4 {
  0% {
    transform: translate(0,0);
  }
  100% {
    transform: translate(230px,280px);
  }
}

/* main */

/* intro */


/* contents */
.con3_img{
    padding-top: 3%;
}
#s_content2 h2, .top_cms_title h2 {
    background-image: url(./Dup/img/title_top.png);
    padding-top: 60px;
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 50px;
}

/* topcms */


/* footer */
.sf_access_r{
    padding: 0 0 0 30px;
}
.sf_access_r #logo2{
    margin-bottom: 10px;
}


/* under page */
#page_title::before {
    background: rgba(255,255,255,0.2);
}

/* cms1 */

/* cms2 */

/* cms3 */

/* cms4 */

/* cms5 */

/* page7 */

/* page8 */

/* page9 */

/* page10 */


/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
    #header #logo {
        max-width: 250px;
    }
    .main_img_txt, .main_img_txt2 {
        -webkit-box-reflect: below -50px -webkit-gradient(linear, left bottom, left top, from(rgba(255,255,255,0.4)), to(transparent));
    }
@keyframes slideIn {
  0% {
    transform: translate(0,0);
  }
  100% {
    transform: translate(-250px,-70px);
  }
}
@keyframes slideIn2 {
  0% {
    transform: translate(0,0);
  }
  100% {
    transform: translate(-460px,330px);
  }
}
@keyframes slideIn3 {
  0% {
    transform: translate(0,0);
  }
  100% {
    transform: translate(390px,-430px);
  }
}
@keyframes slideIn4 {
  0% {
    transform: translate(0,0);
  }
  100% {
    transform: translate(460px,230px);
  }
}
    .con3_img {
        top: 0;
        left: 0;
        transform: none;
        padding: 5%;
    }
    .cms_box .cms_box_bg {
        height: 130px;
    }
    .top_cms_title h2 {
        padding-top: 30px;
        background-size: 30px;
    }
    
}
/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
    .overlay {
        top: 45px;
    }
    .leaf_lt, .leaf_lb, .leaf_rt, .leaf_rb {
        width: 300px;
    }
    .main_img_txt, .main_img_txt2 {
        -webkit-box-reflect: below -35px -webkit-gradient(linear, left bottom, left top, from(rgba(255,255,255,0.4)), to(transparent));
    }
@keyframes slideIn {
  0% {
    transform: translate(0,0);
  }
  100% {
    transform: translate(-100px,20px);
  }
}
@keyframes slideIn2 {
  0% {
    transform: translate(0,0);
  }
  100% {
    transform: translate(-160px,150px);
  }
}
@keyframes slideIn3 {
  0% {
    transform: translate(0,0);
  }
  100% {
    transform: translate(100px,-210px);
  }
}
@keyframes slideIn4 {
  0% {
    transform: translate(0,0);
  }
  100% {
    transform: translate(120px,90px);
  }
}
    .con3_img {
        padding: 50px 1%;
    }
    .sf_access_r #logo2 {
        text-align: center;
    }
    
}

/*20220425動画追加*/
.main_img_bg{
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}
.con0_txt{
    z-index: 2;
    top: 15%;
    left: 50%;
    transform: translateX(-50%);
}
/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
#main_img {
    height: 50vh;
}
.con0_txt {
    top: -50px;
}
#s_content0{
    margin-top: 100px;
}

}
/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
#main_img {
    height: 43vh;
}
.con0_txt {
    top: -30px;
}
#s_content0{
    margin-top: 50px;
}

}