/*=================================================
 * CSS for PC
 * ================================================= */

/***************************************
TITLE
****************************************/

.s_title{
	position: relative;
	height: 60px;
	font-size: 11px;
	font-weight: normal;
	line-height: 12px;
	text-align: center;
	padding-top: 10px;
	margin-bottom: 0;
	color: #ffffff;
	background: #231d16; /* Old browsers */
	background: -moz-linear-gradient(left, #231d16 20%, #352d22 50%, #231d16 80%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, #231d16 20%,#352d22 50%,#231d16 80%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #231d16 20%,#352d22 50%,#231d16 80%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#231d16', endColorstr='#231d16',GradientType=1 ); /* IE6-9 */
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.s_title:after{
	content: '';
	width: 100%;
	height: 1px;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#4d4223+1,e6e0ca+50,4d4223+100 */
	background: #4d4223; /* Old browsers */
	background: -moz-linear-gradient(left, #4d4223 1%, #e6e0ca 50%, #4d4223 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, #4d4223 1%,#e6e0ca 50%,#4d4223 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #4d4223 1%,#e6e0ca 50%,#4d4223 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4d4223', endColorstr='#4d4223',GradientType=1 ); /* IE6-9 */
	position: absolute;
	bottom: 0;
	left: 0;
}
.s_title em{
	position: relative;
	display: inline-block;
	vertical-align: top;
	font-family: "FontA";
	font-size: 24px;
	line-height: 24px;
}
.s_title em:before{
	position:absolute;
	top:0;
	left:0;
	display:block;
	content:attr(title);
	color:#b5aa89;
	-webkit-mask-image:-webkit-linear-gradient(top, rgba(181,170,137,0) 20%, rgba(181,170,137,1) 40%, rgba(181,170,137,0) 80%);
}
.s_title span{
	position: relative;
	display: inline-block;
	vertical-align: top;
	font-size: 12px;
	font-weight: normal;
	line-height: 14px;
}

.ss_title{
	text-align: center;
	padding: 3px;
	background: #23b8a1;
	border: 1px solid #23b8a1;
	box-shadow:0px 0px 0px 1px #91dcd0 inset;
	-moz-box-shadow:0px 0px 0px 1px #91dcd0 inset;
	-webkit-box-shadow:0px 0px 0px 1px #91dcd0 inset;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

.ss_title span{
	display: block;
	font-size: 16px;
	font-weight: bold;
	line-height: 20px;
	color: #fff;
	background: #2dc7af;
	padding: 11px 0;
	border-radius: 21px;
}


/***************************************
MAIN CONTENTS
****************************************/

.main_bg{
	padding: 15px;
	background-color: #17130e;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

.main{
	background-color: rgba(0, 0, 0, 1);
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}


/***************************************
COMMON STYLE
****************************************/

/***** font color *****/
a, a:hover, .tx_a, .tx_a:hover{	color: #baab97;}
body, .tx0, .tx0:hover{	color: #fff;}
  .tx1, .tx1:hover{	color: #c1b07b;}
  .tx2, .tx2:hover{	color: rgba(255,255,255,0.8);}
  .tx3, .tx3:hover{	color: #e5dec8;}
.tx4, .tx4:hover{	color: #ffea00;}


.sat{	color	: #0066ff;}
.sun{	color	: #ff0000;}
.tel, .tel a{	color: #c1b07b !important;}
.mail, .mail a{	color: #baab97;}


/***** border color *****/
  .bd1{	border-color: #17130e;}
  .bd2{	border-color: #231d16;}
  .bd3{	border-color: #222222;}
  .bd4{	border-color: #231d16;}
  .bd5{	border-color: #222222;}
  .bd6{	border-color: #736437;}
.bd7{	border-color: #e7d06f;}


/***** bg color *****/
  .bg1{	background-color: rgba(0, 0, 0, 1);}
.bg2{	background-color: rgba(0, 0, 0, 1);}
  .bg3{	background-color: #000000;}
.bg4{	background-color: rgba(255, 255, 255, 0.7);}
.bg5{	background-color: #f5f5f5;}
  .bg6{	background-color: #231d16;}
  .bg7{	background-color: #17130e;}
.bg8{	background-color: #c99200;}
.bg9{	background-color: #000000;}
.bg10{	background-color: rgba(21, 21, 21, 0.9);}


/***** dotbg color *****/
.dotbg1{
	background: #231d16;
}


/***** inset *****/
  .in1{
	box-shadow:0px 0px 0px 1px #4d4223 inset;
	-moz-box-shadow:0px 0px 0px 1px #4d4223 inset;
	-webkit-box-shadow:0px 0px 0px 1px #4d4223 inset;
}
.in2{
	box-shadow:0px 0px 0px 1px rgba(0, 0, 0, 0.2) inset;
	-moz-box-shadow:0px 0px 0px 1px rgba(0, 0, 0, 0.2) inset;
	-webkit-box-shadow:0px 0px 0px 1px rgba(0, 0, 0, 0.2) inset;
}
.in3{
	box-shadow:0px 0px 0px 1px #000000 inset;
	-moz-box-shadow:0px 0px 0px 1px #000000 inset;
	-webkit-box-shadow:0px 0px 0px 1px #000000 inset;
}


/***** gradation *****/
.gr1{
	background: #000000;
	background: -moz-linear-gradient(left, #000000 0%, #151515 50%, #000000 100%);
	background: -webkit-linear-gradient(left, #000000 0%,#151515 50%,#000000 100%);
	background: linear-gradient(to right, #000000 0%,#151515 50%,#000000 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000',GradientType=1 );
}
  .gr2{
	background: #736437;
}

/***** buttun *****/
.bt1{
	display: block;
	font-size: 16px;
	font-weight: bold;
	font-family		: Meiryo, "MS PGothic", Osaka, sans-serif;
	line-height: 28px;
	text-align: center;
	padding: 10px 0;
	color: #ffffff;
	border: 2px solid #95834C;
background: #736437;
background: -moz-linear-gradient(top, #736437 0%, #95834c 50%, #736437 100%);
background: -webkit-linear-gradient(top, #736437 0%,#95834c 50%,#736437 100%);
background: linear-gradient(to bottom, #736437 0%,#95834c 50%,#736437 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#736437', endColorstr='#736437',GradientType=0 );
	border-radius: 3px;
	-webkit-transition	: 0.2s ease-in-out;
	-moz-transition	: 0.2s ease-in-out;
	-o-transition	: 0.2s ease-in-out;
	transition		: 0.2s ease-in-out;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

input.bt1{
	width: 100%;
	font-family		: Meiryo, "MS PGothic", Osaka, sans-serif;
	border: 2px solid #95834C;
	color: #ffffff;
background: #736437;
background: -moz-linear-gradient(top, #736437 0%, #95834c 50%, #736437 100%);
background: -webkit-linear-gradient(top, #736437 0%,#95834c 50%,#736437 100%);
background: linear-gradient(to bottom, #736437 0%,#95834c 50%,#736437 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#736437', endColorstr='#736437',GradientType=0 );
	-webkit-appearance: none;
	border-radius: 3px;
	-webkit-transition	: 0.2s ease-in-out;
	-moz-transition	: 0.2s ease-in-out;
	-o-transition	: 0.2s ease-in-out;
	transition		: 0.2s ease-in-out;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

.bt1:hover{
	color: #ffffff;
	text-decoration: none;
	opacity: 0.8;
	filter: alpha(opacity=80);
}


/***** slider *****/
.slick-prev, .slick-next , ul#slideIcon li,
#newface .bx-wrapper .bx-controls-direction a{	color: #ffffff;}
.slick-prev, .slick-next , ul#slideIcon li,
#newface .bx-wrapper .bx-controls-direction a{	background-color: rgba(149, 131, 76, 0.9);}
.bx-wrapper .bx-pager.bx-default-pager a{	background-color: #ddd;}
.bx-wrapper .bx-pager.bx-default-pager a.active{	background-color: #cbad39;}


/***************************************
COMPANION STYLE
****************************************/

/***** font color *****/
.c_tx1, .c_tx1:hover{	color: #c1b07b;}
.c_tx2, .c_tx2:hover{	color: #ffffff;}



/***** border color *****/
.c_bg1{	background-color: rgba(0, 0, 0, 1);}


/***** bg color *****/
.c_bd1{	border-color: #4d4223;}
.c_bd2, #companion li:after, #newface li:after{	border-color: #222;}
.c_bd3{	border-color: #302811;}
.c_bd4{	border-color: #000000;}


/***** inset *****/
.c_in1{
	box-shadow:0px 0px 0px 1px #fff inset;
	-moz-box-shadow:0px 0px 0px 1px #fff inset;
	-webkit-box-shadow:0px 0px 0px 1px #fff inset;
}


/***** gradation *****/
.c_gr1{
	background: #736437;
}
.c_gr2{
	background: #000000;
}




/***************************************
ROLLOVER
****************************************/

.fade{
	display: inline-block;
	padding: 0;
}

.fade,
.up a{
	-webkit-transition	: 0.2s ease-in-out;
	-moz-transition	: 0.2s ease-in-out;
	-o-transition	: 0.2s ease-in-out;
	transition		: 0.2s ease-in-out;
}

.fade:hover,
.fade:hover{
	opacity: 0.8;
	filter: alpha(opacity=80);
}


/***************************************
GOOGLE FONT
****************************************/

@font-face {
	font-family: FontA;
	src: url('../font/Cinzel-Regular.ttf') format("truetype");
}


/***** font *****/

.page_title em,
.font1{
	font-family: FontA;
}
.page_title:after{
	font-family: FontB;
}

.hd_info,
.page_title span,
.s_title span,
footer #copyright,
.min{	font-family: "Sawarabi Mincho";}


/*=================================================
 * CSS for SP
 * ================================================= */

@media screen and (max-width: 650px) {

	/***************************************
	TITLE
	****************************************/
	.s_title{
		height: 60px;
		font-size: 11px;
		font-weight: normal;
		line-height: 14px;
		text-align: center;
		padding-top: 12px;
		margin-bottom: 0;
		border: 0;
		background: #231d16; /* Old browsers */
		background: -moz-linear-gradient(left, #231d16 20%, #352d22 50%, #231d16 80%); /* FF3.6-15 */
		background: -webkit-linear-gradient(left, #231d16 20%,#352d22 50%,#231d16 80%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to right, #231d16 20%,#352d22 50%,#231d16 80%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#231d16', endColorstr='#231d16',GradientType=1 ); /* IE6-9 */
		-webkit-box-sizing: border-box;
		   -moz-box-sizing: border-box;
		        box-sizing: border-box;
	}
	.s_title em{
		display: inline-block;
		vertical-align: top;
		font-family: "FontA";
		font-size: 22px;
		line-height: 22px;
	}
	.s_title span{
		display: inline-block;
		vertical-align: top;
		font-size: 11px;
		line-height: 14px;
	}
	.ss_title{
		text-align: center;
		padding: 3px;
		border-left: none;
		border-right: none;
		box-shadow:0px 1px 0px 0px #91dcd0 inset,0px -1px 0px 0px #91dcd0 inset;
		-moz-box-shadow:0px 1px 0px 0px #91dcd0 inset,0px -1px 0px 0px #91dcd0 inset;
		-webkit-box-shadow:0px 1px 0px 0px #91dcd0 inset,0px -1px 0px 0px #91dcd0 inset;
		-webkit-box-sizing: border-box;
		   -moz-box-sizing: border-box;
		        box-sizing: border-box;
	}
	.ss_title span{
		padding: 8px 5px;
		border-radius: 18px;
	}

	/***************************************
	MAIN CONTENTS
	****************************************/
	.main_bg{
		padding: 0;
		border: none;
		background-color: rgba(255, 255, 255, 1);
	}
	.main{
		border-top: none;
		border-right: none;
		border-left: none;
		box-shadow:none;
		-moz-box-shadow:none;
		-webkit-box-shadow:none;
	}

	/***************************************
	COMMON STYLE (SP ONLY)
	****************************************/
	.sp_tx1, .sp_tx1:hover{	color: #d2c59f;}
	.sp_bg1{	background-color: rgba(0, 0, 0, 1);}
	#prof #prof_top_l #sliderContainer{ background-color: rgba(23, 19, 14, 1);}
	.c_bg1{	background-color: rgba(0, 0, 0, 1);}
}