@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');
@import url('https://fonts.googleapis.com/css2?family=Caveat&display=swap');

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

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;}
#fakeloader:before {
    background-color: rgba(255,255,255,0.3);
}

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

.overlay{background: none!important;background-color: rgba(229,119,119,0.8)!important;}

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

#pc_nav li,#top_pc_nav li{
    width: 110px;
    margin-right: 0;
}

#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:2px solid  #e5c5ba;
    position: absolute;
    top: 6px;
    left: 6px;
    width: 100%;
    height: 100%;
    z-index: -1;
    transform: rotate(-5deg);
}
#contents1 .con_img_wrap .con_img::before{
    content: "";
    border:2px solid  #e5c5ba;
    position: absolute;
    top: 6px;
    left: 6px;
    width: 100%;
    height: 100%;
    z-index: 1;
    transform: rotate(-5deg);
}

#contents2 .con_img_wrap{position:relative;}
#contents2 .con_img_wrap::before{
    content: "";
    border:2px solid  #e5c5ba;
    position: absolute;
    top: 6px;
    right: 6px;
    width: 100%;
    height: 100%;
    z-index: -1;
    transform: rotate(5deg);
}
#contents2 .con_img_wrap .con_img::before{
    content: "";
    border:2px solid  #e5c5ba;
    position: absolute;
    top: 6px;
    right: 6px;
    width: 100%;
    height: 100%;
    z-index: 1;
    transform: rotate(5deg);
}
#contents2 .con_img{margin-bottom: 0;}

#contents3 .con_box {
    box-shadow: 0px 0px 50px 20px rgba(253,197,167,0.2);
    border-radius: 10px;
}

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

#top_cms .cms_title p{color: #a2a2a2;}
#top_cms .cms_title h3{font-family: 'Caveat';}

#top_cms .cms_wrap {background-color: rgba(247,237,234,0.6);}

#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(247,237,234,0.3);
    background-image: repeating-linear-gradient(-45deg,#fff, #fff 7px,transparent 0, transparent 14px);
}
.back2:before {
    background-color: rgba(247,237,234,0.3);
    background-image: repeating-linear-gradient(-45deg,#fff, #fff 7px,transparent 0, transparent 14px);
}

#footer {background-color: rgba(255,255,255,0.2);}
#footer_con h2{
    display: none;
}

#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: 26px;}

#contents1 .con_img_wrap::before {display:none;}
#contents1 .con_img_wrap .con_img::before {
    width: calc(100% - 12px);height: calc(100% - 12px);
    transform: rotate(0);
    top: 4px;
    left: 4px;
}
#contents2 .con_img_wrap::before {display:none;}
#contents2 .con_img_wrap .con_img::before {
    width: calc(100% - 12px);height: calc(100% - 12px);
    transform: rotate(0);
    top: 4px;
    left: 4px;
}
}

@media all and (-ms-high-contrast:none){
.page10 .page_title_box h2{margin-top: 0;}
#cms_3-a .cate_box h4, #cms_3-a .cate_box p{padding: 5px!important;}
/*#cms_6-a .link_btn a{padding: 13px 10px 7px;}*/
}

/* ローディングアニメーション */
#home {
  clip-path: url(#cache);
}
#red {
  fill: none;
  opacity: 0.15;
  stroke: #e57777;
  stroke-width: 6;
  stroke-miterlimit:10;
  animation: show 4s;
  animation-fill-mode: forwards;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out; 
}
#blue {
  fill: none;
  opacity: 0.15;
  stroke: #fdc5a7;
  stroke-width: 12;
  stroke-miterlimit:10;
  animation: show 4s;
  animation-fill-mode: forwards;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out; 
}
#light-blue {
  fill: none;
  opacity: 0.20;
  stroke: #e57777;
  stroke-width: 6;
  stroke-miterlimit:10;
  stroke-dasharray: 200;
  stroke-dashoffset: 800;
  animation: draw 4s;
  animation-fill-mode: forwards;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;    
}
@keyframes draw {
  to {
    stroke-dashoffset: 0;
  }
}
@keyframes show {
  0% {
    opacity: 0.15;
  }
  50% {
    opacity: 0.25;
  }
  100% {
    opacity: 0.15;
  }
}
@media all and (-ms-high-contrast:none){
#home-anim {display: none;}
    #fakeloader{
    background-image: url(./Dup/img/load_bg.png);
    background-size: cover;
    background-position: center;
}
}