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

/*-------------------------------------------------- 
タイトル: 商品個別用（JQや各種エフェクト関連）
制作者 :EMJ

概要 : 

作成日 : 2014/02/20
変更日 : 
--------------------------------------------------*/

#detail {
	width: 950px;
	height: auto;
	color: #999;
	text-align:left;
	margin: 5px 10px 10px 0px;
	float: left;
}

#Lside {
	width: 550px;
	height: auto;
	float: left;
	margin-right: 10px;
}

#Rside {
	width: 390px;
	height: auto;
	float: left;
}

#Rside .details {
	width: 390px;
	height: auto;
	border-top: 2px solid #000;
	padding: 10px 20px 10px 20px;
	text-align:left;
	float: left;
	background-color: #fff;
}

#Rside .details h3{
	padding: 0px 0px 10px 0px;
	font-size: 24px;
	font-weight: bold;
	line-height: 1.4;
	color: #000;
}

#Rside .details p {
	width: 350px;
	height: auto;
	margin-bottom: 10px;
	text-align:left;
	float: left;
}

#Rside .mediacontainer {
	width: 390px;
	height: auto;
	margin-top: 10px;
	text-align:left;
	float: left;
}

#Rside .mediacontainer IMG{
	width: 390px;
	height: auto;
	border: 1px solid #333;
	margin-bottom: 7px;/*10px;*/
}


#Rside .mediacontainer a{
	filter: alpha(opacity=100);
	-moz-opacity:1;
	opacity:1;
}
#Rside .mediacontainer a:visited {}
#Rside .mediacontainer a:active  {}
#Rside .mediacontainer a:hover   {
	filter: alpha(opacity=70);
	-moz-opacity:0.70;
	opacity:0.70;
}




.otoku{
	width: 390px;
	height: auto;
	padding: 10px 0px 0px 0px;
	border-top: 1px solid #9EAF2B;
	color: #9EAF2B;
	font-size: 20px;
	float: left;
	text-align:  !important;
}

#Lside .image_container{
	width: 550px;
	height: auto;
	border-top: 2px solid #000;
	float: left;
	margin: 0px 10px 20px 0px;;
}

#Lside .image_container IMG{
	width: 550px;
	height: auto;
}

#Lside .description {
	width: 550px;
	height: auto;
	padding: 0px 10px 0px 10px;
}

#Lside .description h4{
	font-size: 24px;
	font-weight: normal;
	xcolor: #E95513;
	line-height: 1.4;
	margin: 0px 0px 20px 0px;
}

.blk{color: #000;}

/* global button setup
-------------------------------------------------- */

#detail .btn01 {
	width: auto;
	height: 20px;
	padding: 5px 10px 5px 10px;

	background: #666;
	border: 1px solid #333;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;

	color: #fff;
	text-decoration: none;
	text-align: center;
	float: left;
	display: block;

	/*Transition*/
	-webkit-transition: All 0.5s ease;
	-moz-transition: All 0.5s ease;
	-o-transition: All 0.5s ease;
	-ms-transition: All 0.5s ease;
	transition: All 0.5s ease;

}

#detail .btn01:link {color: #fff;}
#detail .btn01:visited {color: #fff;}
#detail .btn01:active {color: #fff;}
#detail .btn01:hover {color: #fff; background-color: #A5B725; border-color: #999900; }

/* For FLAT UI
-------------------------------------------------- */
/*BUTTON*/
#detail .btn {
	padding: 8px 12px 8px;
	line-height: 22px;
}

#detail .btn-block {
	display: block;
	width: 50px;
	padding-right: 0;
	padding-left: 0;
}

#detail .btn, .btn-group > .btn, .btn-group > .dropdown-menu, .btn-group > .popover {
	font-size: 13px;
	font-weight: 400;
}

#detail .btn.btn-lg,
#detail .input-group-lg .btn {
	xwidth: auto;
	font-size: 12px;
	font-weight:bold;
	line-height: 20px;
	letter-spacing: 0px;
	padding: 0px 7px;;
}


/*SELECT MENU*/
#detail .select .btn .filter-option {
	height: 26px;
	left: 13px;
	overflow: hidden;
	position: absolute;
	right: 33px;
	text-align: left;
	top: 10px;
}

