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

html,body {
	margin:0; 
	padding:0; 
	width:100%;
	font-family:Meiryo,"メイリオ","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:13px;
	line-height:1.8em;
	color:#555;
	-webkit-text-size-adjust: 100%;}

a{
	color:inherit;
    -webkit-transition: 0.2s;
    -moz-transition: 0.2s;
    -o-transition: 0.2s;
    -ms-transition: 0.2s;
    transition: 0.2s;
}

a {text-decoration: none;}
a:link { color:inherit; }
a:visited { color:#555; }
a:hover { color:tomato; cursor:pointer;}

ul {margin: 0 0 0 0; padding: 0;}
ol {margin: 0 0 0 1.9em; padding: 0;}
li {list-style:none;}

.binary ol li {list-style:decimal-leading-zero;}
.circle {border-radius: 50%;}
.bold {font-weight: bold;}
.font90 {font-size: 90%;}
.font80 {font-size: 80%;}
.align_center {text-align: center;}

h1,h2 {display:none;}
	
@media (min-device-width:768px) {html,body {min-width:930px;}}
@media (max-device-width:480px) {html,body {font-size:18px;}}

.text_red {font-weight: bold; color:red;}

.padding-top_1em {padding-top:1em;}


/*****ページTOPとSTOREボタン*****/
#pagetop {position:fixed; right:0; bottom:40px;}
#aai_store {position:fixed; right:0; bottom:110px;}

/*****AAロゴまわり*****/

#AA_logo {
	position:absolute;
	top:0px;
	left:20px;
	width:221px;
	height:300px;
	background-image:url(../image/purple_bg.png);
	z-index:100;}
	
#AAcompany_logo {
	position:absolute;
	top:0px;
	left:20px;
	width:221px;
	height:300px;
	background-image:url(../image/purple_bg_company.png);
	z-index:100;}

#purple_menu {
	  position:absolute;
	  top:90px;
	  left:0px;
	  z-index:99;
	  width: 221px;
	  height: 213px; }
	  	  
#news {margin:0; width:110px; height:60px; float:left; background-image:url(../image/purple_menu.png); background-position:0px 0px; background-size:330px 240px; cursor:pointer;} #news:hover { background-position:0px -120px;}

#company {margin-left:1px; width:110px; height:60px; float:left; background-image:url(../image/purple_menu.png); background-position:-110px 0px; background-size:330px 240px; cursor:pointer;} #company:hover { background-position:-110px -120px;}

#recruit {margin-top:1px; width:110px; height:60px; float:left; background-image:url(../image/purple_menu.png); background-position:0px -60px; background-size:330px 240px; cursor:pointer;} #recruit:hover { background-position:0px -180px;}

#store {margin-left:1px; margin-top:1px; width:110px; height:60px; float:left; background-image:url(../image/purple_menu.png); background-position:-110px -60px; background-size:330px 240px; cursor:pointer;} #store:hover { background-position:-110px -180px;}

#_store {margin-left:1px; margin-top:-7px; width:110px; height:60px; float:left; background-image:url(../image/purple_menu.png); background-position:-110px -60px; background-size:330px 240px; cursor:pointer;} #_store:hover { background-position:-110px -180px;}

#story {margin-left:1px; margin-top:-7px; width:110px; height:60px; float:left; background-image:url(../image/purple_menu.png); background-position:-220px 0px; background-size:330px 240px; cursor:pointer; opacity:1.0;} 

#topics {margin-top:-7px; width:110px; height:60px; float:left; background-image:url(../image/purple_menu.png); background-position:-220px -60px; background-size:330px 240px; cursor:pointer; opacity:1.0;} 
  
#welcome_comment {
	  margin-left:10px; margin-top:150px; width:201px; 
	  font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", Osaka, ;
	  font-size:11px; color:#FFF;}
	  
@media (max-device-width:480px) {
#AA_logo {
	position:absolute;
	top:0px;
	left:0px;
	width:300px;
	height:120px;
	background-image:url(../image/purple_bg_company.png);
	z-index:100;}
	
#AAcompany_logo {
	position:absolute;
	top:0px;
	left:0px;
	width:300px;
	height:120px;
	background-image:url(../image/purple_bg_company.png);
	z-index:100;}

#purple_menu {
	display:none;}
	
#news,#company,#recruit,#store,#welcome_comment {display:none;}
}

/*****基本のレイアウト用*****/

#wrapper {
	position:static;
	margin:0;
	padding:0;
	width:100%;}
	
#header {
	position:relative;
	margin:0;
	padding:0 0;
	width:100%;
	height:210px;
	background-color:#222;
	z-index:20;}

#menu {
	position:relative;
	top:120px;
	left:0px;
	width:100%;
	height:90px;
	border-top:solid 1px #639;
	font-weight:bold;
	font-size:20px;}

@media (min-device-width:768px) {
#header {
	position:relative;
	margin:0;
	padding:0 0;
	width:100%;
	height:90px;
	background-image:url(../image/header_bg.gif);
	background-repeat:repeat-x;
	background-position:0px -30px;}
	
#menu {
	position:relative;
	top:0px;
	left:241px;
	width:50%;
	height:64px;
	border:none;
	font-weight:bold;
	font-size:12px;}
}
			
#photo_slider {
	position:relative;
	margin:0;
	padding:0;
	width:100%;}
	
#card_deck {
	position:relative;
	margin:20px 0%;
	padding:0%;
	width:100%;
	height:auto;}

#brand_profile {
	position:relative;
	margin:20px 2%;
	width:96%;
	height:auto;
	background-color:#eee;}
	
