@charset "utf-8";
/* CSS Document */
/* 自動リンク設定 */
#loader {
    transition: 0s;
}
.linkStyle{
	color:#339900;
}
.linkStyle:hover{
	color:#339900;
	opacity: 0.7;
	transition: all 0.5s;
}

/* color */
body,.txt_color_nomal{color: #333333;}
.txt_white{color: white;}
.txt_red{color: red;}
.txt_color1{color: #543E38} /* メインカラー */
.txt_color2{color: #CCC4B8} /* サブカラー */
.txt_color3{color: #339900} /* アクセントカラー1 */
.txt_color4{color: #FFF7F0} /* アクセントカラー2 */

/* background-color */
.bg_white{background-color: white} /* 白背景 */
.bg_black{background-color: black} /* 黒背景 */
.bg_color1{background-color: #339900} /* メインカラー */
.bg_color2{background-color: #473a33} /* サブカラー */
.bg_color3{background-color: #339900} /* アクセントカラー1 */
.bg_color4{background-color: #FFF7F0} /* アクセントカラー2 */
.bg_color_clear{background-color: transparent!important}


/* border-color ※!important */
.border_color1{border-color: #543E38}
.border_color2{border-color: #CCC4B8}
.border_color3{border-color: #339900}
.border_color4{border-color: #FFF7F0}


/* hover ---------------------------------------------------------------------------------------------*/
/* color */
.hvr_txt_color_nomal:hover{color: #333333;}
.hvr_txt_white:hover{color: white;}
.hvr_txt_red:hover{color: red;}
.hvr_txt_color1:hover{color: #84d357} /* メインカラー */
.hvr_txt_color2:hover{color: #CCC4B8} /* サブカラー */
.hvr_txt_color3:hover{color: #339900} /* アクセントカラー1 */
.hvr_txt_color4:hover{color: #FFF7F0} /* アクセントカラー2 */

/* background-color */
.hvr_bg_white:hover{background-color: white} /* 白背景 */
.hvr_bg_black:hover{background-color: black} /* 黒背景 */
.hvr_bg_color1:hover{background-color: #543E38} /* メインカラー */
.hvr_bg_color2:hover{background-color: #543E38} /* サブカラー */
.hvr_bg_color3:hover{background-color: #339900} /* アクセントカラー1 */
.hvr_bg_color4:hover{background-color: #FFF7F0} /* アクセントカラー2 */
.hvr_bg_color_clear:hover{background-color: transparent!important}

/* border-color ※!important */
.hvr_border_color1:hover{border-color: #543E38}
.hvr_border_color2:hover{border-color: #CCC4B8}
.hvr_border_color3:hover{border-color: #C45F2C}
.hvr_border_color4:hover{border-color: #FFF7F0}

.back1:before,
.back2:before,
#top_cms.back1:before{
    background-color: rgba(204, 196, 184,0.3)!important;
    pointer-events: none!important;
    z-index: -1;}
.line:before{
    background-color: rgba(84, 62, 56,0.7)!important;}
#header{
    background-color: rgba(51, 153, 0,0.7);}
#footer{
    background-color: #f0edea;}
#footer_txt,#footer .con_box,#footer .tel_bt,#h1txt{
    color: #333;}
#footer .con_box h2,.cms_5-c .box_title1::before,#cms_5-c .box_title1::before,#page5 .box_title{color:#339900;}
.cms_5-c .box_txt1::before,#cms_5-c .box_txt1::before{color:rgba(51, 153, 0, 0.3);}
#contact_tel_wrap .contact_tel p.txt_color_nomal{color: #fff7f0;}
.overlay{background: linear-gradient(135deg, rgba(146, 211, 65,0.9) , rgba(51,153,0,0.9) )!important;}
#cms_1-a .pager li a:hover{
background-color: rgba(51,153,0,0.3);
}
#contents3_wrap:after{
    background-color:rgba(90,57,45,0.7)!important;
}

/* 文字 ---------------------------------------------------------------------------------------------*/
a.more_btn{
    font-weight: 700;
    background-color: rgba(255,255,255,0.3);
}

/* TOP （mainは下）---------------------------------------------------------------------------------------------*/
/* バナー */
.bnr{
    right: 59px;
    bottom: 42px;
    max-width: 200px;
    z-index: 5;
}
.bnr a:hover{
    opacity: 0.7;
    transition: 0.5s;
}


/* コンテンツ */
.dec3{
  　 max-width: 1050px;
    width: 66%;
    top: -381px;
    right: 0;
    z-index: -1;
    opacity: 0.4!important;
}
.dec4{
    max-width: 500px;
    width: 30%;
    top: -222px;
    left: -199px;
    opacity: 0.7!important;}
.dec5{
    max-width: 500px;
    width: 35%;
    top: -320px;
    right: 0;
    z-index: 2;
    opacity: 0.7!important;}
#contents1 .num{top: 100px;}

#contents3_wrap .con_txt{
    max-width: 536px;
    width: 80%;
    text-align: left;
    left: 0%;
    margin: 0 auto;
    padding-left: 20px;
}

span.highlight{
    color: #339900;
    font-weight: 600;
    font-size: 1.2rem;
}
#contents3_wrap .con_txt::before{
    content: "";
    background-image: url(./Dup/img/check.png);
    width: 20px;
    height: 20px;
    background-size: cover;
    background-repeat: no-repeat;
    position: absolute;
    top: 9px;
    left: -5px;
}
    


/* メニュー */
#top_pc_nav li a{
    font-weight: 600;
    font-size: 17px;
    text-shadow:1px 1px 3px rgba(0, 0, 0, 0.7);
}
#top_pc_nav li a:hover{
    opacity: 0.7;
}
#top_pc_nav li a::after{
    background: rgba(74, 164, 28, 1);
}
/*  */
.dec6{
  　 max-width: 1050px;
    width: 55%;
    top: 440px;
    right: 0;
    z-index: -1;
    opacity: 0.3!important;
}

/* ハンバーガーメニュー */
header.scr_header #logo{
    max-width: 270px;
}

#nav_menu .nav_menu_more:first-of-type a .icon:before{
    display: none;
}


/* 下層ページ ----------------------------------------------------------------------------------------*/
/* 初めての方へ */
#cms_6-c .box_title{
    font-size: 18px;
    font-weight: 600;}
#cms_6-c .cate_box{
    margin-bottom: 0px;}
#cms_6-c .arrow{
    height: 0px;}
#cms_6-c .circle{
    border-radius: 0px;
    bottom: -90px;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 0;
    height: 0;
    border-style: solid;
    background-color: rgba(255,255,255,0);
    border-top: 30px solid #339900;
    border-right: 30px solid transparent;
    border-bottom: 30px solid transparent;
    border-left: 30px solid transparent;
}
#cms_6-c .triangle{
    border-radius: 0px;
    bottom: -83px;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 0;
    height: 0;
    border-style: solid;
    background-color: rgba(255,255,255,0);
    border-top: 30px solid #FFF;
    border-right: 30px solid transparent;
    border-bottom: 30px solid transparent;
    border-left: 30px solid transparent;
    z-index: 4;
}

/* 当院について */
#cms_2-a .box_txt1{
    padding-bottom: 0;
}
#cms_2-a .cate_box{
    margin-top: 25px;
    padding-bottom: 25px;
    padding-top: 0px;
}
#cms_2-a .box_title1{
    padding-top: 0px;
}
/*  */


/* メインイメージ -----------------------------------------------------------------------------------*/

#main_img:before{
    background-color:rgba(190,190,150,0.4);
}
#top_pc_nav{
    margin-top:-15px;
}
#main_img .posi_center{
    top: 60%;
}
#main_img .square_box{
    height: 300px;
}
.catch {
    z-index: 3;
    position: absolute;
    top: 195px;
    transform: translate(0%, 0%);
    max-width: 1000px;
    width: 80%;
}
.blur1{
  animation-name:blurAnime;
  animation-duration:1s;
  animation-delay: 3.5s;
  animation-fill-mode:forwards;
  opacity: 0;
}

@keyframes blurAnime{
  from {
  filter: blur(10px);
  transform: scale(1.02);
      opacity: 0;
  }

  to {
  filter: blur(0);
  transform: scale(1);
      opacity: 1;
  }
}
.blur2{
  animation-name:blurAnime;
  animation-duration:2s;
  animation-delay: 3.8s;
  animation-fill-mode:forwards;
  opacity: 0;
}

@keyframes blurAnime{
  from {
  filter: blur(10px);
  transform: scale(1.02);
      opacity: 0;
  }

  to {
  filter: blur(0);
  transform: scale(1);
      opacity: 1;
  }
}
.dec1{
    z-index: 4;
    max-width: 1400px;
    width: 100%;
    top: 0px;
    right: 0px;
}
.dec2{
    z-index: 4;
    max-width: 1600px;
    width: 100%;
    bottom: 0px;
    left: 0px;
    /*transform: rotateZ(180deg);*/
    pointer-events: none;
}

@media screen and (max-width: 1279px){
    .catch {
    top: 130px;
    width: 80%;
}
}

/* タブレット --------------------------------------------------------------------------------------*/
@media screen and (max-width: 768px){
    .bnr{
        right: 45px;
        max-width: 240px;
    }
    
    .catch{
        top: 107px;}
    #main_img .posi_center{
        top: 65%;}
    .dec3{
    width: 66%;
    top: -260px;}
    
    .dec4 {
    top: -312px;
    left: -43px;
    opacity: 0.7!important;}
    
    .dec5 {
    top: -110px;}
    
    .dec6 {
    top: 400px;}
    
    #intro_wrap {
    padding: 6% 4%;}
    
    #contents1 .con_title{
        padding-top: 20px;}
    #contents1 .num {
    top: 0px;}
    span.highlight {
    font-size: 1rem;}
    
    
    /*ハンバーガーメニュー・メニューバー*/
    header.scr_header #logo {
    max-width: 200px;}
    
    #header .d_flex{
        padding-top: 15px;
        padding-bottom: 15px;}
    .button_container{
        height: 35px;}
    
    
    
    /*下層ページ*/
    #cms_2-a .pd_l-r5per{
        padding: 0 3%;}
    #cms_2-a .box_title1.pd_t-15px{
        padding-top: 0px;}
        
    #cms_3-c .box_title1{
        width: 60%!important;
        padding-left: 10px!important;
    }
    #cms_3-c .box_title2{
        width: 40%!important;
        text-align: right;
        padding-right: 10px!important;
    }
    #cms_3-c .box_txt1{
        padding: 0px 10px!important;}
    
    #page7 .box_title1{
        padding-right: 3%;}

    
    
}

