@charset "utf-8";
/* CSS Document */

/***　全ページ　***/

*:focus {outline:none;}
html{overflow-y: scroll}
html, body{font-size: 14px;}
body{
	-webkit-text-size-adjust: 100%;
	font-family: 'Noto Sans JP', "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif;
}
.font_serif{font-family: 'Noto Serif JP', "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif";}

input[type="submit"],
input[type="button"] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  border: none;
  box-sizing: border-box;
  cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
  display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
  outline-offset: -2px;
}

#page-top{
	right: 50px;
	z-index: 2
}
#page-top a{
	width: 50px;
	height: 50px;
	transform: rotate(45deg);
}
#page-top a:hover{transform: translateY(-5px) rotate(45deg)}
#page-top a::before{
	width: 10px;
	height: 10px;
	top: 20px;
	left: 20px;
	border-left: solid 1px #fff;
	border-top: solid 1px #fff
}

.linkStyle{transition: 0.5s;color: #AA8243}
.linkStyle:hover{opacity: 0.7}
textarea{overflow: auto}
#wrap{background-color: #0F0F0F}
#wrap::before{
	content: "";
	width: 100%;
	height: 100px;
	position: fixed;
	left: 0;
	bottom: 0;
	background: linear-gradient(to bottom, rgba(15,15,15,0), rgba(15,15,15,1));
	z-index: 2;
	pointer-events: none
}

.hvr_trans:hover{transform: translateY(-5px)}

#loader span{left: 0;height: 51%}
#loader span.load_top{top: 0}
#loader span.load_bottom{bottom: 0}
#loader img{z-index: 1}

.under_page{
	opacity: 0;
	transform: translateY(10px);
	transition: 1s
}
.under_page.fadepage{
	opacity: 1;
	transform: translateY(0)
}

#header::before, #menu_bt .menu_stick span::before, #menu_bt .menu_stick span::after, #sp_nav .sp_nav_box .txt_color3::before, #top_contents1::before, #main_img::before, #intro .intro_txt_wrap::before, #intro .intro_txt_wrap::after, #intro .intro_title::before, #top_contents2 .con2_title::before, .more a::before, .more a::after, #top_cms .cms_title::before, #top_bt a::before, #footer_sns2 a::before, #footer_nav li:not(:last-child)::before, footer::before, #page-top a::before, #page_title::before, #page04 .box_title2::before, #page05 .date::before, #pager li.prev a::before, #pager li.next a::before, .cate_title::before, #page02 .box_title1::before, #page02 .cate_txt1::before{
	position: absolute;
	content: "";
	display: block;
	pointer-events: none
}

/***　ヘッダー　***/

#header{
	top: 0;
	left: 0;
	background-color: rgba(51,51,51,0.9);
	z-index: 3
}
#header::before{
	width: 100%;
	height: 50px;
	background-image: url("../img/header_bg.png");
	background-size: 100% 100%;
	left: 0;
	bottom: -50px
}

#menu_bt{cursor: pointer;z-index: 6}
#menu_bt.trans .open{opacity: 0}
#menu_bt.trans .close{opacity: 1}
#menu_bt .menu_stick span, #menu_bt .menu_stick span::before, #menu_bt .menu_stick span::after{
	height: 1px;
	width: 30px;
	background-color: currentColor;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}
#menu_bt .menu_stick span::before{top: -15px;transition: 0.5s}
#menu_bt .menu_stick span::after{bottom: -15px;transition: 0.5s}
#menu_bt.trans .menu_stick span{background-color: transparent}
#menu_bt.trans .menu_stick span::before{transform: rotate(225deg);top: 0}
#menu_bt.trans .menu_stick span::after{transform: rotate(-225deg);bottom: 0}
#sp_nav{
	z-index: 5;
	left: 0;
	top: 0;
	box-sizing: border-box;
}
#sp_nav .sp_nav_box .txt_color3{position: relative}
#sp_nav .sp_nav_box .txt_color3::before{
	width: 30px;
	height: 1px;
	background-color: #AA8243;
	left: -50px;
	top: 0;
	bottom: 0;
	margin: auto;
}
#sp_nav .nav_bg{
	top: 0;
	right: 0;
	left: 0;
	cursor: pointer
}
#sp_nav sp_nav_box{
	overflow-y: auto;
}
#sp_nav ul{
	top: 0;
	right: -300px;
	box-sizing: border-box;
}


