/* ------------- my css ------------- */



/* color */
.txt_color_nomal, .hvr_txt_color_nomal:hover{color: var(--black);}
:root{
    --color1: #bca084; 
    --color2: #ebfafa; 
    --color3: #e8e2dd; 
    --color4: #77c8db; 
    --color6:#f28696;
    --black: #151a1e; 
}

.txt_red, .hvr_txt_red:hover{color: #C12326;}
.txt_gray, .hvr_txt_gray:hover{color: #ccc}
.txt_color1, .hvr_txt_color1:hover{color: var(--color1)} /* メインカラー */
.txt_color2, .hvr_txt_color2:hover{color: var(--color2)} /* サブカラー */
.txt_color3, .hvr_txt_color3:hover{color: var(--color3)} /* アクセントカラー1 */
.txt_color4, .hvr_txt_color4:hover{color: var(--color4)} /* アクセントカラー2 */
.txt_color6, .hvr_txt_color6:hover{color: var(--color6)}

/* background-color */
.bg_black, .hvr_bg_black:hover{background-color: var(--black)} /* 黒背景 */
.bg_gray, .hvr_bg_gray:hover{background-color: #ccc}
.bg_color1, .hvr_bg_color1:hover{background-color: var(--color1)} /* メインカラー */
.bg_color2, .hvr_bg_color2:hover{background-color: var(--color2)} /* サブカラー */
.bg_color3, .hvr_bg_color3:hover{background-color: var(--color3)} /* アクセントカラー1 */
.bg_color4, .hvr_bg_color4:hover{background-color: var(--color4)} /* アクセントカラー2 */
.bg_color6, .hvr_bg_color6:hover{background-color: var(--color6)}
.bg_color_clear, .hvr_bg_color_clear:hover{background-color: transparent!important}

/* border-color ※!important */
.border_black, .hvr_border_black:hover{border-color: var(--black)}
.border_gray, .hvr_border_gray:hover{border-color: #ccc}
.border_color1, .hvr_border_color1:hover{border-color: var(--color1)}
.border_color2, .hvr_border_color2:hover{border-color: var(--color2)}
.border_color3, .hvr_border_color3:hover{border-color: var(--color3)}
.border_color4, .hvr_border_color4:hover{border-color: var(--color4)}
.border_color6, .hvr_border_color6:hover{border-color: var(--color6)}

/*自動リンク設定*/
.linkStyle{
    color:var(--color1);
}
.linkStyle:hover{
	opacity:0.7
}

body{
    font-size: 16px;
}
#wrap{
    min-width: 1200px;
}

@media screen and (max-width: 768px) {
    #wrap{
    min-width: auto;
}
}


.point_no{
    pointer-events: none;
}
/*------------- header -------------*/

#con_nav ul li {
    max-width: 22%;
    font-size: 15px;
}

.con_navbar{
    transition: 0.3s;
}

.hambuger_text, .hambuger_text02, #sp_nav .sp_nav_inner .txt_color2{
    color: #5dc3db;
}

#sp_nav .sp_nav_inner .border_color2{
    border-color: var(--color1);
}
#sp_nav .sp_nav_inner li a{
    color: var(--color1);
}

#sp_nav h3{
    padding-bottom: 10px;
}

/*------------- fv -------------*/
 #main_img .swiper-container {
    margin: 0 auto;
}


.main_txt{
    z-index: 2;
    width: 70%;
    max-width: 470px;
    top: 46%;
    left: 50%;
    transform: translate(-50%,-50%);
        filter: drop-shadow(0px 0px 6px rgba(188, 160, 132, 0.6));
}

.main_item1{
    z-index: 2;
    width: 13%;
    max-width: 150px;
    bottom: 0;
    left: 2%;
}
.main_item2{
    z-index: 2;
    width: 20%;
    max-width: 250px;
    bottom: 0;
    right: 7%;
}
.main_item3{
    z-index: 2;
    width: 13%;
    max-width: 150px;
    bottom: 0;
    right: 2%;
}



.scroll {
    left: 10px;
}
.triangle01{
    display: none;
}

@media screen and (max-width: 768px) {
   

    .main_item1 {
        width: 15%;
    }
    .main_item2 {
        width: 28%;
    }
    .main_item3 {
        width: 16%;
        right:0;
    }
    
}

@media screen and (max-width: 667px) {
    .main_item1 {
        width: 18%;
    }
    .main_item2 {
        width: 33%;
    }
    
}
/*------------- TOP -------------*/

.cms_title h3{
    color: #2d2015;
}

.con_title,.cms_title p{
    color:var(--color6);
    
}

.border_rad20{
    border-radius: 20px;
}
#top_news{
     background-image: url("/Files/img/bg1.png"); /* 画像のパス */
  background-size: cover;   /* 画面いっぱいに広げる */
  background-position: center; /* 中央寄せ */
  background-repeat: no-repeat; /* 繰り返さない */
}