#detail .select {
	display: inline-block;
	margin-bottom: 0px;
}

#detail .select.select-block {
	display: inline-block;
	float: none;
	margin-left: 0;
	width: 120px;
}

#detail .btn.btn-primary {
	background-color: #F5F3EE;
	border: 1px solid #595959;
	color: #373838;
}
#detail .btn.btn-primary:hover,
#detail .btn.btn-primary:focus,
#detail .btn-group:focus .btn.btn-primary.dropdown-toggle {
	background-color: #CECDCC;
}
#detail .btn.btn-primary:active,
#detail .btn-group.open .btn.btn-primary.dropdown-toggle,
#detail .btn.btn-primary.active {
	background-color: #CECDCC;
	color: #373838;
}

#detail .open > .dropdown-menu {
	margin-top: 18px;
	opacity: 1;
	visibility: visible;
	width: 70px;
}

#detail .dropdown-menu {
	min-width: 120px;
}

#detail .dropdown-inverse {
	background-color: #F5F3EE;
	color: #cccccc;
	padding: 4px 0 6px;
}

#detail .dropdown-menu li.active > a:hover,
#detail .dropdown-menu li.selected > a:hover,
#detail .dropdown-menu li.active > a.highlighted:hover,
#detail .dropdown-menu li.selected > a.highlighted:hover,
#detail .dropdown-menu li.active > a:focus,
#detail .dropdown-menu li.selected > a:focus,
#detail .dropdown-menu li.active > a.highlighted:focus,
#detail .dropdown-menu li.selected > a.highlighted:focus {
	background: #F5F3EE;
	color: #373838;
}

#detail .dropdown-inverse li > a {
	border-radius: 2px;
	color: #373838;
	padding: 5px 11px 7px;
	width: 100px;
}

#detail .dropdown-inverse li > a:hover, .dropdown-inverse li > a:active, .dropdown-inverse li > a:focus {
	background-color: #CECDCC;
	color: #fff;
}

#detail .dropdown-inverse li.selected > a {
	background: #B2B2B2;
	color: #ffffff;
	position: relative;
	z-index: 1;
}

#detail .dropdown-arrow-inverse {
	border-bottom-color: #373838 !important;
	border-top-color: #373838 !important;
}

#detail .select .caret {
	border-bottom-color: #373838;
	border-top-color: #373838;
}

/*CHECK BOX*/
#detail .checkbox.checked, .radio.checked {
	color: #595959;
}

#detail .checkbox.checked .second-icon, .radio.checked .second-icon {
	color: #595959;
	-webkit-transition: color 0.25s linear;
	-moz-transition: color 0.25s linear;
	-o-transition: color 0.25s linear;
	transition: color 0.25s linear;
	-webkit-backface-visibility: hidden;
	opacity: 1;
	filter: alpha(opacity=100);
}

#detail .checkbox, .radio {
	font-size: 20px;
}

/* this added to control look of count select control */
#count{
	width:55px;
	padding : 3px 0px 3px 8px;
	font-size:12px;
	height: 30px;
	border-radius:3px;
}

#detail input:focus, textarea:focus {
	border: 2px solid #545656;
}

#detail .form-control::-moz-placeholder {
	color: #000000;
}

/*
input.btn-block[type="submit"],
input.btn-block[type="reset"],
input.btn-block[type="button"] {
    width: 110px;
    height: 33px;
}
*/

#detail input[type="submit"].btn-block,
#detail input[type="reset"].btn-block,
#detail input[type="button"].btn-block {
	width: 110px;
	height: 33px;
	padding: 0px 7px;
}


#detail .btn.btn-HCC_STD {
	width: 150px;
	height: 33px;
	padding: 7px 7px;
	background-color: #373838;
	display: inline-block;
}
#detail .btn.btn-HCC_STD:hover,
#detail .btn.btn-HCC_STD:focus,
#detail .btn-group:focus .btn.btn-HCC_STD.dropdown-toggle {
	background-color: #545656;
}
#detail .btn.btn-HCC_STD:active,
#detail .btn-group.open .btn.btn-HCC_STD.dropdown-toggle,
#detail .btn.btn-HCC_STD.active {
	background-color: #757777;
}