/***　フッター　***/

footer::before{
	width: 100%;
	height: 50px;
	background-image: url(../img/footer_bg.png);
	background-size: 100% 100%;
	left: 0;
	top: -50px
}
#footer_sns2 a{
	background-color: rgba(255,255,255,0.05);
	border-color: transparent
}
#footer_sns2 a:hover{
	background-color: transparent;
	border-color: #fff
}
#footer_sns2 a::before{
	width: 30px;
	height: 1px;
	top: 0;
	bottom: 0;
	right: 0;
	margin: auto;
	background-color: #fff
}
#footer_nav li:not(:last-child)::before{
	width: 1px;
	height: 100%;
	top: 0;
	right: 0;
	background-color: #fff;
	transform: rotate(20deg)
}
.footer_map iframe, .info_map iframe{height: 400px}

/***　index　***/

.fadein{
	position: relative;
	top: 20px;
	transition: 1s;
	opacity: 0
}
.fadein.trans{
	top: 0;
	opacity: 1
}
.more a{background-color: rgba(255,255,255,0.05)}
.more a span{z-index: 1}
.more a::before, .more a::after{
	width: 10px;
	height: 100%;
	top: 0;
	bottom: 0;
	margin: auto;
	border-top: solid 1px #AA8243;
	border-bottom: solid 1px #AA8243;
	transition: 0.3s;
	box-sizing: border-box
}
.more a::before{
	border-left: solid 1px #AA8243;
	left: 0
}
.more a::after{
	border-right: solid 1px #AA8243;
	right: 0
}
.more a:hover{padding-right: 20px}
.more a:hover::before{
	border-color: transparent;
	background-color: #333333;
	width: 100%
}
.more a:hover::after{
	width: 30px;
	height: 0;
	border-top-color: transparent
}

#main_img::before{
	background: linear-gradient(to bottom, rgba(15,15,15,1), rgba(15,15,15,0));
	width: 100%;
	height: 100px;
	top: 0;
	left: 0;
	z-index: 2
}
#intro .intro_txt_wrap{background-image: url(../img/bg_img4.png)}
#intro .intro_txt_wrap::before{
	width: 680px;
	height: 120px;
	background-image: url(../img/logo2.png);
	background-size: contain;
	background-repeat: no-repeat;
	right: 0;
	bottom: -30px;
	z-index: 2
}
#intro .intro_txt_wrap::after{
	width: 50px;
	height: 100%;
	top: 0;
	left: -49px;
	background-image: url(../img/bg_img3.png);
	background-size: 100% 100%;
	z-index: 1
}
#intro .intro_title::before, #top_cms .cms_title::before{
	width: 40px;
	height: 1px;
	background-color: #fff;
	bottom: 0;
	left: 0
}

#top_contents1::before{
	width: 100%;
	height: 100px;
	background-image: url(../img/bg_img2.png);
	background-size: 100% 100%;
	left: 0;
	bottom: 0
}

#top_contents2 .con2_title::before{
	width: 50px;
	height: 1px;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	background-color: #fff
}
#top_contents2 .con2_img:hover{background-color: rgba(255,255,255,0.05)}

#top_cms{
	background-image: url(../img/bg_img5.png);
	background-size: 50%
}
#top_blog .cate_box a:hover{background-color: rgba(255,255,255,0.05)}
#top_gallery .cate_box .box_img1:hover{transform: scale(1.05,1.05)}
#top_gallery.animation .cms_wrap:nth-child(1){
	animation: loop 60s -30s linear infinite;
	transform: translateX(100%)
}
#top_gallery.animation .cms_wrap:nth-child(2){
	position: absolute;
	top: 0;
	left: 0;
	animation: loop 60s linear infinite;
	transform: translateX(100%)
}
#top_gallery .gallery_box:hover .cms_wrap{animation-play-state: paused}
@keyframes loop {
	0%		{transform: translateX(100%)}
	100%	{transform: translateX(-100%)}
}