#top_news .cms1inner{
    border-radius: 20px;
}
.cms_box{
    border: none;
    padding-right: 5%;
    padding-left: 5%;
}

.cms_item3{
    bottom: -10px;
    left: 5%;
    width: 13%;
    max-width: 190px;
    z-index: 2;
}

.cms_item5{
     z-index: 2;
    width: 14%;
    max-width: 200px;
    top: -5%;
    left: -10px;
}
.cms_item6{
     z-index: 1;
    width: 33%;
    max-width: 220px;
    top: -12%;
    right: 8px;
}
.cms_item7{
    z-index: 2;
    width: 18%;
    max-width: 250px;
    bottom: 13%;
    right: -3%;
}
.cms_item8{
     z-index: 2;
    width: 16%;
    max-width: 200px;
    top: 10%;
    left: 0;
}

.cake1{
    right: 20px;
    bottom: -8%;
    width: 22%;
    max-width: 350px;
    z-index: 2;
}
.cake2{
    left: 2vw;
    bottom: -3vw;
    width: 22%;
    max-width: 400px;
    z-index: 2;
}

.footer_item4{
    z-index: 2;
    bottom: -10px;
    right: 15%;
    width: 10%;
    max-width: 150px;
}
.footer_item3{
    z-index: 2;
    bottom: -10px;
    right: 10%;
    width: 8%;
    max-width: 120px;
}

.kiwi,#footer_info .info_txt_wrap a{
    font-family: 'Kiwi Maru', serif;
}


/*切り抜き*/

#top_contents3 img{
    border-radius: 0;
}
.mask1{
  -webkit-mask-image: url("/Files/img/svg1.png");
          mask-image: url("/Files/img/svg1.png");
          mask-size: 100% 100%;
} 
 
.mask2 {
  -webkit-mask-image: url("/Files/img/svg2.png");
          mask-image: url("/Files/img/svg2.png");
          mask-size: 100% 100%;
} 



 .mask3 {
  -webkit-mask-image: url("/Files/img/svg3.png");
          mask-image: url("/Files/img/svg3.png");
          mask-size: 100% 100%;
} 
 .con3_img3 {
    margin-right: 7%;
;
}




@media screen and (max-width: 768px) {
    #top_news{
        padding: 50px;
    }
    
    #attach_area h2{
        filter: drop-shadow(0px 0px 6px rgba(188, 160, 132, 0.6));
    }
    .cms_item5 {
        width: 28%;
        max-width: 220px;
    }
    .cms_item6 {
    width: 34%;
    max-width: 209px;
    top: -6%;
    }
    .cms_item7{
        bottom: auto;
    top: 50%;
    transform: translate(-50%, 0);
    width: 25%;
    right: -10%;
    }
    .cms_item8{
        top: 3%;
    width: 22%;
    }
    .cake1{
    right: 10px;
    bottom:-5%;
}
}

@media screen and (max-width: 667px) {
    #top_news{
        padding: 80px 20px 30px;
    }
    .cake1{
            bottom: -3%;
    width: 37%;
    right: 0;
    }
    .cake2{
            bottom: 5vw;
    width: 50%;
    }
    .cms_item3 {
            width: 26%;
    }
    
    .cms_item7{
        top: 27%;
    width: 38%;
    right: -24%;
    }
    
    .cms_title h3{
        max-width: 250px;
        margin: 0 auto;
    }
    .info_txt_wrap {
        margin-bottom: 10px;
        padding-bottom: 100px;
    }
    .footer_item4 {
            width: 16%;
    }
    .footer_item3 {
    width: 13%;
    right: 5%;
    }
}


/*------------- footer -------------*/

#footer_info_logo{
    width: 20% !important;
}
#footer_nav{
    width: 80% !important;
}

@media screen and (max-width: 768px) {
    .info_txt_wrap {
        background-color: transparent;
        
    }
}


/*------------- 下層 -------------*/

.title_wrap {
    max-width: 700px;
    width: 70%;
}
.page03 .title_wrap {
    width: 80%;
}


.cate_list li{
    border-radius: 50px;
}
/*------------- 下層 -------------*/
.blog_title{
    color: #5dc3db;
}
@media screen and (max-width: 667px) {
#page_title .title_wrap h2{
    font-size: 22px;
}
}


/*------------- お問い合わせ-------------*/
input[type="reset"]{
        border-radius: 0;
    -webkit-box-sizing: content-box;
    -webkit-appearance: button;
    appearance: button;
    border: none;
    box-sizing: border-box;
    cursor: pointer;
} 

/*------------- サイトマップ -------------*/
#page10 .more .opacity04{
    opacity: 0.8;
}

#page10 .more a{
    color: #2d2015;
}