﻿@import url('https://fonts.googleapis.com/css2?family=Zen+Antique+Soft&display=swap');
.font1,
.font_en,
#main_menu li a{
    font-family: 'Zen Antique Soft', "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif";
}

.linkStyle{
    color:#bf9d74;
    text-decoration:underline;
}
.linkStyle:hover{
    transition:all 0.3s;
    opacity:0.7;
}

.font_22{
    font-size:2rem;
}
.mg_t-150px{
    margin-top:150px;
}
body{
    letter-spacing: 3px;
    line-height: 1.8;
    overflow:hidden;
}


/*--all page---------------------------
-------------------------------------*/
#fakeloader{
	z-index: 9999;
	background-size: 10%;
}
#fakeloader:before{
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgba(255,255,255,0.5);
	position: absolute;
	top: 0;
	left: 0;
}
#fakeloader .fl{
	position: absolute!important;
	top: 50%!important;
	left: 50%!important;
	transform: translate(-50%,-50%)!important;
	width: 50%!important;
	max-width: 250px;
}
#fakeloader .fl{
	animation-name: loader;
	animation-duration: 5s;
	animation-timing-function: ease;
}
@keyframes loader{
	0% {opacity: 0;}
	50% {opacity: 1;}
	100% {opacity: 0;}
}
footer{
    background-image:url(./Dup/img/ft.jpg);
    background-color:transparent;
    background-size:cover;
}
.foot_tel_bt a:hover{
    background-color:#603813;
}

/*--top page---------------------------
-------------------------------------*/
#main_img{
  max-height: initial;
  min-height: auto;
  position:relative;
}
#main_img::before,#main_img::after{
    content:'';
    position:absolute;
    display:block;
    z-index:1;
}
#main_img::before{
    width:100%;
    height:100%;
    background-color:rgba(0,0,0,0.1);
    top:0;
    left:0;
}
#main_img::after{
    width:100%;
    height:75px;
    background-image:url(./Dup/img/bg.png);
    background-size: cover;
    bottom:0;
    left:0;
}
#main_img .txt1{
    z-index:2;
}
/*ローディング後にフェードイン*/
.load-fade {opacity : 0; transition : all 4s/*処理にかかる時間*/;}
.load-fade.done{opacity : 1; transform : translate(0, 0);}

/*下からフェードイン*/
 .fadein {
  opacity: 0;
  transform : translate(0, 50px);
  transition : all 2500ms;
}
.fadein.scrollin{
  opacity: 1;
  transform: translate(0, 0);
}

#contents1{
    position:relative;
}
.ohashi{
    position:absolute;
    width:32vw;
    top:-70px;
    right:-100px;
    z-index:1;
}
#contents2{
    margin-top:50px;
    margin-bottom:50px;
}
#contents3{
    position:relative;
    padding-bottom:200px;
}
#contents3 h3{
    font-size:1.5rem;
}
.oshibori{
    position:absolute;
    width:28vw;
    bottom:-140px;
    right:-100px;
    z-index:-1;
}
/*img filter*/
.img5,.img6,.img7{
    position:relative;
}
.img5:before,
.img6::before,
.img7::before{
    content:'';
    position:absolute;
    display:block;
    width:100%;
    height:100%;
    background-color:rgba(0,0,0,0.1);
    top:0;
    left:0;
    z-index:1;
}
/*--under page---------------------------
-------------------------------------*/




/* ---------- responsive ---------- */
@media screen and (max-width: 910px){
#main_img .txt1{
    font-size: 1.8rem;
}    
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
.mg_t-30px_tb{
    margin-top:30px;
}
.txt1{
    top:10%;
}
.ohashi{
    width:72vw;
}
#attach{
    height:0;
}
#contents3{
    padding-bottom:50px;
}
.oshibori{
    width:35vw;
    bottom:-130px;
    right:-30px;
}


}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
.txt1{
    font-size:1.5rem;
    text-align:center;
    top:23%;
}
.txt2,.txt4{
    font-size:1.5rem;
}
.ohashi{
    width:82vw;
    top:-55px;
}
.oshibori{
    width:55vw;
    bottom:-80px;
}
#page_title h2{
    letter-spacing: 2px;
}
}

/* ---------- IEの処理 ---------- */
@media all and (-ms-high-contrast: none){
.pc_box .contact_bt a{
    padding:15px 0 15px;
}
.more a{
    padding-top:8px;
}
#cms_6-a .cate .cate_title{
    padding-top:10px!important;
}
#contact_tel a{
    padding-top:35px;
}
#page10 ul li a{
    padding:12px 0 12px;
}
#main_menu ul li a::before{
    top:50%!important;
}
}