#top_bt a::before{
	width: 1px;
	height: 50px;
	left: 0;
	right: 0;
	top: 0;
	margin: auto;
	background-color: #fff
}
#top_bt .info_bt .bt_bg{background-image: url(../img/bt_bg1.jpg);background-position: 50% 80%}
#top_bt .contact_bt .bt_bg{background-image: url(../img/bt_bg2.jpg);background-position: 50% 80%}
#top_bt a:hover .bt_bg{transform: translate(-50%,-50%) scale(1.05,1.05);opacity: 0.4}

/***　page_title / pager / cate_list　***/

#page_title::before{
	width: 100%;
	height: 80%;
	left: 0;
	bottom: -1px;
	background: linear-gradient(to bottom, rgba(15,15,15,0), rgba(15,15,15,1))
}

#pager li{margin: 0 5px}
#pager a{
	width: 50px;
	height: 50px;
	line-height: 50px;
	background-color: #1A1A1A;
	color: #fff;
	transition: 0.5s;
	display: block;
	position: relative;
}
#pager li.prev a, #pager li.next a{background-color: transparent;}
#pager a:hover{background-color: #AA8243;}
#pager li.prev a:hover, #pager li.next a:hover{background-color: #AA8243}
#pager li.page-selection a{background-color: #AA8243;color: #fff}
#pager li.prev a::before,#pager li.next a::before{
	width: 10px;
	height: 10px;
	border-top: solid 1px;
	border-right: solid 1px;
	top: 0;
	left: 0;
	bottom: 0;
	right: 5px;
	margin: auto;
	transform: rotate(45deg);
}
#pager li.prev a::before{
	right: 0;
	left: 5px;
	transform: rotate(-135deg);
}

#cate_list li:last-child{border-right: solid 1px}

/***　page02　***/

.cate_title::before{
	width: 1px;
	height: 50px;
	left: 0;
	right: 0;
	bottom: -25px;
	background-color: #fff;
	margin: auto;
	z-index: 1
}
#page02 .box_title1::before{
	width: 40px;
	height: 1px;
	bottom: -1px;
	left: 0;
	background-color: #AA8243
}
#page02 .cate_txt1::before{
	top: 10px;
	right: 10px;
	left: 10px;
	bottom: 10px;
	border: solid 1px #0F0F0F;
	pointer-events: none
}

/***　page04　***/

#page04 .cate_box:nth-child(even){flex-direction: row-reverse}
#page04 .cate_box:nth-child(even) .box_img1{
	padding-right: 0;
	padding-left: 20px
}
#page04 .cate_box:nth-child(even) .box_item{
	padding-left: 0;
	padding-right: 20px
}
#page04 .box_title2::before{
	width: 40px;
	height: 1px;
	background-color: #fff;
	left: 0;
	bottom: 0
}
#page04 .no_pd{padding: 0!important}

/***　page5　***/

#page05 .date::before{
	width: 100%;
	height: 1px;
	left: 0;
	top: -31px;
	background-color: #AA8243
}

/***　page08　***/

#page08 input[type="text"]:focus, #page08 textarea:focus{background-color: #fff}

/***　page09　***/

#page09 a{padding-bottom: 3px}

/***　IE対処　***/

@media all and (-ms-high-contrast:none) {
input[type='submit'], input[type='button']{padding-top: 25px}
}

/* 文字間隔 */
/* default 1px */
.letter_0{letter-spacing: 0;}
.letter_1{letter-spacing: 0.1em;}
.letter_2{letter-spacing: 0.2em;}
.letter_3{letter-spacing: 0.3em;}
.letter_4{letter-spacing: 0.4em;}
.letter_5{letter-spacing: 0.5em;}
.letter_6{letter-spacing: 0.6em;}
.letter_7{letter-spacing: 0.7em;}
.letter_8{letter-spacing: 0.8em;}
.letter_9{letter-spacing: 0.9em;}
.letter_10{letter-spacing: 1em;}