/* ローンチ後改修追加設定
-------------------------------------------------- */
#Lside .description p {
	font-size: 14px;
	letter-spacing: 2px;
	margin-bottom: 15px;
}

#Lside .description p .kome{
	font-size: 10px;
	vertical-align: 3px;
}

#Lside .description p.subtitle{
	font-size: 20px;
	line-height: 1.4;
	color: #9D9D21;
	margin-bottom:20px;
}

#Lside .description h4.kome{
	font-size: 10px;
	vertical-align: 11px;
}

#Lside .description h5{
	width: 530px;
	height: auto;
	font-size: 20px;
	font-weight: normal;
	color: #9D9D21;
	line-height: 1.4;
	margin: 50px 0px 20px 0px;
	border-left-width: 10px;
	border-left-style: solid;
	border-bottom: 1px solid #999;
	padding-left: 10px;
	clear: both;
	float: left;
}

#Lside .description h5 .kome{
	font-size: 10px;
	vertical-align: 8px;
}

#Lside .description IMG{
	display: block;
	margin: 10px 0px 5px 0px;
	text-align: center;
	border: 1px solid #333;
	xfloat: left;
}

#Lside .description IMG.mawarikomi{
	display:inline;
	margin: 10px 10px 5px 0px;
	text-align: center;
	vertical-align: -30px;
	float: left;
}

#Lside .description IMG.example7 {
	display:inline;
	vertical-align: -30px;
}

#Lside .description .cap{
	font-size: 12px;
	line-height: 1.5em;
}

/* 説明文用
-------------------------------------------------- */
#Lside .description ul {
	width: 550px;
	font-size: 12px;
	letter-spacing: 1.5px;
	color: #333;

	padding: 10px 0px 0px 2em;
	margin-top: 40px;
	border-top: 1px dashed #999;
	float: left;
}

#Lside .description ul li {
	text-indent: -2.2em;
	line-height: 2em;
}

#Lside .description ol {
	font-size: 14px;
	letter-spacing: 2px;
	color: #333;
	padding-left: 2em;
}

#Lside .description ol li .kome{
	font-size: 10px;
	vertical-align: 3px;
}

#Lside .description ol li {
	list-style-type: decimal;
	text-indent: 0em;
	margin-bottom: 1.6em;
}

#Lside .description ul.descinner {
	border: none;
	padding: 10px 0px 0px 10px;;
	margin: 0;
}

#Lside .description ul li.descinner {
	list-style: circle;
	text-indent: 0em;
	margin-left: 1em;
	font-size: 14px;
	line-height: 1.6em;
}

#Lside .description ul li.descinner .kome{
	font-size: 10px;
	vertical-align: 3px;
}

#Lside .description ul .kome{
	font-size: 10px;
	vertical-align: 3px;
}

#Lside .description ul li .kome{
	font-size: 8px;
	vertical-align: 3px;
}

#Rside .details IMG {
	width: 360px;
	height: auto;
	padding-bottom: 7px;
	margin-bottom: 10px;
	border-bottom: 1px solid #999;
	float: left;
}

#Rside .cap{
	font-size: 12px;
	color: #333;
	line-height: 1.5em;
}

#Rside .cap .kome{
	font-size: 10px;
	vertical-align: 3px;
}

rt{
	font-size: 10px;
}

.checkbox .icons, .radio .icons {
	font-size: 20px;
	height: 20px;
	line-height: 30px;
}

.tablecontainerR ol {
	letter-spacing: 2px;
	color: #333;
	padding-left: 2em;
}

.tablecontainerR ol li .kome{
	vertical-align: 3px;
}

.tablecontainerR ol li {
	list-style-type: decimal;
	text-indent: 0em;
}