#product {
	display:inline-block;
	position:relative;
	margin:0 0 -1% 0;
	padding:0;
	width:100%;
	height:auto;
	background-image:url(../image/bg001_10.gif);}

#news_topic {
	position:relative;
	margin:20px 0%;
	padding:0%;
	width:100%;
	height:auto;}
	
#brand_list {
	position:relative;
	margin:20px 0%;
	padding:0;
	width:100%;
	height:auto;}
	
#footer {
	clear:left;
	position:relative;
	margin-top:2% 0% 0% 0%;
	padding:0;
	width:100%;
	height:500px;}

/*****メニューまわり*****/

#brand {
	position:relative;
	float:left;
	display:inline-block;
	width:30%;
	height:63px;
	padding-top:27px;
	text-align:center;
	color:#777;
	background-color:#222;
	cursor:pointer;}
	
#community {
	position:relative;
	float:left;
	display:inline-block;
	width:25%;
	height:63px;
	padding-top:27px;
	text-align:center;
	color:#777;
	background-color:#222;
	cursor:pointer;}
	
#support {
	position:relative;
	float:left;
	display:inline-block;
	width:21%;
	height:63px;
	padding-top:27px;
	text-align:center;
	color:#777;
	background-color:#222;
	cursor:pointer;}
	
#dealer {
	position:relative;
	float:left;
	display:inline-block;
	width:24%;
	height:63px;
	padding-top:27px;
	text-align:center;
	color:#777;
	background-color:#222;
	cursor:pointer;}
	
@media (min-device-width:768px) {
#brand {
	height:41px;
	padding-top:23px;
	background-color:transparent;}
		
#community {
	height:41px;
	padding-top:23px;
	border-left:none;
	background-color:transparent;}
	
#support {
	height:41px;
	padding-top:23px;
	border-left:none;
	background-color:transparent;}
	
#dealer {
	height:41px;
	padding-top:23px;
	border-left:none;
	background-color:transparent;}
}
	
/*検索窓*/
#searchform {
	position:absolute;
	top:19px;
	right:20px;
	width:200px;} 
	
#keywords  {
	position:relative;
	float:left;
	width:150px;
    height:22px;
    background: #999;
    border: none;
    color: #FFF;} 
	
#searchBtn {
	position:relative;
	width:33px;
	top:-1px;}  

@media (max-device-width:480px) {
#searchform {
	position:absolute;
	top:45px;
	right:20px;
	width:200px;} 

#searchBtn {
	margin-left:3px;
	} 
}

/*****トグルするメニュー*****/

#brand_menu {
	position:absolute;
	display:none;
	margin:0;
	width:100%;
	height:auto;
	padding-bottom:20px;
	background-color:rgba(0,0,0,0.9);
	z-index:8;}
	
#community_menu {
	position:absolute;
	display:none;
	margin:0;
	width:100%;
	height:auto;
	padding-bottom:20px;
	background-color:rgba(0,0,0,0.9);
	z-index:7;}
	
#support_menu {
	position:absolute;
	margin:0;
	display:none;
	width:100%;
	height:auto;
	padding-bottom:20px;
	background-color:rgba(0,0,0,0.9);
	z-index:6;}
	
#dealer_menu {
	position:absolute;
	margin:0;
	display:none;
	width:100%;
	height:auto;
	padding-bottom:20px;
	background-color:rgba(0,0,0,0.9);
	z-index:5;}
	
#brand_topics {
	position:absolute;
	display:none;
	margin:0;
	width:100%;
	height:auto;
	padding-bottom:20px;
	background-color:rgba(0,0,0,0.9);
	z-index:9;}
	
#brand_story {
	position:absolute;
	display:none;
	margin:0;
	width:100%;
	height:auto;
	padding-bottom:20px;
	background-color:rgba(0,0,0,0.9);
	z-index:10;}