/* スマホ ------------------------------------------------------------------------------------------*/
@media screen and (max-width: 667px){
    .bnr {
        right: 25px;
        max-width: 200px;
    }
    #main_img .posi_center{
            top: 53%;}
    .catch {
        top: 175px;
        width: 88%;}
    .dec1{
        width: 230%;}
    .dec2{
        width: 190%;}
    
    .dec3{
        top: -126px;
        z-index: 0;
        width: 70%;}
    .dec4{
        top: -5px;
        left: -24px;
        z-index: 2;
        width: 40%;}
    .dec5{
        top: -64px;}
    .dec6 {
        top: 522px;}

    #intro h3{
        font-size: 19px;}
    #intro{padding: 0 4%;}
    #intro_wrap{padding: 6% 3%;}
    
    #contents1_wrap .rectangle_img img{
        top: 23%;}
    #contents1_wrap,#contents2_wrap{padding: 0 3%;}
    #contents1 .num {
        top: -50px;}
    
    #contents3_wrap .con_txt{
        margin-bottom: 15px;}
    #contents3_wrap .con_box.pd_5per_tb{
        padding: 3%;}
    
    
    #header .d_flex{
        padding-top: 10px;
        padding-bottom: 10px;}
    #header{
        padding: 0% 5%;
    }
    
    /*下層ページ*/
    #page_title .page_title_box{width: 70%;}
    #page_title h2.hannari{font-size: 18px;}
    #page_title p{font-size: 10px;}
    #page_title .page_title_box{padding: 10px 10px 15px 10px;}
    
    #page9 .con_box h3{font-size: 14px;}
    
    #cms_3-c .cate_title,#cms_3-c .box_title1{font-weight:600;}
    #cms_3-c .box_title1{
        border-bottom:1px solid #339900;
        font-size: 17px;}
    #cms_3-c .box_title2{font-size: 15px;}
    #cms_3-c .box_txt1{font-size: 15px;}
    
    
    #cms_6-c .cate_box{
        border-top: 3px solid #339900;
        padding-top: 35px;}
    #cms_6-c .circle{
        bottom: -60px;
        border-top: 20px solid #339900;
        border-right: 20px solid transparent;
        border-bottom: 20px solid transparent;
        border-left: 20px solid transparent;
    }
    #cms_6-c .triangle{
        bottom: -56px;
        border-top: 20px solid #FFF;
        border-right: 20px solid transparent;
        border-bottom: 20px solid transparent;
        border-left: 20px solid transparent;
    }
    
    
    #page5 .cate_box{padding: 21px;}
    
    
}