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



/* color */
.txt_color_nomal, .hvr_txt_color_nomal:hover{color: var(--black);}
:root{
    --color1: #efdc8e; 
    --color2: #f7f4e4; 
    --color3: #edab5d; 
    --color4: #e6edda; 
    --black: #473b34; 
    --jp: 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
}
body{
    color: var(--black);
        line-height: 1.6;
}

.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 */

/* 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_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)}


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

body {
    font-size: 16px;
}

h2,.font_jp,.cate_title{
    font-family: var(--jp);
    line-height: 1.5;
}

/*------------- header -------------*/

.sp_nav_box .pd_t-5px{
    padding-top: 8px;
    padding-bottom: 8px;
}

#header{
    display: none;
}
header .menu_stick span:first-of-type {
    top: 20px;
}
header .menu_stick span:last-of-type {
    bottom: 20px;
}

.trans_logo{
    background-color:transparent;
    padding-top: 20px;
}
.trans_logo .width_100-max{
    max-width: 160px;
}

header .trans_header {
    height: 60px;
}

@media screen and (max-width: 768px) {
    .trans_logo .width_100-max{
    max-width: 100px;
    
}
    #main_img {
        padding-top: 60px;
    }
        
    .trans_logo{
        padding-top: 10px;
    }
}
@media screen and (max-width: 768px) {
header .menu_stick {
    width: 60px;
    height: 60px;
    
}
}

.menu_stick .bg_color1{
    background-color: var(--color3);
}

.sp_nav_box li a:hover{
    color: var(--black);
}
@media screen and (max-width: 667px) {
header .menu_stick{
    right: 3%;
}
.trans_logo{
    padding-left: 30px;
}
}

/*------------- nav -------------*/
#sp_nav .sp_nav_box ul.bg_white{
    width: 500px;
}

#sp_nav .tel_bt{
    text-align: left;
}
@media screen and (max-width: 768px){
    #sp_nav .sp_nav_box ul.bg_white{
    width: 300px;
    
}
}

/*------------- FV -------------*/

.swiper-container{
    background-color: var(--color4);
}
.swiper-container-fade .swiper-slide-active, .swiper-container-fade .swiper-slide-active .swiper-slide-active{
    opacity: 0.9 !important;
    mix-blend-mode: multiply;
}


.main_logo{
    z-index: 2;
    max-width: 180px;
    top: 0;
    left: 0;
    padding: 25px;
}

.main_txt{
    z-index: 2;
    width: 85%;
    max-width: 660px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.sub_txt{
    z-index: 2;
    right: 30px;
    bottom: -2%;
}


.fuwafuwa {
  animation: fuwafuwa 3s ease-in-out infinite alternate;
    background: url(/files/img/sub_txt.png) no-repeat center center / 220px auto;
    display: inline-block;
    transition: 1.5s ease-in-out;
    width: 230px;
    height: 230px;
    margin-top: 15px;
}

@keyframes fuwafuwa {
  0% {
    transform:translate(0, 0) rotate(-7deg);
  }
  50% {
    transform:translate(0, -7px) rotate(0deg);
  }
  100% {
    transform:translate(0, 0) rotate(7deg);
  }
}
.main_filter {
  z-index: 3; /* ロード後にアニメーションで消える背景 */
}


@media screen and (max-width: 768px) {
.fuwafuwa{
    background: url(/files/img/sub_txt.png) no-repeat center center / 170px auto;
     width: 190px;
    height: 190px;
}
.main_logo{
    display: none;
}
.sub_txt{
    bottom: -8%;
}
}


@media screen and (max-width: 667px) {
    
    .main_txt {
        filter: drop-shadow(0px 0px 10px #473b34);
    }
.fuwafuwa{
    background: url(/files/img/sub_txt.png) no-repeat center center / 100px auto;
     width: 110px;
    height: 110px;
}
.sub_txt {
    right: 0;
}

.swiper-container{
    height: 70vh;
}
    #main_img {
        height: 170vw !important;
    }
    
}

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

    #main_img {
        height: 147vw !important;
    }
    
}


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



.con1_title.txt_center{
    text-align: left;
}
#top_cms .top_cms_bg ,#footer .footer_bottom,#top_info{
    background-color: #fcfaf5;
}

#contents2 img, #contents3 img{
    border-radius: 10px;
}

