﻿@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Jost:wght@300;400&display=swap');

#main_menu ul li a p:not(.menu_sub_title){
	font-family: 'Jost', "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif"!important;
	font-size: -webkit-calc(1rem);
	font-size: calc(1rem);
}
#main_menu ul li a p.menu_sub_title{
	font-size: -webkit-calc(1rem - 2px);
    font-size: calc(1rem - 2px);
}
#aisatsu h2,.contents_box h2{
	font-family: "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif"!important;
}
#aisatsu h2:before {
    font-family: "Cinzel","游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif"!important;
}
.page_title h2,#f_menu ul li a,#top_cms h2{
	font-family: 'Jost',"游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight: normal;
}
header{padding-top: 30px;}


/* anim ---------------------------------------------------------------------------------------------*/
#fakeloader::before {
    display: block;
    content: "";
    width: 50%;
    height: 100%;
    background: #463b34;
    position: absolute;
    top: 0;
    right: 0;
}
#fakeloader::after{
    display: block;
    content: "";
    width: 50%;
    height: 100%;
    background: #44362e;
    position: absolute;
    top: 0;
    left: 0;
}

#aisatsu h2.txtin,#aisatsu p.txtin{opacity: 0}
#fakeloader .fl,#aisatsu h2.txtin.start,#aisatsu p.txtin.start{
	animation-name: loader;
	animation-duration: 1.5s;
	animation-timing-function: ease;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
	overflow: hidden;
	z-index: 2;
}
#aisatsu h2.txtin.start,#aisatsu p.txtin.start{animation-direction: .5s}
@keyframes loader {
	0% {opacity: 0;}
	100% {opacity: 1;}
}

#aisatsu > div{background-color: rgba(59,46,38,0.82)!important;}
#fakeloader::before,#aisatsu > div.fadein::before{transform: translateY(-100%);}
#fakeloader::after{transform: translateY(100%);}
#aisatsu > div:not(.bg_box){overflow: hidden}
#fakeloader::before,#fakeloader::after,#aisatsu > div:not(.bg_box).fadein.start::before{
	z-index: 1;
	animation-name: loader1;
	animation-duration: .8s;
	animation-timing-function: linear;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}
#fakeloader::after{animation-name: loader2;}
@keyframes loader1 {
	0% {transform: translateY(-100%);}
	100% {transform: matrix(1, 0, 0, 1, 0, 0);}
}
@keyframes loader2 {
	0% {transform: translateY(100%);}
	100% {transform: matrix(1, 0, 0, 1, 0, 0);}
}
@keyframes loader1_ie {
	0% {transform: translateY(-100%);}
	100% {transform: translateY(0);}
}
@keyframes loader2_ie {
	0% {transform: translateY(100%);}
	100% {transform: translateY(0);}
}

#logo img{width: 339px;}
#fakeloader .fl{max-width: 400px!important;}
#logo2 img{max-width: 300px;}