.float_right{
	float: right
}
.float_left{
	float: left
}
.float_clear{
	float: none
}
.clearfix::after{
	clear:both;
	content:".";
	visibility:hidden;
	display:block;
	height:0;
}
/*ここからタブレット用（780px以下）環境の設定
---------------------------------------------------------------------------*/
/*表示を切り替えるウィンドウサイズの指定*/
@media screen and (max-width: 768px){
	
.hvr_trans:hover{transform: none}
#header::before{
	height: 6vw;
	bottom: -6vw
}
footer::before{
	height: 6vw;
	top: -6vw
}
#intro .fadein{
	top: 0;
	opacity: 1
}
.more a::before{
	border-left: solid 1px #AA8243;
	left: 0
}
.more a::after{
	border-right: solid 1px #AA8243;
	right: 0
}
.more a:hover{padding-right: 0}
.more a:hover::before, .more a:hover::after{
	border-color: #AA8243;
	background-color: transparent;
	width: 10px;
	height: 100%
}
#main_img{height: 60vw!important}
#main_img::before{top: 49px}
#top_gallery .cate_box .box_img1:hover{transform: none}
#top_gallery .cms_wrap{width: 1000px!important}
#top_gallery.animation .cms_wrap:nth-child(1){animation: loop2 60s linear infinite;}
#top_gallery.animation .cms_wrap:nth-child(2){
	animation: loop2 60s -30s linear infinite;
	transform: translateX(1000px);
}
#top_bt a:hover .bt_bg{transform: translate(-50%,-50%);opacity: 0.6}
	
#page04 .cate_box:nth-child(even) .box_img1{padding-left: 10px}
#page04 .cate_box:nth-child(even) .box_item{padding-right: 10px}
	
#pager li.prev a, #pager li.next a{background-color: #AA8243}
#pager li:not(.prev):not(.next){
	display: none;
}

/* 文字間隔 */
/* default 1px */
.letter_0_tb{letter-spacing: 0;}
.letter_1_tb{letter-spacing: 0.1em;}
.letter_2_tb{letter-spacing: 0.2em;}
.letter_3_tb{letter-spacing: 0.3em;}
.letter_4_tb{letter-spacing: 0.4em;}
.letter_5_tb{letter-spacing: 0.5em;}
.letter_6_tb{letter-spacing: 0.6em;}
.letter_7_tb{letter-spacing: 0.7em;}
.letter_8_tb{letter-spacing: 0.8em;}
.letter_9_tb{letter-spacing: 0.9em;}
.letter_10_tb{letter-spacing: 1em;}

.float_right_tb{
	float: right
}
.float_left_tb{
	float: left
}
.float_clear_tb{
	float: none
}
.clearfix_tb::after{
	clear:both;
	content:".";
	visibility:hidden;
	display:block;
	height:0;
}
}

/*ここからスマホ用（750px以下）環境の設定
---------------------------------------------------------------------------*/
/*表示を切り替えるウィンドウサイズの指定*/
@media screen and (max-width: 667px){
	
#page-top{right: 20px}
#intro .intro_img{height: 60vw}
#intro .intro_txt_wrap::before{
	width: 340px;
	height: 60px;
	bottom: -40px
}
#intro .intro_txt_wrap::after{
	width: 100%;
	height: 10vw;
	top: auto;
	bottom: -10vw;
	left: 0;
	background-image: url(../img/bg_img3_sp.png);
}
#top_contents1::before{height: 10vw;}
#top_cms{background-size: 100%}
#page04 .cate_box:nth-child(even) .box_img1, #page04 .cate_box:nth-child(even) .box_item{
	padding-left: 0;
	padding-right: 0
}
#cate_list a{background-color: #1A1A1A}
#cate_list li:last-child{border-right: none}

/* 文字間隔 */
/* default 1px */
.letter_0_sp{letter-spacing: 0;}
.letter_1_sp{letter-spacing: 0.1em;}
.letter_2_sp{letter-spacing: 0.2em;}
.letter_3_sp{letter-spacing: 0.3em;}
.letter_4_sp{letter-spacing: 0.4em;}
.letter_5_sp{letter-spacing: 0.5em;}
.letter_6_sp{letter-spacing: 0.6em;}
.letter_7_sp{letter-spacing: 0.7em;}
.letter_8_sp{letter-spacing: 0.8em;}
.letter_9_sp{letter-spacing: 0.9em;}
.letter_10_sp{letter-spacing: 1em;}

.float_right_sp{
	float: right
}
.float_left_sp{
	float: left
}
.float_clear_sp{
	float: none
}
.clearfix_sp::after{
	clear:both;
	content:".";
	visibility:hidden;
	display:block;
	height:0;
}
}
@keyframes loop2 {
	0%		{transform: translateX(1000px)}
	100%	{transform: translateX(-1000px)}
}