h4.slogan { color: #9D9D21; }


/* MRK追加設定
-------------------------------------------------- */

.detailpage .description dl.companyinfo  {
	width: 530px;
	height: auto;
	color: #9D9D21;
	float: left;
	font-size: 14px;
}

.detailpage .description .companyinfo dt {
	width: 150px;
	height: auto;
	float: left;
	clear:both;
	color: #9D9D21;
	xmargin: 15px 0px 5px 0px;
}

.detailpage .description .companyinfo dt.top {
	margin-top: 0px;
}

.detailpage .description .companyinfo dd {
	width: 340px;
	height: auto;
	float: left;
	margin: 0px 0px 20px 10px;
}


.detailpage .description dl.mission  {
	width: 530px;
	height: auto;
	color: #9D9D21;
	float: left;
}

.detailpage .description .mission dt {
	color: #9D9D21;
	font-weight: 400;
	font-size: 16px;
	margin: 10px 0px 7px 0px;
}

.detailpage .description .mission dt.top {
	margin-top: 0px;
}

.detailpage .description .mission dd {
	font-size: 14px;
	xwidth: 340px;
	xheight: auto;
	xfloat: left;
	xmargin: 0px 0px 20px 10px;
}

/* 040_join.html
-------------------------------------------------- */
#detail h3.join_title {
	font-size: 24px;
	font-weight: normal;
	xcolor: #E95513;
	line-height: 1.4;
	margin: 0px 0px 20px 0px;
}

#detail .join_containerS {
	xdisplay:table;
	width:100%;
}

.join_box {
	display: block;
	width: 315px;
	padding: 10px 10px 20px 10px;
	background-color: #fff;
	float: left;
	position: relative;
}



.join_box_M {
	display: block;
	width: 945px;
	padding: 10px 10px 20px 10px;
	background-color: #fff;
	float: left;
	position: relative;
}

.join_box.Lside {
	margin-right: 5px;
	border: 10px solid #C4E3EE;
}

.join_box.Cside {
	border: 10px solid #C4E1CD;
	border-right: 5px solid #C4E1CD;
}

.join_box.Rside {
	border: 10px solid #C4E1CD;
	border-left: 5px solid #C4E1CD;
}



.join_box_M.Mside {
	border: 10px solid #999900;
	border-left: 10px solid #999900;
	margin-top: 5px;
	margin-bottom: 5px;
}


.join_box h4 {
	color: #333;
	font-size: 20px;
	font-weight: 300;
}

#detail table.join_table {
	width: 275px;
	border: 3px #666 solid;
	border-collapse: collapse;
	border-spacing: 0;
	text-align: left;
	vertical-align: text-top;
	margin: 10px 0;
	float: left;
}

#detail table.join_table td, th {
	border: 1px #D9D9D9 solid;
	border-top: 1px solid #333;
	padding: 7px;
	font-weight: 300;
	font-size: 12px;
}

#detail table.join_table th {
	font-weight: 400;
	background: #F7F5F1;
}


#detail table.join_table_M {
	width: 905px;
	border: 3px #666 solid;
	border-collapse: collapse;
	border-spacing: 0;
	text-align: left;
	vertical-align: text-top;
	margin: 10px 0;
	float: left;
}

#detail table.join_table_M td, th {
	border: 1px #D9D9D9 solid;
	border-top: 1px solid #333;
	padding: 7px;
	font-weight: 300;
	font-size: 12px;
}

#detail table.join_table_M th {
	font-weight: 400;
	background: #F7F5F1;
}




#detail .join_containerS .btn.btn-primary.MRK_shop {
	width: 100%;
	background-color: #C4E3EE;
	border: 1px solid #75b6ce;
	margin-top: 10px;
	padding: 6px 7px;
	color: #75b6ce;
}

#detail .join_containerS .btn.btn-HCC_STD.MRK_shop:hover,
#detail .join_containerS .btn.btn-HCC_STD.MRK_shop:focus,
#detail .join_containerS .btn-group:focus .btn.btn-HCC_STD.dropdown-toggle.MRK_shop {
	background-color:#75b6ce;
	color: #fff;
}

#detail .join_containerS .btn.btn-primary.MRK_join {
	width: 100%;
	background-color: #C4E1CD;
	border: 1px solid #099e72;
	margin-top: 10px;
	padding: 6px 7px;
	color: #099e72;
}

#detail .join_containerS .btn.btn-HCC_STD.MRK_join:hover,
#detail .join_containerS .btn.btn-HCC_STD.MRK_join:focus,
#detail .join_containerS .btn-group:focus .btn.btn-HCC_STD.dropdown-toggle.MRK_join {
	background-color:#099e72;
	color: #fff;
}

#detail .join_containerS .join_btn {
	position: absolute;
	margin-bottom: 20px;
	bottom: 0px;
	width: 265px;
	float: left;
	clear: both;
}

