@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP&display=swap');

.hannari {
    font-family: "Josefin Sans",'Noto Sans JP', sans-serif;
}

body{
    font-family: 'Noto Sans JP',"游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    background-color: #fefefd;
}

#fakeloader{background-color: #fefefd;}

#nav_menu .right .mg_b-50px .nav_menu_more:last-of-type{display:none;}

.overlay{background: none!important;background-color: rgba(86,56,58,0.8)!important;}

.more_btn{color: #3b344a;background-color: rgba(227,227,227,0.5);border-radius: 7px;}

#main_img .menu p{
    background-color: rgba(255,255,255,0.6);
    border-radius: 10px;
}
#main_img:before {background-color: rgba(86,56,58,0.30);}

#intro_wrap h4{color:#a2a2a2;}

.intro_txt{
    max-width: 840px;
    margin: 0 auto;
} 

#contents1 .con_box {margin-top: 10%;}
#contents2 .con_box {margin-top: 10%;}
main span.num{display:none;}
main p.num2{font-family: "Josefin Sans",sans-serif;font-size: 26px;font-style: italic;}
main p.num2 span{font-size: 36px;}

#contents1 .con_img_wrap{position:relative;}
#contents1 .con_img_wrap::before{
    content: "";
    border:1px solid  #CDB6BC;
    position: absolute;
    top: 6px;
    left: 6px;
    width: 100%;
    height: 100%;
    z-index: -1;
}
#contents1 .con_img_wrap .con_img::before{
    content: "";
    border:1px solid  #CDB6BC;
    position: absolute;
    top: 6px;
    left: 6px;
    width: 100%;
    height: 100%;
    z-index: 1;
}

#contents2 .con_img_wrap{position:relative;}
#contents2 .con_img_wrap::before{
    content: "";
    border:1px solid  #CDB6BC;
    position: absolute;
    top: 6px;
    right: 6px;
    width: 100%;
    height: 100%;
    z-index: -1;
}
#contents2 .con_img_wrap .con_img::before{
    content: "";
    border:1px solid  #CDB6BC;
    position: absolute;
    top: 6px;
    right: 6px;
    width: 100%;
    height: 100%;
    z-index: 1;
}
#contents2 .con_img{margin-bottom: 0;}

#contents3 .con_box {border-radius: 10px;}

.line:before {background-color: #d3d8eb!important;}

#top_cms .cms_title p{color: #a2a2a2;}
#top_cms .cms_title h3{font-style: italic;}

#info_contact .con_img {border-radius: 8px;}
#info_contact .con_img:before {background-color: rgba(175,175,175,0.5);}

.back1:before, .back2:before{z-index: -1;}
.back1:before {
    background-color: rgba(255,247,240,0.4);
    background-image: repeating-linear-gradient(-45deg,#fff, #fff 7px,transparent 0, transparent 14px);
}
.back2:before {
    background-color: rgba(246,247,251,0.8);
    background-image: repeating-linear-gradient(-45deg,#fff, #fff 7px,transparent 0, transparent 14px);
}

#footer {background-color: rgba(255,255,255,0.2);}

#page_title .page_title_box{border-radius: 7px;}
.cate_list li a {border-radius: 7px;}

#page9 .more{padding-top: 1px;}

.cms_5-c .box_title1::before{top: 0px;font-size: calc(1rem + 6px);}
.cms_5-c .box_txt1::before{top: 4px;font-size: calc(1rem + 6px);color: rgba(0,0,0,0.3);}
#cms_5-c .box_title1::before {top: 3px;font-size: calc(1rem + 6px);}
#cms_5-c .box_txt1::before{top: 4px;font-size: calc(1rem + 6px);color: rgba(0,0,0,0.3);}

@media screen and (min-width:769px){

}

@media screen and (max-width: 768px){
.cms_5-c .box_title1::before {top: 4px;}
.cms_5-c .box_txt1::before {top: 6px;}
#cms_5-c .box_txt1::before {top: 5px;}
}

@media screen and (max-width: 667px){
.page_title_box{width: 60%;}
.page_title_box h2{font-size: 18px;}

#contents1 .con_img_wrap::before {display:none;}
#contents1 .con_img_wrap .con_img::before {width: calc(100% - 12px);height: calc(100% - 12px);}
#contents2 .con_img_wrap::before {display:none;}
#contents2 .con_img_wrap .con_img::before {width: calc(100% - 12px);height: calc(100% - 12px);}
}

@media all and (-ms-high-contrast:none){
.page10 .page_title_box h2{margin-top: 0;}
}

/* アニメーション関連 */
.txt_randomc span{
    animation: pyon 0.4s linear;
    position: relative;
}

@keyframes pyon {
    0% {top: 0;color:#770000;}
    50% {top:-7px;color:#770000;}
    100%{top: 0;color:#770000;}
}