.menu_box_left {
	float:left;
	margin-top:10px;
	width:25%;
	margin-left:33%;
	color:#fff;}

.menu_box_right {
	float:left;
	margin-top:10px;
	width:32%;
	margin-left:5%;
	color:#fff;}
	
.menu_box_full {
	float:left;
	margin-top:10px;
	width:65%;
	margin-left:30%;
	color:#fff;}

@media (max-device-width:480px) {
.menu_box_left {
	float:none;
	margin-top:10px;
	width:100%;
	margin-left:0;
	padding-left:2%;
	color:#fff;
	font-size:20px;}

.menu_box_right {
	float:none;
	margin-top:10px;
	width:100%;
	margin-left:0;
	padding-left:2%;
	color:#fff;
	font-size:20px;}
	
.menu_box_full{
	float:none;
	margin-top:10px;
	width:100%;
	margin-left:0;
	padding-left:2%;
	color:#fff;
	font-size:20px;}	
}

/*****リストメニューの装飾*****/

.white {list-style-image:url(../image/list_white.png); height:2.7em; cursor:pointer;}
.white :link {color:#fff;}
.white :visited {color:#fff;}
.white:hover{ background-color:rgba(255,255,255,0.30);}
.white a {display:block;}

.red {list-style-image:url(../image/list_red.png); height:2.2em; cursor:pointer; }
.red :link {color:#fff;}
.red :visited {color:#fff;}
.red:hover{ background-color:rgba(237,0,3,0.30);}
.red a {display:block;}

.orange {list-style-image:url(../image/list_orange.png); height:2.2em; cursor:pointer; }
.orange :link {color:#fff;}
.orange :visited {color:#fff;}
.orange:hover{ background-color:rgba(239,136,21,0.30);}
.orange  a {display:block;}

.yellow {list-style-image:url(../image/list_yellow.png); height:2.2em; cursor:pointer;}
.yellow :link {color:#fff;}
.yellow :visited {color:#fff;}
.yellow:hover{ background-color:rgba(255,203,24,0.30);}
.yellow  a {display:block;}

.green {list-style-image:url(../image/list_green.png); height:2.2em; cursor:pointer;} 
.green :link {color:#fff;}
.green :visited {color:#fff;}
.green:hover{ background-color:rgba(14,140,17,0.45);}
.green a {display:block;}

.purple {list-style-image:url(../image/list_purple.png); height:2.2em; cursor:pointer;} 
.purple :link {color:#fff;}
.purple :visited {color:#fff;}
.purple:hover{ background-color:rgba(125,47,177,0.55);}
.purple a {display:block;}

.blue {list-style-image:url(../image/list_blue.png);  height:2.2em; cursor:pointer;} 
.blue :link {color:#fff;}
.blue :visited {color:#fff;}
.blue:hover{ background-color:rgba(14,97,209,0.45);}
.blue a {display:block;}

/*本文中のリスト装飾用*/

.pointer_red {list-style-image:url(../image/list_red.png); line-height:1.4em; margin-bottom:1em; margin-left:1.3em;}
.pointer_green {list-style-image:url(../image/list_green.png); line-height:1.4em; margin-bottom:1em; margin-left:1.3em;}

@media (max-width:768px) {
.pointer_red {margin-left:0em;}
.pointer_green {margin-left:0em;}
}

@media (max-device-width:480px) {
.white,.red,.orange,.yellow,.green,.purple,.blue { font-size:20px; padding:10px 0px;}
}


/***カードデッキ***/

a img {
	-webkit-transition: 0.3s ease-in-out;
	   -moz-transition: 0.3s ease-in-out;
	     -o-transition: 0.3s ease-in-out;
	        transition: 0.3s ease-in-out;}
			
a:hover img {
	opacity: 0.7;
	filter: alpha(opacity=70);}

.deck {
	display:table;
	position:relative;
	width: 100%;}
	
.card {
	display:table-cell;
	float:left;
	width:22.5%;
	margin-left:2%;
	margin-bottom:2%;
	background-color:#EEE;}

@media (max-device-width:480px) {
.card {
	float:left;
	width:47%;
	margin-left:2%;
	margin-bottom:2%;
	background-color:#EEE;}
}

.text_box {display:block; width:100%; position:relative;}
.text_box img {position: absolute; right: 0; bottom: 0;}

.photo_thum {display:block; width:100%; } .photo_thum:hover{cursor:pointer;}
.photo_thum_acc {display:block; width:100%; } 
.brand_name {display:block; margin:3px 10px; font-family: 'Oswald', sans-serif; letter-spacing:1px; font-size:15px;}
.product_name{display:block; margin:3px 10px; font-family: 'Oswald', sans-serif; letter-spacing:1px; font-size:13px;}
.card_text{position: relative; display:block; margin:10px 10px 0px 10px; height:3.8em; overflow:hidden; font-size:12px; line-height:1.8em;}
.card_text_acc{position: relative; display:block; margin:10px 10px 10px 10px; font-size:12px; line-height:1.8em;}
.card_text_dealer{position: relative; display:block; padding:10px 10px 10px 10px; font-size:12px; line-height:1.8em;}
.card_text_site_rule{position: relative; display:block; font-size:13px; line-height:2em;}

@media (max-device-width:480px) {
.brand_name {display:block; margin:3px 10px; font-family: 'Oswald', sans-serif; letter-spacing:1px; font-size:20px;}
.product_name{display:block; margin:3px 10px; font-family: 'Oswald', sans-serif; letter-spacing:1px; font-size:18px;}
.card_text{position: relative; display:block; margin:10px 10px 0px 10px; height:4.8em; font-size:18px; line-height:1.5em; overflow:hidden;}
.card_text_acc{position: relative; display:block; margin:10px 10px 10px 10px; font-size:18px; line-height:1.5em;}
.card_text_dealer{position: relative; display:block; padding:10px 10px 10px 10px; font-size:18px; line-height:1.5em;}
}

/***ニューストピックス***/

.title{
	width:95%;
	height:2em;
	margin-top:50px;
	margin-left:2%;
	margin-right:2%;
	border-top:solid 1px #663399;
	border-bottom:solid 1px #663399;
	padding-left:1%;
	line-height:48px;
	font-family: 'Oswald', sans-serif;
	font-size:24px;
	font-weight:700;
	letter-spacing:2px;
	color:#639;
	background-image:url(../image/bg001_10.gif);}

.topics {
	display:block;
	padding-top:10px;
	padding-bottom:10px;
	margin-left:2%;
	margin-right:2%;
	padding-left:30px;
	list-style:decimal-leading-zero;
	color:#555;
	background-image:url(../image/icon_01.png);
	background-size:30px;
	background-position:-5px 11px;
	background-repeat:no-repeat;
	border-bottom:solid 1px #EEE;}
	
.topics a {display:block;}

.topics_brand {
	display:block;
	margin-top:1em;
	padding-top:0.3em;
	padding-bottom:0.3em;
	padding-left:2em;
	color:#fff;
	background-image:url(../image/icon_01.png);
	background-size:24px;
	background-position:-3px 8px;
	background-repeat:no-repeat;
	border-bottom:solid 1px #444;}
	
@media (max-device-width:480px) {
.topics {background-position:-5px 14px;}
}

.topics:hover{
	background-color:#EEE;}

/***ブランド紹介部分（ほぼカードデッキと共通）***/

.brand_deck {
	display: table;
	margin-top:20px;
	width: 100%;}
			
.brand_card {
	display:table-cell;
	float:left;
	width:22.5%;
	margin-left:2%;
	margin-bottom:2%;
	background-color:#EEE;}
	
.brand_card_text{ min-height:4em; padding:0 10px; padding-bottom:6px;}

@media (max-device-width:480px) {
.brand_card {
	float:left;
	width:47%;}
		
.brand_card_text{padding:0 5px;}
}


/***フッター部分***/

#bot {
	margin-top:100px;
	width: 100%; 
	height: auto;
	background-color:rgba(48,48,48,1.00);}
	
#footer_line {
	width:100%;
	height:26px;
	background-image:url(../image/footer_bg.gif);
	background-repeat:repeat-x;}

#footer_deck {
	margin-top:10px;
	margin-left:2%;}

.footer_card{
	float:left;
	width:22%;
	margin-left:2%;
	margin-bottom:50px;
	color:#FFF;}

#copyright {
	clear:both;
	width:100%;
	height:65px;
	border-top:solid 1px #CCC;
	padding-top:20px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#999;
	text-align:center;
	letter-spacing:1px;}

@media (max-device-width:480px) {
.footer_card{
	float:left;
	width:47%;
	margin-left:2%;
	margin-bottom:50px;
	color:#FFF;
	font-size:20px;}
}

/*****階層ページ用******/

#left_70main,.left_70main {
	position:relative;
	margin:50px 50px 50px 291px;
	min-width:70%;}
	
.nihongo_title {
	position:relative;
	width:100%;
	height:2em;
	border-bottom:solid 1px #639;
	font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", Osaka, sans-serif;
	font-size:21px;
	letter-spacing:0.2em;
	color:#888;}

.table {
	display:table;
    width:100%;}
	
.row {display:table-row;
    width:100%;}
 
 .row>div{
	display:table-cell;
	padding:15px 50px 15px 20px;
	background-color:#F0F0F0;
	border-bottom:solid 1px #ddd;}
	
.block {
	position:relative;
	clear:both;
	width:96%;
	margin:0;
	padding:2% 2% 5% 2%;
	background-image:url(../image/brown_bg.jpg);
	background-repeat:repeat-x;}	
	
	
@media (max-device-width:480px) {
#left_70main,.left_70main {
	position:relative;
	margin:2%;
	min-width:96%;}
	
.nihongo_title {
	font-size:30px;}
	
}

/*****ブランドごとのTOP*****/
	
.brand_story{
	width:99%;
	height:2em;
	border-top:solid 1px #333;
	border-bottom:solid 1px #333;
	padding-left:1%;
	line-height:48px;
	font-family: 'Oswald', sans-serif;
	font-size:24px;
	font-weight:700;
	letter-spacing:2px;
	color:#555;
	background-image:url(../image/bg001_10.gif);}
	
.brand_title{
	clear:left;
	width:95%;
	height:2em;
	margin-top:0px;
	margin-left:2%;
	margin-right:2%;
	border-top:solid 1px #555;
	border-bottom:solid 1px #555;
	padding-left:1%;
	line-height:48px;
	font-family: 'Oswald', sans-serif;
	font-size:24px;
	font-weight:700;
	letter-spacing:2px;
	color:#555;
	background-image:url(../image/bg001_10.gif);}

.brand_story_text {
	padding:1% 1%;
	line-height:2em;}
	  
#brand_logo {
	display:none;}
	
.height_10px_space {
	margin:0;
	height:1px;
	background-color:#639;}

@media (max-device-width:480px) {

#brand_logo {
	display:block;
	position:absolute;
	top:211px;
	width:220px;
	z-index:4;}
}

/*****商品ページ*****/

.product_photo {
	float:left;
	margin:1%;
	width:32%;}
	
.product_profile {
	float:left;
	margin:2% 0%;
	width:32%;}
	
#facebook_twitter {
	margin:2% 0;}
	
.product_profile_table_cell {
	border-bottom:solid 1px #333;
	padding:0.75em 0;}
	
.product_menu {
	float:left;
	margin:2% 2%;
	width:30%;}
		
.product_text_bold {margin:2% 2% 0% 0%; font-size:135%; font-weight:nomal;}
.product_text_bold_red {margin:2% 2% 0% 0%; font-size:135%; font-weight:nomal; background-image:url(../image/color_title_01.gif); background-repeat:repeat-y; padding:0.5em 0 0.5em 1em;}
.product_text_bold_orange {margin:2% 2% 0% 0%; font-size:135%; font-weight:nomal; background-image:url(../image/color_title_02.gif); background-repeat:repeat-y; padding:0.5em 0 0.5em 1em;}
.product_text_bold_yellow {margin:2% 2% 0% 0%; font-size:135%; font-weight:nomal; background-image:url(../image/color_title_03.gif); background-repeat:repeat-y; padding:0.5em 0 0.5em 1em;}
.product_text_bold_green {margin:2% 2% 0% 0%; font-size:135%; font-weight:nomal; background-image:url(../image/color_title_04.gif); background-repeat:repeat-y; padding:0.5em 0 0.5em 1em;}
.product_text_bold_purple {margin:2% 2% 0% 0%; font-size:135%; font-weight:nomal; background-image:url(../image/color_title_05.gif); background-repeat:repeat-y; padding:0.5em 0 0.5em 1em;}
.product_text_bold_blue {margin:2% 2% 0% 0%; font-size:135%; font-weight:nomal; background-image:url(../image/color_title_06.gif); background-repeat:repeat-y; padding:0.5em 0 0.5em 1em;}

.product_text {
	display:inline-block;
	margin:2% 2%;}
	
.feature_photo {
	width:50%;
	margin-top:2em;
	border:solid 1px #555;}
	
.flex_photo {
	margin-top:2%;
	border:solid 1px #555;}
		
.sample_media {
	clear:left;
	display:inline-block;
	width:100%;
	margin:0;}
	
.video_box {
	position:relative;
	float:left;
	width:47%;
	margin:2.5% 2% 0 2%;}
	
.list_box {
	position:relative;
	float:left;
	width:47%;
	margin:0.5% 0 0 0;}
	
.sample_list {
	list-style:none;
	margin-left:-3em;
	padding:0.8em 0 0.5em 0;
	border-bottom:solid 1px #555;}
	
.sample_list:hover {
	background-image:url(../image/bg001_10.gif);}
			
.border_1px_333 {
	border:solid 1px #333;}
	
.table_basic {
	width:96%;
	margin-left:2%;
	margin-right:2%;}
	
.control_photo {
	width:100%;
	height:auto;
	}
    
.photo_circle {
    border-radius: 50%;
}

@media (max-width:768px) {/*スマホが横のときには、menuが出るようにしている*/
.product_text_bold {
	margin:4% 2% 0% 2%;}
	
.product_text {
	margin:3% 2%;}
	
.product_profile {
	float:left;
	margin:2% 0%;
	width:64%;}
	
.product_menu {
	display:none;}
	

}

@media (max-device-width:480px) {	
.sample_media {
	display:none;}
}

.youtube_wrapper {/*スマホ用のyoutube埋め込み*/
	display:none;}
	
@media (max-device-width:480px) {
.youtube_wrapper {
	display:block;
	width:100%;
	margin:5% 0;
	text-align:center;}
}

.controls {
	position:relative;
	float:left;
	margin:2% 2% 2% 0;
	width:62%;
}

/*** テキスト装飾用 ***/

.text_small {font-size:80%;}

.line {
	margin:2% 2% 4% 2%;
	width:96%;
	height:1px;
	background-color:#888;}
	
/*** MixitUp ***/

*{
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

button{
  font-family:font-family 'Helvetica Neue, arial, sans-serif';
}

.controls{
  margin-top:0;
  padding: 0% 1.8%;
  width:100%;
  color: #888;
  font-size: 12px;
  z-index:3;
}

label{
  font-weight: 300;
  margin: 0 0.4em 0 0;
}

button{
  display: inline-block;
  padding: 0.6em 1em;
  margin: 0.4em 0.2em;
  background: #888;
  border: 0;
  color: #fff;
  font-size: 12px;
  font-weight: 300;
  border-radius: 4px;
  cursor: pointer;
}

button.active{
  background: #639;
}

button:focus{
  outline: 0 none;
}

button + label{
  margin-left: 1em;
}

.container{
  padding: 0% 1% 0% 1%;
  text-align:justify;
  font-size: 0;
  -webkit-backface-visibility: hidden;
  vertical-align:top;
  letter-spacing: -0.5em;
}

.container:after{
  content: '';
  display: inline-block;
  vertical-align:top;
  width: 100%;
}

.container .mix,
.container .gap{
  display:inline-block;
  vertical-align:top;
  letter-spacing: normal;
  margin-left: 1%;
  margin-right: 1%;
  width: 23%;
}

.container .mix{
  text-align: left;
  margin-bottom: 2%;
  vertical-align:top;
  display: none;
}

.container .mix.category1{
}

.container .mix.category2{
}

.container .mix.category3{
}

.container .mix.category4{
}

.container .mix.category5{
}

.container .mix:after{
  color: white;
  font-size: 16px;
  display:none;
  vertical-align: top;
  padding:0;
  font-weight: 700;
}

.container .mix:before{
  display: none;
  padding-top: 0;
}

.mix_card {
	background-color:#EEE;}
	

@media (min-width:1280px) {
  .container .mix,
  .container .gap{
    width: 18%;
	letter-spacing: normal;
  margin-left: 1%;
  margin-right: 1%;
  }
}

@media (min-width:1440px) {
  .container .mix,
  .container .gap{
    width: 14.66%;
	letter-spacing: normal;
  margin-left: 1%;
  margin-right: 1%;
  }
}

@media (min-width:1800px) {
  .container .mix,
  .container .gap{
    width: 12.285%;
	letter-spacing: normal;
  margin-left: 1%;
  margin-right: 1%;
  }
}

@media (max-width:768px) {
  .container .mix,
  .container .gap{
    width: 31.33%;
	letter-spacing: normal;
  margin-left: 1%;
  margin-right: 1%;
  }
}

@media (max-device-width:480px) {
button{
  font-size: 16px;
}
}

/***** 製品情報 *****/

.bg_gradation {
	position:relative;
	clear:both;
	display:inline-table;
	margin:5% 0 0 0;
	width:100%;
	height:auto;
	background-image:url(../image/brown_bg.jpg);
	background-repeat:repeat-x;}
	
.bg_white {
	position:relative;
	clear:both;
	display:inline-table;
	margin:5% 0 0 0;
	width:100%;
	height:auto;
	background-color: white;
	}
	
.table_left60 {
	position:relative;
	float:left;
	width:60%;
	padding:0% 2% 2% 2%;}
	
.table_left60x {
	position:relative;
	float:left;
	width:40%;
	margin-left: 10%;
	padding:0% 2% 2% 2%;}
	
.table_left40 {
	position:relative;
	float:left;
	width:36%;
	padding:0% 2% 2% 2%;}
	
.table_left30 {
	position:relative;
	float:left;
	width:25%;
	margin:0% 2% 2% 2%;}
	
.table_left20 {
	position:relative;
	float:left;
	width:17%;
	margin:0% 2% 2% 2%;}
	
.table_left10 {
	position:relative;
	float:left;
	width:8%;
	margin:0% 2% 2% 2%;}
	
.table100 {
	display:inline-table;
	width:96%;
	margin-left:2%;}
    
.table80 {
	display:inline-table;
	width:76%;
	margin-left:2%;
	margin-bottom: 2em;
    vertical-align: top;}
	
.table50 {
	display:inline-table;
	width:45%;
	margin-left:2%;
    vertical-align: top;}
    
.table60 {
	display:inline-table;
	width:50%;
	margin-left:2%;
    vertical-align: top;}
	
.table30 {
	display:inline-table;
	width:30.675%;
	margin-left:2%;}
	
.table25 {
	display:inline-table;
	width:22.5%;
	margin-left:2%;}
	
.table20 {
	display:inline-table;
	width:17.6%;
	margin-left:2%;
	margin-bottom: 2em;}
	
.table_photo {
	float:left;
	width:37%;
	margin-top:2%;
	margin-left:2%;}
	
.table_photo50 {
	float:left;
	width:47%;
	margin-top:2%;
	margin-left:2%;}
	
.img-center {display: block; margin-left: auto; margin-right: auto;}

.table_right90 {
	position:relative;
	float:left;
	width:78%;
	margin:0% 2% 2% 2%;}

.table_right80 {
	position:relative;
	float:left;
	width:76%;
	margin:0% 2% 2% 2%;}

.table_right70 {
	position:relative;
	float:left;
	width:67%;
	margin:0% 2% 2% 2%;}
	
.table_right60 {
	position:relative;
	float:left;
	width:62%;
	padding:0.2em 0.8em 0.5em 0.8em;}

.table_right40 {
	position:relative;
	float:left;
	width:38%;
	margin-top:3.5%;
	padding:0.2em 0.8em 0.5em 0.8em;
	background-image:url(../image/bg001_10.gif);
	border:solid 1px #ddd;}
    
.table_right50 {
	display: inline-block;
	width:42%;
	padding:2%;
    margin: 0 2%;
	background-color:#FFF;
	border:solid 1px #ddd;
    vertical-align: top;}
	
.table_right40x {
	position:relative;
	float:left;
	width:38%;
	margin-right: 10%;
	margin-bottom:1em;
	padding:0.5em 0.5em 0.5em 0.5em;
	background-image:url(../image/bg001_10.gif);
	border:solid 1px #ddd;}
	
.title_red200 {
	font-size:200%;
	background-image:url(../image/color_title_01.gif);
	background-size:4%;
	background-repeat:repeat-y;
	padding:0.4em 0em 0.4em 0.75em;
	line-height:1.4em;}
	
.title_blue200 {
	font-size:200%;
	background-image:url(../image/color_title_06.gif);
	background-size:4%;
	background-repeat:repeat-y;
	padding:0.4em 0em 0.4em 0.75em;
	line-height:1.4em;}
	
.table_border td, tr {
	border:solid 1px #ddd;
	padding:0.5em;}
	
.title_red {
	background-image:url(../image/color_title_01.gif);
	background-size:4%;
	background-repeat:repeat-y;
	padding:0.4em 0em 0.4em 0.75em;
	margin-bottom:-0.4em;
	line-height:1.2em;}
	
.title_interview {
	background-image:url(../image/color_title_01.gif);
	background-size:4%;
	background-repeat:repeat-y;
	padding:0em 0em 0em 1em;
	margin-bottom:2em;
	line-height:2em;}
	
.title_g_interview {
	background-image:url(../image/color_title_04.gif);
	background-size:4%;
	background-repeat:repeat-y;
	padding:0em 0em 0em 1em;
	margin-bottom:2em;
	line-height:2em;}
	
.title_orange {
	background-image:url(../image/color_title_02.gif);
	background-size:4%;
	background-repeat:repeat-y;
	padding:0.4em 0em 0.4em 0.75em;
	margin-bottom:-0.4em;
	margin-top:1em;
	line-height:1.2em;}
	
.title_yellow {
	background-image:url(../image/color_title_03.gif);
	background-size:4%;
	background-repeat:repeat-y;
	padding:0.4em 0em 0.4em 0.75em;
	margin-bottom:-0.4em;
	margin-top:1em;
	line-height:1.2em;}
	
.title_green {
	background-image:url(../image/color_title_04.gif);
	background-size:4%;
	background-repeat:repeat-y;
	padding:0.4em 0em 0.4em 0.75em;
	margin-bottom:-0.4em;
	margin-top:1em;
	line-height:1.2em;}
	
.title_green100 {
	background-image:url(../image/color_title_04.gif);
	background-size:2%;
	background-repeat:repeat-y;
	padding:0.4em 0em 0.4em 0.75em;
	margin-bottom:-0.4em;
	margin-top:1em;
	line-height:1.2em;}

.title_purple {
	background-image:url(../image/color_title_05.gif);
	background-size:4%;
	background-repeat:repeat-y;
	padding:0.4em 0em 0.4em 0.75em;
	margin-bottom:-0.4em;
	margin-top:1em;
	line-height:1.2em;}
	
.title_blue {
	background-image:url(../image/color_title_06.gif);
	background-size:4%;
	background-repeat:repeat-y;
	padding:0.4em 0em 0.4em 0.75em;
	margin-bottom:-0.4em;
	margin-top:1em;
	line-height:1.2em;}
	
.title_gray {
	background-image:url(../image/color_title_07.gif);
	background-size:4%;
	background-repeat:repeat-y;
	padding:0.4em 0em 0.4em 0.75em;
	margin-bottom:-0.4em;
	margin-top:1em;
	line-height:1.2em;}
	
.title_white {
	background-image:url(../image/color_title_08.gif);
	background-size:4%;
	background-repeat:repeat-y;
	padding:0.4em 0em 0.4em 0.75em;
	margin-bottom:-0.4em;
	margin-top:1em;
	line-height:1.2em;}
	
.title_none {
	background-size:4%;
	background-repeat:repeat-y;
	padding:0.4em 0em 0.4em 0.75em;
	margin-bottom:-0.4em;
	line-height:1.2em;}
	
.table_xtomp {
	display:inline-table;
	vertical-align:top;
	width:47.5%;
	margin-left:2%;
	margin-top:2%;
	padding:0;
	background-image:url(../image/bg001_10.gif);
	border:solid 1px #ddd;}
	
.table_xtomp100 {
	display:inline-table;
	vertical-align:top;
	width:98%;
	margin-left:2%;
	margin-top:2%;
	padding:0;
	background-image:url(../image/bg001_10.gif);
	border:solid 1px #ddd;}
	
@media (max-device-width:480px) {
	.title_none {
		width:0;
		height:0;
		padding:0;
		margin:0;
		line-height:0;
		}
	}
	
.text {
	line-height:2em; text-align:justify; letter-spacing: normal;}

	
.text_table_border {
	border-bottom:solid 1px #ddd;
	line-height:2.5em;
}

#fb {
	position:relative;
	float:left;
	margin:0.3em 1.2em 0 0;
	font-size:200%;}
	
#tw {
	position:relative;
	float:left;
	margin:0.3em 1.2em 0 0;
	font-size:200%;}
	
#os {
	position:relative;
	float:left;
	margin:0.3em 1.2em 0 0;
	font-size:200%;}
	
#ms {
	position:relative;
	float:left;
	margin:0.3em 0 0 0;
	font-size:200%;}
	
#product_navi {
	position:relative;
	clear:both;
	display:inline-table;
	margin:1% 0 0 0;
	width:100%;
	text-align:center;}
	
.product_navi_btn {
	list-style:none;
	display:inline-table;
	background-color:#ddd;
	margin:0em 0.5em 0em 0.5em;
	width:6em;
	height:6em;
	border-radius:50%;
	text-align: center;
	line-height:1.8em;
	padding-top:1.5em;
}

.marker_list {
	list-style:none;
	line-height:2em;
	margin: 0 0 0 0em; padding: 0;}

.marker_check {
	list-style:none;
	line-height:2em;}
.marker_check li:before{
    content: "\f058";
	color:rgba(65,183,96,1.00);
    font-family: FontAwesome;
    display: block;
    text-align: center;
    float: left;
    padding-right: 1em;
    width:0.5em;
	font-size:120%;
}

.marker_exclamation {
	list-style:none;
	line-height:2em;}
.marker_exclamation li:before{
    content: "\f071";
	color:rgba(235,10,0,1.00);
    font-family: FontAwesome;
    display: block;
    text-align: center;
    float: left;
    padding-right: 1em;
    width:0.5em;
	font-size:120%;
}

.marker_link {
	list-style:none;
	line-height:2em;}
.marker_link li:before{
    content: "\f0a9";
	color:orange;
    font-family: FontAwesome;
    display: block;
    text-align: center;
    float: left;
    padding-right: 1em;
    width:0.5em;
	font-size:120%;
}

.marker_plus {
	list-style:none;
	line-height:2em;}
.marker_plus li:before{
    content: "\f0fe";
	color:orange;
    font-family: FontAwesome;
    display: block;
    text-align: center;
    float: left;
    padding-right: 1em;
    width:0.5em;
	font-size:120%;
}

.marker_review {
	list-style:none;
	line-height:2.5em;}
.marker_review li:before{
    content: "\f234";
	color:rgba(65,183,96,1.00);
    font-family: FontAwesome;
    display: block;
    text-align: center;
    float: left;
    padding-right: 1.5em;
    width:0.5em;
	font-size:110%;
}

.marker_youtube {
	list-style:none;
	line-height:2.5em;}
.marker_youtube li:before{
    content: "\f16a";
	color:rgba(65,183,96,1.00);
    font-family: FontAwesome;
    display: block;
    text-align: center;
    float: left;
    padding-right: 1.5em;
    width:0.5em;
	font-size:110%;
}

.marker_music {
	list-style:none;
	line-height:2.5em;}
.marker_music li:before{
    content: "\f001";
	color:rgba(65,183,96,1.00);
    font-family: FontAwesome;
    display: block;
    text-align: center;
    float: left;
    padding-right: 1.5em;
    width:0.5em;
	font-size:110%;
}

.marker_spec {
	list-style:none;
	margin-left:2em;}
.marker_spec li:before{
    content: "\f105";
	color:tomato;
    font-family: FontAwesome;
    display: block;
    text-align: center;
    float: left;
    margin-right: 5px;
    width:0.5em;
	font-size:100%;
}

.marker_download {
	list-style:none;
	margin-left:2em;}
.marker_download li:before{
    content: "\f019";
	color:rgba(65,183,96,1.00);
    font-family: FontAwesome;
    display: block;
    text-align: center;
    float: left;
    padding-right: 1em;
    width:0.5em;
	font-size:120%;
}

.marker_slider {
	list-style:none;}
.marker_slider li:before{
    content: "\f1de";
	color:rgba(65,183,96,1.00);
    font-family: FontAwesome;
    display: block;
    text-align: center;
    float: left;
    margin-right: 1em;
    width:0.5em;
	font-size:110%;
	line-height:1.5em;
}

.marker_shop {
	list-style:none;
	line-height:2em;}
.marker_shop li:before{
    content: "\f098";
	color:#555;
    font-family: FontAwesome;
    display: block;
    text-align: center;
    float: left;
    padding-right: 1em;
    width:0.5em;
	font-size:120%;
}
.shop_list {
	border-bottom:solid 1px #ddd;
	margin-top:0.5em;
}

.cut {
	width:100%;}
	
.authorized {
}
.width74{
	width:74%;
}

@media (max-width:768px) {
.table_left60 {
	position:relative;
	clear:both;
	width:100%;
	padding:0% 2% 2% 2%;}
	
.table50 {
	display:inline-table;
	width:96%;
	margin-left:2%;
	margin-right:2%;}
	
.table30 {
	display:inline-table;
	width:96%;
	margin-left:2%;
	margin-right:2%;}
	
.table25 {
	display:inline-table;
	width:47%;
	margin-left:2%;}

.table_photo {
	float:left;
	width:96%;
	margin-top:2%;
	margin-left:2%;
	margin-right:2%;}
	
.table_right40 {
	position:relative;
	clear:both;
	width:100%;
	margin-top:3.5%;
	padding:0.2em 0.8em 0.5em 0.8em;
	background-image:url(../image/bg001_10.gif);
	border:solid 1px #ddd;}
	
.table_xtomp {
	position:relative;
	clear:both;
	width:100%;
	margin-top:2%;
	padding:0;
	background-image:url(../image/bg001_10.gif);
	border:solid 1px #ddd;}

#fb, #tw, #os, #ms {font-size:300%; text-align:center;}

#product_navi {
	margin:1% 0 0 -3%;
	width:100%;}
	
.product_navi_btn {
	margin:0;
	width:4.2em;
	height:4.2em;
	line-height:1.4em;
	padding-top:1em;
}
.div_left50 {
	display:inline-table;
	width:96%;
	margin-left:2%;
	margin-right:2%;}
	
.authorized {
	display:none;
}
.width74{
	width:96%;
	margin:0 2%;
}
}

/******点線などの装飾用*******/

.dot_line_black {background:url(../image/dot_black.gif); background-repeat:repeat-x;}
.spacer_5em { clear: both; width:100%; height:5em;}


/******登録フォーム用*******/

.submit-button {
   border: 1px solid #447314;
   background: #6aa436;
   background: -webkit-gradient(linear, left top, left bottom, from(#8dc059), to(#6aa436));
   background: -webkit-linear-gradient(top, #8dc059, #6aa436);
   background: -moz-linear-gradient(top, #8dc059, #6aa436);
   background: -ms-linear-gradient(top, #8dc059, #6aa436);
   background: -o-linear-gradient(top, #8dc059, #6aa436);
   background-image: -ms-linear-gradient(top, #8dc059 0%, #6aa436 100%);
   -webkit-border-radius: 4px;
   -moz-border-radius: 4px;
   border-radius: 4px;
   -webkit-box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0;
   -moz-box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0;
   box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0;
   text-shadow: #addc7e 0 1px 0;
   color: #385e0f;
   padding: 8.5px 18px;
   font-size: 14px;
   text-decoration: none;
   vertical-align: middle;
   }
.submit-button:hover {
   border: 1px solid #447314;
   text-shadow: #31540c 0 1px 0;
   background: #6aa436;
   background: -webkit-gradient(linear, left top, left bottom, from(#8dc059), to(#6aa436));
   background: -webkit-linear-gradient(top, #8dc059, #6aa436);
   background: -moz-linear-gradient(top, #8dc059, #6aa436);
   background: -ms-linear-gradient(top, #8dc059, #6aa436);
   background: -o-linear-gradient(top, #8dc059, #6aa436);
   background-image: -ms-linear-gradient(top, #8dc059 0%, #6aa436 100%);
   color: #fff;
   }
.submit-button:active {
   text-shadow: #31540c 0 1px 0;
   border: 1px solid #447314;
   background: #8dc059;
   background: -webkit-gradient(linear, left top, left bottom, from(#6aa436), to(#6aa436));
   background: -webkit-linear-gradient(top, #6aa436, #8dc059);
   background: -moz-linear-gradient(top, #6aa436, #8dc059);
   background: -ms-linear-gradient(top, #6aa436, #8dc059);
   background: -o-linear-gradient(top, #6aa436, #8dc059);
   background-image: -ms-linear-gradient(top, #6aa436 0%, #8dc059 100%);
   color: #fff;
   }
   
   /*Android対策*/	
@media (max-device-width:480px) {
	.text {
	max-height: 999999px;
	}
	
	.marker_spec {
	max-height: 999999px;
	}
	
	.sp{
	max-height: 999999px;
	}
}

/*　shure移管用　*/

.ikan {padding-left:280px; padding-right:50px;}
@media (max-device-width:480px) {.ikan {padding-left:10px; padding-right:10px; margin-top:150px;}}

/* XTOMP 特設ページ用　*/
.artist { padding-left:1em; background-image:url(../image/bg001_10.gif);}
.shopreview { border:solid 1px #555; background-image:url(../image/bg001_10.gif);}
.dot_1px { clear: both; width:100%; border-bottom: dotted 1px #555; margin:1em 0 3em 0;}

.submit-button2 {
float: left;
margin-right:1em;
   text-align: center;
   border: 1px solid #CCC;
   background: #EEE;
   -webkit-border-radius: 4px;
   -moz-border-radius: 4px;
   border-radius: 4px;
   color: #555;
   padding: 8.5px 18px;
   font-size: 14px;
   text-decoration: none;
   vertical-align: middle;
   }
.submit-button2:hover {
   border: 1px solid #CCC;
   background: #DDD;
   color: #555;
   }
.submit-button2:active {
   }
   
/*** table装飾用 ***/

.td_padding {padding:5px 10px 5px 10px;}
.td_gray {background:#eee;}