/* 040_join_B.html
-------------------------------------------------- */
#detail h3.join_title {
	font-size: 24px;
	font-weight: normal;
	xcolor: #E95513;
	line-height: 1.4;
	margin: 0px 0px 20px 0px;
}

#detail .join_containerS_B {
	xdisplay:table;
	width:100%;
}

#detail .join_containerS_B .join_box {
	display: block;
	width: 320px;
	padding: 10px 10px 20px 7px;
	background-color: #fff;
	float: left;
	position: relative;
}

#detail .join_containerS_B .join_box.Lside {
	margin-left: 5px;
	border: 10px solid #C4E3EE;
}

#detail .join_containerS_B .join_box.Cside {
	border: 10px solid #C4E1CD;
	border-right: 5px solid #C4E1CD;
}

#detail .join_containerS_B .join_box.Rside {
	border: 10px solid #C4E1CD;
	width: 620px;
}

#detail .join_containerS_B .join_box.Rside .innerbox {
	width: 285px;
	float: left;
	margin: 0px 10px 0px 2px;
}

#detail .join_containerS_B .join_box.Rside .innerbox.last {
	margin: 0px 0px 0px 0px;
}

#detail .join_containerS_B .join_box p{
	padding: 10px;
	xheight: 120px;
}

#detail .join_containerS_B .join_box h4 {
	color: #333;
	font-size: 20px;
	font-weight: 300;
}

#detail .join_containerS_B .join_box table.join_table {
	width: 285px;
	border: 3px #666 solid;
	border-collapse: collapse;
	border-spacing: 0;
	text-align: left;
	vertical-align: text-top;
	margin: 10px 0;
	float: left;
}

#detail .join_containerS_B #detail table.join_table td, th {
	border: 1px #D9D9D9 solid;
	border-top: 1px solid #333;
	padding: 7px;
	font-weight: 300;
	font-size: 12px;
}

#detail .join_containerS_B #detail table.join_table th {
	font-weight: 400;
	background: #F7F5F1;
}

#detail table.join_table .item {
	width: 150px;
}

#detail table.join_table .one_line {
	text-align: center;
	font-weight: 400;
}

#detail table.join_table .one_line .special {
	color:#099e72;
	font-weight: 700;
}

#detail table.join_table .one_line_no_s {
	text-align: center;
	color: #ccc;
	text-decoration: line-through;
}


#detail .join_containerS_B .btn.btn-primary.MRK_shop {
	width: 100%;
	background-color: #C4E3EE;
	border: 1px solid #75b6ce;
	margin-top: 10px;
	padding: 6px 7px;
	color: #75b6ce;
}

#detail .join_containerS_B .btn.btn-HCC_STD.MRK_shop:hover,
#detail .join_containerS_B .btn.btn-HCC_STD.MRK_shop:focus,
#detail .join_containerS_B .btn-group:focus .btn.btn-HCC_STD.dropdown-toggle.MRK_shop {
	background-color:#75b6ce;
	color: #fff;
}

#detail .join_containerS_B .btn.btn-primary.MRK_join {
	width: 100%;
	background-color: #C4E1CD;
	border: 1px solid #099e72;
	margin-top: 10px;
	padding: 6px 7px;
	color: #099e72;
}

#detail .join_containerS_B .btn.btn-HCC_STD.MRK_join:hover,
#detail .join_containerS_B .btn.btn-HCC_STD.MRK_join:focus,
#detail .join_containerS_B .btn-group:focus .btn.btn-HCC_STD.dropdown-toggle.MRK_join {
	background-color:#099e72;
	color: #fff;
}

#detail .join_containerS_B .join_btn {
	position: absolute;
	margin-bottom: 20px;
	bottom: 0px;
	width: 290px;
	float: left;
	clear: both;
}

#detail .join_containerS_B .join_btnR {
	position: absolute;
	margin-bottom: 20px;
	bottom: 0px;
	width: 580px;
	float: left;
	clear: both;
}





/*- - - - - - - - - - - - - - - - - - - */
/* 製作時特殊設定
/*- - - - - - - - - - - - - - - - - - - */
#Lside .description p.con {
	color: #FF0000;
	font-size: 100px;
	line-height: 1.3em;
}