#contents1{
    position: relative;
}

#contents1 .flower{
    right: 0;
    width: 30%;
    max-width: 350px;
    bottom: 15%;
    opacity: 0.4;

}


#top_info .flower2{
    left: -3%;
    width: 30%;
    max-width: 280px;
    top: -11%;
    opacity: 0.3;
}

.con2_wrap{
    padding-top: 60px;
    padding-bottom: 80px;
}
.con2_right2{
    margin-top: -12%;
}

.con3_right{
    margin-top: 5%;
}

.con3_right2{
    margin-top: -15%;
}


@media screen and (max-width: 768px) {
#contents1 .flower {
    bottom: auto;
    max-width: 180px;
    top: 40%;
    z-index: 2;
}
}
@media screen and (max-width: 667px) {
    #contents1 .flower{
        top: 30%;
}
.con2_right2,.con3_right2 {
    margin-top: 7%;
}

}




@media screen and (max-width: 768px) {
    #wrap h2{
    font-size: 18px;
}

.con1_title h2 br,.con2_title h2 br,.con3_title h2 br {
    display: none;
}
    #top_cms {
        padding-left: 20px;
        padding-right: 20px;
    }
    #contents2 {
        margin-top: -20px;
    }
    

}
@media screen and (max-width: 667px) {
     #contents2 {
        margin-top: -50px;
    }
    
}


#contents2 .con2_wrap{
    border-radius: 20px;
}


/*------------- box -------------*/

.modal_box{
	top: 0;
	left: 0;
	pointer-events: none;
	transform: scale(0.95);
	transition-property: opacity, transform;
	z-index: 3;
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
}
.modal_box > div{
	overflow-y: auto
}
.modal_box.active{
	pointer-events: auto;
	opacity: 1;
	transform: scale(1);
}
.modal_box .close{
	top: 150px;
	right: 200px;
	cursor: pointer
}
.more1 a::before, .more1 a::after{
	position: absolute;
	content: "";
	width: 5px;
	height: 100%;
	top: 0;
	border-top: solid 1px currentColor;
	border-bottom: solid 1px currentColor;
}
.more1 a::before{
	border-left: solid 1px currentColor;
	left: 0;
}
.more1 a::after{
	border-right: solid 1px currentColor;
	right: 0;
}

.more2 > div{
	cursor: pointer;
}
.more2 > div::before, .more2 > div::after{
	position: absolute;
	content: "";
	width: 20px;
	height: 1px;
	top: 0;
	bottom: 0;
	right: 0;
	margin: auto;
	background-color: currentColor;
}
.more2 > div::after{
	transform: rotate(90deg);
}
@media screen and (max-width: 768px){
.modal_box .close {
    top: 6%;
    right: 7%;
}
}


/*ここからスマホ用（750px以下）環境の設定
---------------------------------------------------------------------------*/

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

	.modal_box .close{
		top: 55px;
        right: 20px;
	}
}



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


.footer_nav .txt_color1{
    color: var(--color3);
}

.footer_nav{
    padding-bottom: 30px;
}

@media screen and (max-width: 768px) {
    #logo2 .width_200-max{
    max-width: 150px;
}
}

.footer_bottom .txt_left{
    font-size: 14px;
}

.tel_bt{
    display: none;
}


/*------------- 下層ページ -------------*/
.blog_bodyCate > li:before {
    color: var(--color3);
}
.blog_bodyCate{
    background-color: var(--color2);
    padding: 10px;

}

#cms_2-g .cate_list{
    display: none;
}

#cms_2-g .font_12{
        font-size: 15px;
}

#cms_3-c .cate.pd_b-40px{
    padding-bottom: 50px;
    margin-bottom: 50px;
}

.cate_list .txt_color1{
    color: var(--color3);
}
.cate_list .txt_color1:hover{
    opacity: 0.8;
}

.under_page #footer{
    background-color: #fff;
}

.cate_box .box_title1.txt_color1{
    color: var(--color3);
}

@media screen and (max-width: 768px) {
.cate_list{
    padding-bottom: 10px;
    margin-bottom: 30px;
}

.cms_wrap.mg_b-50px{
    margin-bottom: 5px;
}
}

/*------------- プライバシーポリシー -------------*/
#page09 h3{
    color: var(--color3);
}

#google_privacy{
    background-color: #fcfaf5 !important;
}