/* CSS Document */
/*********    **********************************************************************************************/


.morebtn_orang_head {
	background: #7d722e;	color: #fff; text-align:center; float:right;
	width:180px;
	height: 32px;
	margin:5px auto !important;
	padding:0 !important;
	
	border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */ 
	
	font-family: 
    "Hiragino Kaku Gothic ProN", 
    "Hiragino Sans", 
    "Yu Gothic", 
    "Meiryo", 
    sans-serif;
	
	
}
.morebtn_orang_head a {	line-height:2.0 !important;
  display:block;   font-size:16px !important; font-weight:normal !important; color:#fff !important; text-decoration:none!important;}

.morebtn_orang_head :hover ,.morebtn_orang_head a:hover {
	background: #666;	color:#fff !important;
	border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */
	text-decoration:none;
}


.morebtn {
	background: #352765;	color: #fff;}
.morebtn a {  color:#fff !important; text-decoration:none;}
.morebtn :hover ,.morebtn a:hover {
	background: #534487;	color:#fff !important;}


.morebtn_border {
	background: #f7f7f7;	color: #463876; border:1px solid #222;}
.morebtn_border a {  color:#463876 !important; text-decoration:none;}
.morebtn_border :hover ,.morebtn_border a:hover {
	background: #ccc;	color:#000 !important;}




.morebtn_red {
	background: #eb0000;	color: #fff;}
.morebtn_red a {  color:#fff !important; text-decoration:none;}
.morebtn_red :hover ,.morebtn_red a:hover {
	background: #9d0000;	color:#fff !important;}


.morebtn_white {
	background: #fff;	color: #333;}
.morebtn_white a {  color:#333 !important;}
.morebtn_white :hover ,.morebtn_white a:hover {
	background: #ddd;	color:#333 !important;}

.morebtn_gray {
	background: #666;	color: #fff;}
.morebtn_gray a {  color:#fff !important;}
.morebtn_gray :hover ,.morebtn_gray a:hover {
	background: #333;	color:#fff !important;}

.morebtn_black,.morebtn_black_left {
	background: #222;	color: #fff;}
.morebtn_black a,.morebtn_black_left a {  color:#fff !important;}
.morebtn_black :hover ,.morebtn_black a:hover,.morebtn_black_left :hover ,.morebtn_black_left a:hover {
	background: #555;	color:#fff !important;}


.morebtn_green {
	background: #7d722e;	color: #fff;}
.morebtn_green a {  color:#fff !important}
.morebtn_green :hover ,.morebtn_green a:hover {
	background: #666;	color:#fff !important;}



.morebtn,.morebtn_red, .morebtn_white, .morebtn_gray, .morebtn_black, .morebtn_black_left, .morebtn_green {
	max-width:600px;
	text-align:center;
	margin:20px auto !important;
	padding:0 !important;
	line-height:2.5 !important;
	display:block;
/*	border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
	box-shadow: 0px 1px 3px 1px rgba(0,0,0,0.1);
*/}


.morebtn_border{
	max-width:600px;
	width:90%;
	text-align:center;
	margin:20px auto !important;
	padding:0 !important;
	line-height:2.5 !important;
	display:block;
/*	border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
	box-shadow: 0px 1px 3px 1px rgba(0,0,0,0.1);
*/}

.morebtn a,.morebtn_border a,.morebtn_red a, .morebtn_white a, .morebtn_gray a, .morebtn_black a, .morebtn_black_left a, .morebtn_green a { 
    text-align:center;
	padding:0 !important;
	margin:0 !important;
	position: relative;
	display:block;
	text-decoration:none !important;
    font-size:16px;
    font-weight:bold;
	line-height:2.5 !important;
	/*box-shadow: 0px 1px 3px 1px rgba(0,0,0,0.1);*/
}
.morebtn a:hover, .morebtn_border a:hover, .morebtn_red a:hover, .morebtn_white a:hover, .morebtn_gray a:hover, .morebtn_black a:hover, .morebtn_black_left a:hover, .morebtn_green a:hover {
	display:block;
	padding:0 !important;
	margin:0 !important;
	
	/*box-shadow: 0px 1px 3px 1px rgba(0,0,0,0.1);*/
}

.morebtn :hover,.morebtn_border :hover,.morebtn_red :hover, .morebtn_white :hover, .morebtn_gray :hover, .morebtn_black :hover, .morebtn_black_left :hover, .morebtn_green :hover {
	display:block;
	padding:0 !important;
	margin:0 !important;
	/*box-shadow: 0px 1px 3px 1px rgba(0,0,0,0.1);*/
}


/*　ボタン 「＞」アイコン表示   黒色ボタン 白色「＞」アイコン表示 */
.morebtn a:before {         
	display: block;
	content: "";
	position: absolute;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 50%;
	right: 20px;
	width: 10px;
	height: 10px;
	margin-top: -5px;
	background: #fff;
}

.morebtn a:after {        /*バックグラウンドと同じ色のひし型をずらして「before要素」を隠す */  
	display: block;
	content: "";
	position: absolute;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 50%;
	right: 23px;
	width: 10px;
	height: 10px;
	margin-top: -5px;
	background: #352765;
	
}
.morebtn a:hover:after {        /*「after要素」のマウスオーバー（カラーを合わせる） */  
	background: #534487;
}
/*　//黒色ボタン白色「＞」アイコン表示「＞」アイコン表示 */


/*　ボタン 「＞」アイコン表示   黒色ボタン 白色「＞」アイコン表示 */
.morebtn_border a:before {         
	display: block;
	content: "";
	position: absolute;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 50%;
	right: 20px;
	width: 10px;
	height: 10px;
	margin-top: -5px;
	background: #463876;
}

.morebtn_border a:after {        /*バックグラウンドと同じ色のひし型をずらして「before要素」を隠す */  
	display: block;
	content: "";
	position: absolute;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 50%;
	right: 23px;
	width: 10px;
	height: 10px;
	margin-top: -5px;
	background: #f7f7f7;
	
}
.morebtn_border a:hover:after {        /*「after要素」のマウスオーバー（カラーを合わせる） */  
	background: #ccc;
}
/*　//黒色ボタン白色「＞」アイコン表示「＞」アイコン表示 */





/*　赤ボタン 白色「＞」アイコン表示 */
.morebtn_red a:before {         
	display: block;
	content: "";
	position: absolute;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 50%;
	right: 20px;
	width: 10px;
	height: 10px;
	margin-top: -5px;
	background: #fff;
}

.morebtn_red  a:after {        /*バックグラウンドと同じ色のひし型をずらして「before要素」を隠す */  
	display: block;
	content: "";
	position: absolute;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 50%;
	right: 23px;
	width: 10px;
	height: 10px;
	margin-top: -5px;
	background: #eb0000;
	
}
.morebtn_red  a:hover:after {        /*「after要素」のマウスオーバー（カラーを合わせる） */  
	background: #9d0000;
}
/*　//赤ボタン白色「＞」アイコン表示 */


/*　白色ボタン黒色「＞」アイコン表示 */
.morebtn_white a:before {         
	display: block;
	content: "";
	position: absolute;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 50%;
	right: 20px;
	width: 10px;
	height: 10px;
	margin-top: -5px;
	background: #333;
}

.morebtn_white  a:after {        /*バックグラウンドと同じ色のひし型をずらして「before要素」を隠す */  
	display: block;
	content: "";
	position: absolute;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 50%;
	right: 23px;
	width: 10px;
	height: 10px;
	margin-top: -5px;
	background: #fff;
	
}
.morebtn_white  a:hover:after {        /*「after要素」のマウスオーバー（カラーを合わせる） */  
	background: #ddd;
}
/*　//白色ボタン黒色「＞」アイコン表示 */

/*　灰色ボタン 白色「＞」アイコン表示 */
.morebtn_gray a:before {         
	display: block;
	content: "";
	position: absolute;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 50%;
	right: 20px;
	width: 10px;
	height: 10px;
	margin-top: -5px;
	background: #fff;
}

.morebtn_gray  a:after {        /*バックグラウンドと同じ色のひし型をずらして「before要素」を隠す */  
	display: block;
	content: "";
	position: absolute;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 50%;
	right: 23px;
	width: 10px;
	height: 10px;
	margin-top: -5px;
	background: #666;
	
}
.morebtn_gray  a:hover:after {        /*「after要素」のマウスオーバー（カラーを合わせる） */  
	background: #333;
}
/*　//灰色ボタン白色「＞」アイコン表示 */

/*　黒色ボタン 白色「＞」アイコン表示 */
.morebtn_black a:before {         
	display: block;
	content: "";
	position: absolute;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 50%;
	right: 20px;
	width: 10px;
	height: 10px;
	margin-top: -5px;
	background: #fff;
}

.morebtn_black  a:after {        /*バックグラウンドと同じ色のひし型をずらして「before要素」を隠す */  
	display: block;
	content: "";
	position: absolute;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 50%;
	right: 23px;
	width: 10px;
	height: 10px;
	margin-top: -5px;
	background: #222;
	
}
.morebtn_black  a:hover:after {        /*「after要素」のマウスオーバー（カラーを合わせる） */  
	background: #555;
}
/*　//黒色ボタン白色「＞」アイコン表示 */

/*　黒色ボタン 白色「<」アイコン表示 */
.morebtn_black_left a:before {         
	display: block;
	content: "";
	position: absolute;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 50%;
	left: 20px;
	width: 10px;
	height: 10px;
	margin-top: -5px;
	background: #fff;
}

.morebtn_black_left  a:after {        /*バックグラウンドと同じ色のひし型をずらして「before要素」を隠す */  
	display: block;
	content: "";
	position: absolute;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 50%;
	left: 23px;
	width: 10px;
	height: 10px;
	margin-top: -5px;
	background: #222;
	
}
.morebtn_black_left  a:hover:after {        /*「after要素」のマウスオーバー（カラーを合わせる） */  
	background: #555;
}
/*　//黒色ボタン白色「<」アイコン表示 */





/*　緑色ボタン 白色「＞」アイコン表示 */
.morebtn_green a:before {         
	display: block;
	content: "";
	position: absolute;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 50%;
	right: 20px;
	width: 10px;
	height: 10px;
	margin-top: -5px;
	background: #fff;
}

.morebtn_green  a:after {        /*バックグラウンドと同じ色のひし型をずらして「before要素」を隠す */  
	display: block;
	content: "";
	position: absolute;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 50%;
	right: 23px;
	width: 10px;
	height: 10px;
	margin-top: -5px;
	background: #7d722e;
	
}
.morebtn_green  a:hover:after {        /*「after要素」のマウスオーバー（カラーを合わせる） */  
	background: #666;
}
/*　//緑色ボタン白色「＞」アイコン表示 */


@media screen and (min-width:240px) and (max-width:780px){
.morebtn, .morebtn_border, .morebtn_black, .morebtn_red, .morebtn_green{ width:90% !important; margin:15px 5% !important; }
.morebtn a, .morebtn_border a, .morebtn_black a, .morebtn_red, .morebtn_green a{ font-size:13px !important; line-height:3.0 !important;}
}







/*フッターのカーロゴ*/
.morebtn02 {
	width:100%;
	background: #6b5b9b;
	font-size:10px;
	text-align:center;
	color: #333;
	margin:0 auto !important;
	line-height:25px;
	display:block;

}
.morebtn02 a { color:#FFFFFF !important; text-align:center; padding:0 !important; margin:0; text-decoration:none;	font-size:10px;}
.morebtn02 a:hover {
	display:block;
	background: #aaa;
	 padding:0 !important; margin:0
}




.bigbtn{line-height:3 !important;}

/* ゴールドボタン *******************/
	
.golden-button {
    display: inline-block;
    padding: 1em 2em;
    background: linear-gradient(to right, #b1933a, #e5d28f, #b1933a);
    color: white;
    font-weight: bold;
    text-decoration: none;
    border-radius: 2px;
    position: relative;
    overflow: hidden;
    transition: all 0.3s ease-in-out; 
	text-decoration: none !important;
}

.golden-button::before {
    content: "";
    position: absolute;
    top: 0;
    left: -75%;
    width: 50%;
    height: 100%;
    background: linear-gradient(to right, rgba(255,255,255,0.2), rgba(255,255,255,0.6), rgba(255,255,255,0.2));
    transform: skewX(-25deg);
    transition: left 0.5s ease-in-out;
}
.golden-button:hover::before {
    left: 125%;
}	
/* ゴールドボタン *******************/
