﻿@import url('https://fonts.googleapis.com/css2?family=Hina+Mincho&display=swap');
.font1,#pc_tel .fs_wrap,#pc_intro h2,#contents h3,#page_title h2,#footer_txt h3,#sp_info h3{
        font-family: 'Hina Mincho', "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho",serif;
}


/*--all page--------------------------------------------
---------------------------------------------------------*/
#wrap{
   border-right:0;
}
header{
   background-image:url(./Dup/bg.jpg);
   background-size:cover;
}
#main_left{
   border-right:0;
}
#main_right{
    border-bottom:0;
    border-top:0;
    
}
#top_header h1 img{
     display: block;
    width: 550px;
    margin: auto;
}
#left_bar #menu_bt{
   z-index:3;
}
#footer_txt .tel a{
    font-size:1.3rem;
    text-decoration:underline;
}
#footer_txt h3{
   font-size:1.5rem;
}
.links_bt:hover{
   transform:translateY(-3px);
   transition:all 0.5s;
}
.linkStyle{
    color:#884b02;
    text-decoration:underline;
}
.linkStyle:hover{
    transition:all 0.3s ease;
    opacity:0.7;
}

/* ローダー */
#loader{
	z-index:9999;
	top:0;
	left:0;
}
.load_logo{
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
}


/*--top page--------------------------------------------
---------------------------------------------------------*/
#main_right header,/* #main_right main #page_container, */#page_title {
    padding-right: 0;
}
#top_header{background-color:transparent!important;}
.catch{
    width:33vw;
    margin-bottom:10px;
}
.musubi{
   height:10vh;
}
/*ローディング後にフェードイン*/
.load-fade {opacity : 0; transition : all 2s/*処理にかかる時間*/;}
.load-fade2 {opacity : 0; transition : all 5s/*処理にかかる時間*/;}
.load-fade.done,.load-fade2.done{opacity : 1; transform : translate(0, 0);}
#top_link .links_bt{
    width:25%!important;
    position:relative;
}
/* じわっと出現 */
.load-blurTrigger{
    opacity: 0;
}
.load-blur{
  animation-name:load-blurAnime;
  animation-duration:2s;
  animation-fill-mode:forwards;
}
@keyframes load-blurAnime{
  from {
  filter: blur(10px);
  transform: scale(1.02);
  opacity: 0;
  }

  to {
  filter: blur(0);
  transform: scale(1);
  opacity: 1;
  }
}
#pc_tel .fs_wrap a{
   color:#333;
   text-shadow:none;
}
#pc_intro,#pc_news{
   background-image:url(./Dup/bg.jpg);
   background-size:cover;
}

#pc_intro h2{
   font-size:2rem;
   text-align:center;
}
#pc_intro h3{
   width:45%!important;
}
#contents{margin-bottom:0;}
#contents .box_txt{
   background-color:white;
}
#pc_news{
   padding-top:100px;
}


/*--under page--------------------------------------------
---------------------------------------------------------*/
#page_container{
   background-image:url(./Dup/bg.jpg);
   background-size:contain;
}
#page_title{
    background-image:url(./Dup/page_title.jpg);
    background-size:cover;
    position:relative;
}
#page_title::before{
    content:'';
    position:absolute;
    display:block;
    width:100%;
    height:100%;
    top:0;
    left:0;
    background-color:rgba(115,98,66,0.4);
    z-index:1;
}
#page_title figure,#page_title h2{
  position:relative;
  z-index:2;
}
#page_title figure{
  margin-bottom:0;
}
#cms_2-c .box_item{
  background-color:rgba(255,255,255,0.7);
  width:100%;
}
#page10 .box_wrap{
  background-color:transparent;
}


/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
#loader .load_logo figure{
   width:300px;
}
header{
   background-image:none;
}
#top_header{
   background-color:rgba(255,255,255,0.7)!important;
}
#top_header h1 img{
   width: 250px;
}
.catch {
    width: 47vw;
}
header #top_link .links_bt{
    top: 35%!important;
    left: 30%!important;
    width: 40%!important;
}
#contents h3, #contents figure {
    margin-bottom: 5vh;
}
#sp_info{
    text-align: center;
}
#sp_info h3{
   font-size:1.5rem;
}
#sp_info .tel a{
   font-size:1.2rem;
   text-decoration:underline;
}
}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
#loader .load_logo figure{
   width:200px;
}
#top_header h1 img {
    width: 170px;
}
.catch {
    width: 65vw;
}
.musubi {
    height: 7vh;
}
#contents h3{
   letter-spacing: 0px;
}
#link_bt.links_bt{
   bottom: 102%;
}
}

/* ---------- IEの処理 ---------- */
@media all and (-ms-high-contrast: none){
.contact_box a{
    padding-top:35px;
}
}



/* color */
body,.txt_color_nomal{color: #333333;}
.txt_white{color: white;}
.txt_red{color: red;}
.txt_color1{color: #333} /* メインカラー */
.txt_color2{color: #6d592e} /* サブカラー */
.txt_color3{color: #D3AC2F} /* アクセントカラー1 */
.txt_color4{color: #FFF7F0} /* アクセントカラー2 */

/* background-color */
.bg_white{background-color: white} /* 白背景 */
.bg_black{background-color: black} /* 黒背景 */
.bg_color1{background-color: #D3AC2F} /* メインカラー */
.bg_color2{background-color: #E2D7BF} /* サブカラー */
.bg_color3{background-color: #D3AC2F} /* アクセントカラー1 */
.bg_color4{background-color: #64bdae} /* アクセントカラー2 */
.bg_color_clear{background-color: transparent!important}


/* border-color ※!important */
.border_color1{border-color: #333}
/*.border_color2{border-color: #E2D7BF}*/
.border_color2{border-color: transparent;}
.border_color3{border-color: #D3AC2F}
.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: #333} /* メインカラー */
.hvr_txt_color2:hover{color: #6d592e} /* サブカラー */
.hvr_txt_color3:hover{color: #D3AC2F} /* アクセントカラー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: #333} /* メインカラー */
.hvr_bg_color2:hover{background-color: #E2D7BF} /* サブカラー */
.hvr_bg_color3:hover{background-color: #D3AC2F} /* アクセントカラー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: #333}
.hvr_border_color2:hover{border-color: #E2D7BF}
.hvr_border_color3:hover{border-color: #D3AC2F}
.hvr_border_color4:hover{border-color: #FFF7F0}