/* color ---------------------------------------------------------------------------------------------*/
.linkStyle{color: #fff;transition: opacity .3s}
.linkStyle:hover{opacity: 0.7}
body,.txt_color_nomal{color: #fff;}
.txt_white{color: #ffffff;}
.contents_box .txt_white{color: #fff;}
.txt_red{color: red;}
.txt_color1{color: #ffffff} /* メインカラー */
.txt_color2{color: #b39b7a} /* サブカラー */
.txt_color3{color: #a69b85} /* アクセントカラー1 */
.txt_color4{color: #9e7a5a} /* アクセントカラー2 */

/* background-color */
.bg_white{background-color: white} /* 白背景 */
.bg_black{background-color: black} /* 黒背景 */
.bg_color1{background-color: #3A2D25} /* メインカラー */
.bg_color2{background-color: #332d29} /* サブカラー */
.bg_color3{background-color: #a69b85} /* アクセントカラー1 */
.bg_color4{background-color: #9e7a5a} /* アクセントカラー2 */
.bg_color_clear{background-color: transparent!important}

/* border-color ※!important */
.border_color1{border-color: #827563}
.border_color2{border-color: #827563}
.border_color3{border-color: #a69b85}
.border_color4{border-color: #827563}

.hvr_txt_color_nomal:hover{color: #fff;}
.hvr_txt_white:hover{color: #ffffff;}
.hvr_txt_red:hover{color: red;}
.hvr_txt_color1:hover{color: #3A2D25} /* メインカラー */
.hvr_txt_color2:hover{color: #332d29} /* サブカラー */
.hvr_txt_color3:hover{color: #a69b85} /* アクセントカラー1 */
.hvr_txt_color4:hover{color: #9e7a5a} /* アクセントカラー2 */

/* background-color */
.hvr_bg_white:hover{background-color: white} /* 白背景 */
.hvr_bg_black:hover{background-color: black} /* 黒背景 */
.hvr_bg_color1:hover{background-color: #3A2D25} /* メインカラー */
.hvr_bg_color2:hover{background-color: #dbd9d3} /* サブカラー */
.hvr_bg_color3:hover{background-color: #a69b85} /* アクセントカラー1 */
.hvr_bg_color4:hover{background-color: #a69b85} /* アクセントカラー2 */
.hvr_bg_color_clear:hover{background-color: transparent!important}

/* border-color ※!important */
.hvr_border_color1:hover{border-color: #3A2D25}
.hvr_border_color2:hover{border-color: #827563}
.hvr_border_color3:hover{border-color: #a69b85}
.hvr_border_color4:hover{border-color: #827563}
#page-top a{background-color: #3A2D25;}
#wrap{background-color: #25201c;}


/* all ---------------------------------------------------------------------------------------------*/
.fas.fa-envelope.pd_r-10px.border_so1-r.border_color4{display: none;}
.contents_img,.contents_box{width: 70%!important;}
.contents_box{margin-left: 30%!important;}

#main_menu.fixed{border-bottom: 1px solid #827563;}
#main_menu.fixed ul li a,#main_menu.fixed ul li a .txt_color2{color: #fff!important;}

#page-top a {background-color: #3A2D25;}
#fixed_right_banner > *{background-color: #3a2d25!important;padding: 5px 0;}
#fixed_right_banner li {
    padding: 5px;
    padding-top: 8px;
    padding-bottom: 8px;
}
.error_message,.end_message{color: red!important;}
#info_map{background-color: rgba(134,127,119,0.14);}


/* aisatu */
#aisatsu{max-width: 100%!important;background-position: center;}
#aisatsu .bg_box {
    background-image: url(../dup/img/bg2.png), url(../dup/img/bg3.png);
    background-repeat: no-repeat;
    background-position: center top 20px, center bottom 20px;
    background-size: 98% auto;
}
#aisatsu h2,#aisatsu p{width: 95%;}

#aisatsu > div:not(.bg_box) {position: relative;}

#aisatsu > div:not(.bg_box)::before {
    position: absolute;
    content: "";
    width: 1px;
    height: 80px;
    background-color: #fff;
    left: 0;
    right: 0;
    top: 0;
    margin: auto;
}
#aisatsu h2,#aisatsu p{max-width: 1080px!important;margin: auto;}
#aisatsu h2 {
    position: relative;
    margin: 0 auto 55px;
    letter-spacing: 3px;
    padding-top: 76px;
}
#aisatsu h2:before {
    content: "INTRODUCTION";
    position: absolute;
    display: inline-block;
    top: 0;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    font-size: 29px;
    font-weight: 100;
    color: #fff;
    letter-spacing: 2px;
}


/* contents_box */
.contents_box {
    background-color: transparent;
    background-image: linear-gradient( 135deg, rgba(79,63,49,0.79) 0%, #3A2D25 100%)!important;
}
.contents_box::before {
    width: 100%;
    height: 100%;
    top: 10px;
    left: 10px;
    background-color: transparent;
    border: solid 1px #827563;
}
.contents_box2::before,.contents_box2::after,.contents_box::after{display: none}
.contents_box h2 {
	position: relative;
    padding-bottom: 12px;
    margin-bottom: 25px;
}


/* other */
#main_img2 .page_title {background-color: rgba(240,237,237,0.23)!important;}
.page_title h2{background-color: #3a2d25!important;}
.page_title span{color: #fff;}
footer.border_so1-t{border: none}
#page9 .cate_box a{background-color: #cfc9bc;}
#page10 li a{padding-left: 0;padding-right: 0;letter-spacing: 1px;}



/* cms ---------------------------------------------------------------------------------------------*/
#cms_2-a .cate_box{
	background-color: #332d29;
    padding-bottom: 35px;
    padding-top: 20px;
}
#cms_2-a .box_title1,#cms_6-c .txt_color2{color: #ffffff;}
#cms_2-a .box_txt1{padding-bottom: 0;}
#cms_2-a .cate_box .pd_l-r5per {padding: 0 30px;}
#cms_6-c .circle{background-color: #3a2d25;}
#cms_5-b .cate_box .open_bt .arrow img, .cms_5-b .cate_box .open_bt .arrow img{background-color: #55483c;}
#cms_5-b .cate_box .open_bt .box_title1::before, .cms_5-b .cate_box .open_bt .box_title1::before{color: #fff!important;}



/* IE */
@media all and (-ms-high-contrast: none){
#fakeloader::before,#aisatsu > div:not(.bg_box).fadein.start::before{animation-name: loader1_ie;}
#fakeloader::after{animation-name: loader2_ie;}
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
header{padding-top: 0;}
#logo{padding-left: 15px;}
#logo img {width: 234px;}
#f_menu ul li a{letter-spacing: 0px;font-size: 14px;}
}

/* ---------- スマホ ---------- */
@media screen and (max-width: 667px){
.button_container{top: 22px;}
#fakeloader .fl {width: 67%!important;}
#logo {
    padding-left: 0;
    margin-left: 0;
    margin: auto;
    width: 48.33333%!important;
    max-width: 185px;
    margin-bottom: 20px;
}
#logo img {width: 169px;}
#logo2 img {max-width: 214px;}
	
.bnr{width: 90%;margin-bottom: 20px;}
.overlay{background-color: #25201c;}
.overlay ul li a{ color: #fff!important;}
.overlay ul li a.border_so1 {color: #9e7a5a!important;}

.contents_img,.contents_box{width: 100%!important;}
.contents_box{margin-left: 0%!important;}
.contents_box::before{display: none}	
.contents_box h2::after{width: 100%;}	
	
#aisatsu .bg_box {background-image: none;}
#aisatsu h2 {
    margin: 0 auto 45px;
    letter-spacing: 2px;
    padding-top: 48px;
}
#aisatsu h2:before{font-size: 23px;}

.page_title h2{width: 60%;font-size: -webkit-calc(1rem + 1px);font-size: calc(1rem + 1px);}
#page-top a{width: 40px;height: 40px;}


#cms_2-a .cate_box .pd_l-r5per {padding: 0 15px;}
}

