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

    stype.css 2014.08.22

    Copyright 2011-2014 BPOTech Joint Stock Company. All Rights Reserved.
    URL http://bpotech.com.vn/

****************************************************************************/

/*=============================================================*/
/* Reset CSS
/*=============================================================*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
/*
 	font-weight: inherit;
	font-variant: inherit;
	font-style: inherit;
*/
 	font-size: 100%;
/*
	font-family: inherit;
*/
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
	min-width: 1035px;
	font-family: "游ゴシック体", "Yu Gothic", YuGothic,"メイリオ", "ヒラギノ角ゴ Pro W3", Verdana, Arial, Helvetica, "ＭＳ Ｐゴシック", clear, sans-serif;
	font-size: 12px;
}
ol, ul {
	list-style: none;
}
a, a:link, a:visited {
	color: #000000;
	text-decoration: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
textarea:focus, input:focus{
  outline: 0;
}

/*HTML5 display-role reset for older browsers
------------------------------------------------*/
article, aside, details, figcaption, figure, footer, header, menu, nav, section {
	display: block;
}

html, body {
   height: 100%;
}

/*=============================================================*/
/* Upper
/*=============================================================*/
#upper {
	float: left;
	width: 100%;
/*	border-bottom: solid 1px #e1e1e1;*/
  padding: 10px 0;
  padding-top : 15px;
}
/*Avatar
------------------------------------------------*/
.avatar {
	float: left;
	margin-top: -10px;
  position: relative;
}

.avatar .avatar-name {
  display: none;
  position: absolute;
  top: -10px;
  left: -20px;
  background-color: #000000;
  padding: 5px;
  font-size: 11px;
  color: #ffffff;
  border-radius: 4px;
  z-index: 9999;
  text-align: center;
}

.circle-thumb {
    height: 40px;
    width: 40px;
/*    overflow: hidden;*/
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    border-radius: 100px;
    box-shadow: 0px 0px 0px 0px #F60;
    -moz-box-shadow: 0px 0px 0px 0px #F60;
    -webkit-box-shadow: 0px 0px 0px 0px #F60;
}
.circle-box img {
    width: auto;
    height: 50px;
/*    margin-left: -10%;*/
}

/*Menu
------------------------------------------------*/
#navLogo {
    float: left;
    padding: 20px 0px 0px 15px;
}
#width980 #navLogo {
    float: left;
    padding: 18px 10px;
    padding-left: 0;
}

#navMenu {
    float: left;
    margin-top:10px;
    padding: 15px 10px;
}

/*Navigation Upper
------------------------------------------------*/
#navUpper {
	float: right;
	height: 43px;
	margin-top: 14px;
}
#navUpper li {
  float: right;
  padding: 5px 10px;
  
/*
	float: left;
	padding: 5px 10px;
	*/
}
#navUpper li a {
	float: left;
}
#navUpper .navUpperIcon {
	padding: 2px 5px;
	margin-top: 0px;
}
#navUpper .navUpperIcon a img {
	float: left;
	margin-top: 1px;
	padding:3px;
}
#navUpper .navUpperIcon a span {
	float: left;
	margin-top: 4px;
	margin-left: 4px;
}
#navUpper .navUpperIcon a span.note {
	/*background-color: #d10c00;*/
	background-color: #B42C00;
	padding: 3px 5px;
	margin-left: -35%;
	margin-top: -7px;
	color: #ffffff;
	font-size: 10px;
	border-radius: 4px;
}
#navUpper .navUpperIcon a span.note.hide {
  visibility:hidden;
}

#navUpper li.login,
#navUpper li.signup {
	padding-top: 0px;
}

#navUpper li.login a,
#navUpper li.signup a{
  width:auto;
	font-size:12px;
  /*font-weight:bold;*/
  padding:10px 0;
  text-decoration:none;
  display:block;
}

#navUpper li.login a {
  color:#9f9f9f;
}

#navUpper li.signup a {
  padding:10px 20px;
  color:#fff;
  background-color:#32374a;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
}


.border-right {
	background: url("../image/dot-right.png") repeat-y right top;
}
.pad-left {
	padding-left: 0 !important;
}
/*Navigation Search
------------------------------------------------*/
#navSearch {
	float: right;
	position: relative;
	margin-right: 10px;
	margin-top: 0px;
}
#navSearch .search {
	padding: 7px 30px;
	width: 180px;
	background-color: #f0f0f0;
	color: #787878;
	border: none;
}
#navSearch .iconSearch {
	position: absolute;
	top: 0;
	left: 0;
	height: 31px;
	width: 23px;
	background: url("../image/icon_search.png") no-repeat right center;
	border: none;
}
#positon100 {
	float: left;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
/*
#btnHideMenu {
	float: left;
	position: absolute;
	height: 50px;
	width: 188px;
	top: 0;
	left: 0;
}
#hideMenu {
	position: absolute;
	top: 50px;
	left: 0;
	width: 145px;
	height: 110px;
	padding: 20px;
	background-color: #ffffff;
	border: solid 1px #e1e1e1;
	border-top: none;
	box-shadow: 2px 3.464px 6px 0px #f5f4f5;
	display: none;
	z-index: 9999;
	height: auto;
	padding-bottom: 0;
}
#hideMenu li {
	float: left;
	width: 100%;
	margin-bottom: 20px;
}
*/

input[type=submit],
input[type=button],
button {
  cursor: pointer;
}

input[type=submit]:disabled,
input[type=button]:disabled,
button:disabled {
  cursor: auto;
}

a:hover {
	color: #ff7e00;
}

.menu {
  float:left;
  width:auto;
  padding:0;
  padding-top:12px;
  padding-left : 20px;
  margin:0;
  border: none;
  list-style: none;
/*  font-weight: bold;*/
}

.menu li {
  width:auto;
  float:left;
  padding:0 20px;
  margin:0;
  text-align:center;
}

.menu li a {
  width:auto;
  /*color:#9f9f9f;*/
  color:#cccccc;
  font-size:12px;
  /*font-weight:bold;*/
  padding:10px 0;
  text-decoration:none;
  display:block;
}

.menu li.active a {
  color:#11162e;
  /*border-bottom:3px solid;*/
}

.dropdownMenu {
  position: relative;
  float: left;

  box-sizing: border-box;
  margin: 0;
  padding: 5px;
  /*width: 100px;*/
}

.dropdownMenu a,
.dropdownMenu .name {
  color:#9f9f9f;
  font-size:14px;
  font-weight:bold;
  white-space: nowrap;
}

.dropdownMenuRight ul {
  margin-left: -50px;
}

.dropdownMenu ul {
    position: absolute;
    z-index: 9999;
    display: none;

    top: 33px;
    /*left: -1px;*/
    right: -15px;
    width: 160px;
    height: auto;
    background-color: #fff;
    border: solid 1px #b4bec5;
    box-shadow: 2px 3.464px 6px 0px #f5f4f5;

    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
}

.dropdownMenu ul li {
    width: 100%;
    height : auto;
    border-bottom : 1px dotted #e1e1e1;
    padding : 0;
/*    padding : 18px 0;*/
}
.dropdownMenu ul li:last-child {
    border: none;
}

.dropdownMenu ul li a {
  display: block;
  width: 100%;
  height: auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 18px 0;
  padding-left : 35px;
}

.dropdownMenu ul li:hover {
  background-color: #eff4f7;
}


[class^="module-triangle-"] {
  position: relative;
}
[class^="module-triangle-"]::before,
[class^="module-triangle-"]::after {
	content: "";
  border: solid transparent;
  display: inline-block;
  position: absolute;
}
.module-triangle-top::before {
  border-width: 10px;
  border-bottom-color: #b4bec5;
  margin-left: -10px;
  left: 50%;
  top: -20px;
}
.module-triangle-top::after {
  border-width: 10px;
  border-bottom-color: #fff;
  margin-left: -10px;
  left: 50%;
  top: -18px;
}

.module-triangle-right::before {
  border-width: 10px;
  border-left-color: #b4bec5;
  margin-top: -10px;
  top: 50%;
  right: -20px;
}
.module-triangle-right::after {
  border-width: 10px;
  border-bottom-color: #fff;
  margin-top: -10px;
  top: 50%;
  right: -18px;
}

.module-triangle-bottom::before {
  border-width: 10px;
  border-top-color: #b4bec5;
  margin-left: -10px;
  left: 50%;
  bottom: -20px;
}
.module-triangle-bottom::after {
  border-width: 10px;
  border-bottom-color: #fff;
  margin-left: -10px;
  left: 50%;
  bottom: -18px;
}
.module-triangle-left::before {
  border-width: 10px;
  border-right-color: #b4bec5;
  margin-top: -10px;
  left: -20px;
  top: 50%;
}
.module-triangle-left::after {
  border-width: 10px;
  border-bottom-color: #fff;
  margin-top: -10px;
  left: -18px;
  top: 50%;
}

.dropdownMenu ul.module-triangle-top::before,
.dropdownMenu ul.module-triangle-top::after {
  left: 85%;
}

/*
.listMenu {
  position: relative;
  float: left;
  margin: 0;
  padding: 5px;
  width: 90px;
  border: none;
  font-weight: bold;
}
.listMenu ul {
    display: none;
    position: absolute;
    top: 35px;
    left: -1px;
    width: 160px;
    height: auto;
    padding: 15px;
    padding-bottom: 0;
    background-color: #ffffff;
    border: solid 1px #e1e1e1;
    box-shadow: 2px 3.464px 6px 0px #f5f4f5;
    z-index: 9999;
}
.listMenuRight ul {
	margin-left: -80px;
}
.listMenu ul li {
    float: left;
    width: 100%;
    border-bottom : 1px solid #e1e1e1;;
    margin-bottom: 20px;

}
.listMenu ul li a {
  display: inline-block;
  width: 100%;
  height: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
*/

/* .notices */
#notices-box {
  /*display: none;*/
  position: relative;
  float: left;
  margin: 0;
  padding: 0;
  width: 0;
}


#notices {
  display :none;
  position: absolute;
  overflow:hidden;
  top: 25px;
  right: 10px;
  width: 350px;
  height: auto;
  background-color: #ffffff;
  padding: 0;
  border: solid 1px #e1e1e1;
  z-index: 9998;

  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  box-shadow: 2px 3.464px 6px 0px #f5f4f5;
  -moz-box-shadow: 2px 3.464px 6px 0px #f5f4f5;
  -webkit-box-shadow: 2px 3.464px 6px 0px #f5f4f5;
/*
  box-shadow: 0px 0px 0px 0px #F60;
  -moz-box-shadow: 0px 0px 0px 0px #F60;
  -webkit-box-shadow: 0px 0px 0px 0px #F60;
*/
}
#notices ul.items {
  max-height:200px;
}

#notices ul.items li {
  float:left;
	position:relative;
  padding: 0;
  width:100%;
  clear: both;
  border-bottom: solid 1px #e1e1e1;
}

#notices ul.items li.header {
  background-color: rgba( 0, 0, 0, 0.65 );
/*background-color: #000000;*/
  color: #fff;
  font-size:12px;
  position: relative;
}
#notices ul.items li.header span {
  line-height : 20px;
  margin-left: 5px;
}
#notices ul.items li.header a {
  position:absolute;
  line-height : 20px;
  top:0;
  right:0;
  margin-right: 5px;
  color: #d0d0d0;
  font-size: 10px;
}
#notices ul.items li.header a:hover {
  color: #ff7e00;
}

#notices ul.items li.more {
  text-align: center;
  font-size:9px;
}
#notices ul.items li.more a {
	width:100%;
  line-height : 16px;
  padding: 4px 0;
}

#notices ul.items li.items {
  overflow: auto;
  max-height:450px;
}

#notices ul.items li.item {
  background-color: #F7F7F7;
}

#notices ul.items li.item:hover {
  background-color: rgba( 255, 248, 200, 0.75 );
}

#notices ul.items li.item .notice-icon {
	float : left;
  padding : 2px;
  width : 40px;
  overflow: hidden;
}

#notices ul.items li.item .notice-info {
  float : left;
  padding : 4px;
  width : 55%;
  overflow: hidden;
}
#notices ul.items li.item .notice-info > a {
  width : 100%;
  overflow: hidden;
}

#notices ul.items li.item .notice-info .subject,
#notices ul.items li.item .notice-info .summary {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding : 3px 0;
}

#notices ul.items li.item .notice-meta {
  overflow: hidden;
  position : relative;
  float : right;
  width : 20%;
  padding:2px 0;
  padding-right: 5px;
}

#notices ul.items li.item .notice-meta .time {
  float : right;
  text-align:right;
  padding:3px 0;
  width: 60px;
}


#notices ul.items li.item .notice-meta .read-stat {
/*  position: absolute;*/
  float : right;
  text-align:center;
  font-size:9px;
  width:36px;
  height:15px;
/*  right: 5px;*/
/*  top: 20px;*/
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  padding-top: 4px;
}

#notices ul.items li.item .notice-meta .read-stat > a {
  float:none;
  color :#fff;
}

#notices ul.items li.item .notice-meta .read-stat.read {
  background-color:  #F0F0F0;
	color:silver;
/*
  background-color: rgba( 233, 255, 217, 1 );
  border:1px solid #a6ca8a;
*/
}
#notices ul.items li.item .notice-meta .read-stat.unread {
  color:#fff;
  background-color: #ff7e00;
  border:1px solid #f5aca6;
}

#back-panel-overlay{
  z-index:9000;
  display:none;
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:120%;
/*  background-color:rgba(0,0,0,0.100);*/
  background-color: transparent;
}

/*=============================================================*/
/* Header
/*=============================================================*/

#header,
#header-top {
	float: left;
	width: 100%;
	padding: 15px 0;
}

#header {
  background-color: #fafafa;
	/*background-color: #f0f1f4;*/
  border-bottom: solid 1px #e1e1e1;
}



.breadcrumb {
  float:left;
  width:auto;
  padding:10px 5px;
  margin:0;
  border: none;
  list-style: none;
  color:#9f9f9f;
  font-size: 12px;
  font-weight: bold;
}

.breadcrumb li {
  width:auto;
  float:left;
  padding:0 5px;
  margin:0;
  text-align:center;
}

.breadcrumb li a {
  color:#9f9f9f;
}

#upper .topContent,
#header .topContent,
#header-top .topContent
/*#content .topContent*/ {
	width : 1230px;
  height : auto;
}


/*Left Header
------------------------------------------------*/
#header .box,
#header-top .box {
  background-color: #fafafa;
  height : auto;
  width : 100%;
  padding: 10px 0;
}


#leftHeader {
	float: left;
	margin-left: 30px;
/*	width: 70%;*/
  font-size:14px;
}

#navMain {
	float: left;
  padding:20px 0;
	width: 100%;
  background-color: #fafafa;
}
#navMain li {
	float: left;
	margin-left : 20px;
  width : 80px;
}

#navMain li {
	margin-bottom: 3px;
}
#navMain li img {
	padding-right: 3px;
}
#navMain li.off {
    opacity:0.6;
    filter: alpha(opacity=60);        /* ie lt 8 */
    -ms-filter: "alpha(opacity=60)";  /* ie 8 */
    -moz-opacity:0.6;                 /* FF lt 1.5, Netscape */
    -khtml-opacity: 0.6;              /* Safari 1.x */
    zoom:1;
}

#header #width980 #leftHeader {
    margin-left: 0;
}
#header #width980 #leftHeader #navMain {
    width: 100%;
}
#header #width980 #leftHeader #navMain li {
    margin-right: 20px;
}



/*Right Header
------------------------------------------------*/
#rightHeader {
	float: right;
/*	width: 230px;*/
	margin-right: 10px;
}

#rightHeader #facebook,
#rightHeader #tweet {
	float: left;
	margin: 7px 2px;
}

/*=============================================================*/
/* Content
/*=============================================================*/
#content {
	float: left;
	width: 100%;
	position: relative;
	height: auto; /*100%;*/
	margin: 0 auto;
}

/* Top Content
------------------------------------------------*/
.topContent {
	position : relative;
  margin: 0 auto !important;
	width : 1260px;
  height: auto;
  box-sizing:border-box;
}

.leftContent {
  float: left;
  background: url("../image/solid-right-content.png") repeat-y top right;
  width: 990px;
  height: 100%;
}
.rightContent {
  float: right;
  width: 240px;
}


/*Left Content
------------------------------------------------*/
#leftContent {
	float: left;
	background: url("../image/solid-right-content.png") repeat-y top right;
	width: 1106px;
  height: 100%;
}

.separateContent {
  float: left;
  background: url("../image/solid-right-content.png") repeat-y top right;
  width:1px;
  height: 100%;
}
/*Left Content footer
------------------------------------------------*/
.footer {
/*  overflow: hidden;*/
  _height: 1.5em;
  color: #949494;
  border-top: 1px solid #e1e1e1;
/*  margin-top: 15px;*/
}

.footer .footer-group
{
  padding : 30px 30px;
  margin: 0 auto;
  text-align: center;
}

.footer .navi ul {
  padding-top: 20px;
}
.footer .navi li {
  float:left;
  padding: 0 20px;
  display: inline-block;
/*  border-left: 1px solid #949494;*/
}

.footer .navi a {
  position:relative;
  color  : #949494;
}

/*
.footer .navi li:first-child {
  border: none;
}
*/

.footer .navi,
.footer .sns-icons,
.footer .copyright {
	padding : 6px 0;
	display: block;
  margin: 0 auto;
} 

.footer .copyright 
{
  padding:0;
  padding-top: 20px;
  padding-left: 10px;
  margin: 0 auto;
}

.footer .sns-icons ul li {
  display: inline-block;
  padding : 20px;
  padding-top: 30px;
}

.footer .sns-icons a.icon {
	display: block;
	text-decoration: none;
	-webkit-transition: color 0.2s ease-out;
	transition: color 0.2s ease-out;
	font-size: 170%;
	text-align: center;
	color: #CCC;
}

.footer .sns-icons a.icon.icon-facebook-hover:hover {
  color: #3A589E;
}
.footer .sns-icons a.icon.icon-twitter-hover:hover {
  color: #22ADEA;
}
.footer .sns-icons a.icon.icon-instagram-hover:hover {
  color: #9E6E4B;
}



/*
.leftContent .footer .right-footer {
   padding-top : 10px;
}
*/


/*Products Right Content
------------------------------------*/
#products {
/*
	float: left;
	width: 100%;
*/
}
#products h2.title {
  text-align: center;
  font-size: 24px;
  margin-top: 10px;
  padding : 15px 0;
}
#products h3.title {
  font-size: 11px;
  margin-top: 17px;
  text-align: center;
}

.itemProducts {
	float: left;
	position: relative;
	margin-bottom: 50px;
}
.imgItemProducts {
	width: 100%;
	text-align: center;
	float: left;
}
.imgProducts {
	cursor: pointer;
}
.groupItemProducts {
	float: left;
	padding: 3% 9%;
}
.avatarItemProducts {
	vertical-align: sub;
}
.titleItemProducts {
	line-height: 1.5;
}
.mouseOver {
	background-image: url("../image/mouse_over.png");
	position: absolute;
	left: 0;
	top: 0;
	display: none;
	min-width: 200px;
	padding: 10px;
}
.groupButton {
	width: 100%;
	position: absolute;
	bottom: 0;
	left: 0;
	float: left;
	padding: 16px 0;
	font-size: 11px;
	color: #ffffff;
}
.star {
	width: 45%;
	float: left;
	position: absolute;
	left: 0;
	top: 0;
	padding-left: 12px;
}
.star a {
	float: left;
	background: url("../image/icon_stars.png") no-repeat center;
	width: 25px;
	height: 25px;
}
.star a.done {
  float: left;
  background: url("../image/icon_stars2.png") no-repeat center;
}

.star span {
	float: left;
	margin-top: 6px;
	margin-left: 4px;
	cursor: pointer;
}
.like {
	width: 50%;
	float: left;
	position: absolute;
	top: 0;
	right: 0;
}
.like a {
	float: left;
	background: url("../image/icon_like.png") #ffffff no-repeat 4px center;
	border: solid 1px #e1e1e1;
	font-size: 11px;
	padding: 4px 9px 3px 17px;
	border-radius: 3px;
}
.like a.done {
  background: url("../image/icon_like_done.png") #ffffff no-repeat 4px center;
}
.like .count {
	float: left;
	margin-top: 1px;
	margin-left: 8px;
	background-color: #ffffff;
	color: #000000;
	padding: 4px 5px;
	border-radius: 3px;
	font-size: 11px
}
.like .count span {
	background: url("../image/arow_white.png") no-repeat left center;
	width: 5px;
	height: 7px;
	float: left;
	margin-left: -9px;
	margin-top: 2px;
}
.mouseOver h1 {
	float: left;
	width: 100%;
	color: #ffffff;
	font-size: 18px;
	text-align: center;
}
.mouseOver .groupItemProducts {
	float: left;
	width: 100%;
	text-align: center;
	padding: 0;
}
.mouseOver .groupItemProducts .titleItemProducts {
	float: none;
	color: #ffffff;
}
.mouseOver .groupItemProducts .avatarItemProducts {
	float: none;
	vertical-align: sub;
}
/*Right Content
------------------------------------------------*/
#rightContent {
	float: right;
	position: absolute;
	top: 0;
	right: 0;
	width: 275px;
  /*background: url("../image/solid-right-content.png") repeat-y top left;*/
}
#rightContent #inRightContent {
	padding: 25px;
}
#rightContent #inRightContent h1, #rightContent #inRightContent p {
	background: url("../image/dot-right-content.png") repeat-x bottom center;
}
/*News Right Content
------------------------------------*/
#rightContent #news, #rightContent #featured, #rightContent #comments {
	float: left;
	width: 100%;
	margin-bottom: 49px;
}
#rightContent #inRightContent h1 {
	float: left;
	position: relative;
	width: 100%;
	font-size: 14px;
	font-weight: bold;
	padding-bottom: 20px;
}
#rightContent #inRightContent h1 a {
	position: absolute;
	top: 2px;
	right: 0;
	font-size: 12px;
	font-weight: normal;
}
#rightContent #inRightContent p {
	float: left;
	width: 100%;
	margin-top: 13px;
	line-height: 19px;
	font-size: 11px;
	padding-bottom: 14px;
}
#rightContent #inRightContent #news p a {
	float: left;
	width: 100%;
	font-weight: bold;
	font-style: italic;
	font-size: 12px;
}
/*Featured Right Content
------------------------------------*/

#rightContent #inRightContent #featured p a {
	float: left;
	padding-right: 14px;
}
#rightContent #inRightContent #featured p span {
	float: left;
	width: 55%;
}
#rightContent #inRightContent #featured p span a {
	float: left;
	width: 72%;
	padding-right: 0;
}
.para-two {
	margin-top: 7px;
}
.width100 {
	width: 100% !important;
}
/*Comments Right Content
------------------------------------*/
.avatarSmall {
	float: left;
	width: 100%;
}
.avatarSmall img {
	float: left;
	padding-right: 16px;
}
.avatarSmall a {
	float: left;
}
.avatarSmall a.top2 {
	margin-top: 5px;
	font-size: 12px;
}
.para-one {
	float: left;
	width: 100%;
	margin-top: 17px;
}
/*=============================================================*/
/* Detail Page
/*=============================================================*/
#width980 {
	width: 980px;
	margin: 0 auto;
	position: relative;
}
#positon980 {
	width: 980px;
	margin: 0 auto;
	position: relative;
}
/*Header
------------------------------------------------*/
.magrinLeft0 {
	margin-left: 0!important;
}
.marginRight0 {
	margin-right: 0!important;
}
/*Left Content
------------------------------------------------*/
.width730 {
	width: 730px !important;
}
#detail {
	float: left;
	padding: 5.5% 5.5% 0 0;
	width: 94.5%;
}
/*Group Detail
-----------------------------------*/
#groupDetail {
	float: left;
	width: 100%;
}
#groupDetail h1 {
	width: 100%;
	font-size: 22px;
	margin-bottom: 18px;
}
#leftGroupDetail {
	float: left;
	margin-bottom: 30px;
  width: 55%;
/*
	width: 68%;
*/
}
#categoryDetail {
	float: left;
	margin-top: 4px;
}
#categoryDetail a {
	border-bottom: solid 1px #000000;
}
#categoryDetail a:hover {
	border-bottom: solid 1px #ff7e00;
}
#userDetail {
	float: left;
	margin-left: 25px;
	font-size: 13px;
	margin-top: 2px;
}
#userDetail .avatarItemProducts {
/*	margin-top: -5px;*/
}
#userDetail .titleItemProducts {
  margin-top: 5px;	
}

#rightGroupDetail {
	float: right;
	position: relative;
/*
	margin-top: -3px;
*/
  margin-top: 5px;
}
#rightGroupDetail .star {
	width: auto;
	position: relative;
	font-size: 10px;
}
#rightGroupDetail .star a {
	background: url("../image/icon_stars_black.png") no-repeat center;
	width: 23px;
	height: 23px;
}
#rightGroupDetail .like {
	width: auto;
	position: relative;
	padding: 2px 0;
}
#rightGroupDetail .like .count {
	border: solid 1px #e1e1e1;
	font-size: 11px;
	padding: 3px 15px 3px 5px;
}

#rightGroupDetail .star1 {
  background: url("../image/icon_stars_black.png") no-repeat left;
  height: 25px;
  float: left;
  padding-left: 25px;
  margin-left: 10px;
  cursor: pointer;
}
#rightGroupDetail .star1.done {
  background: url("../image/icon_stars_black2.png") no-repeat left;
}

#rightGroupDetail .star1 a {
  float: left;
  margin-top: 7px;
  font-size: 10px;
  margin-left: 4px;
}
#rightGroupDetail .follow {
  position : relative;
  float: left;
  margin-left: 10px;
  height: 25px;
}

#imgDetail {
	float: left;
	width: 100%;
	margin-bottom: 25px;
}
#contentDetail {
	float: left;
	width: 100%;
	margin-bottom: 50px;
	line-height: 2;
}
/*Group Like Detail
-----------------------------------*/
#groupLikeDetail {
	float: left;
	width: 86%;
	padding: 5% 7%;
	background-color: #f0f0f0;
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 95px;
}
#groupLikeDetail span {
	float: left;
	margin-top: 11px;
}
#groupLikeDetail .likeTween {
	float: right;
	background: url("../image/like_tween.png") no-repeat center;
	width: 170px;
	height: 36px;
}
#groupLikeDetail .likeFacebook {
	float: right;
	background: url("../image/like_facebook.png") no-repeat center;
	width: 170px;
	height: 36px;
	margin-left: 30px;
}
#rightContent #inRightContent #featured p span .text1 {
	float: left;
	width: 19px;
}
#rightContent #inRightContent #featured p span .text1.textBy {
	float: left !important;
	width: 19px;
}
#rightContent #inRightContent #featured p span a.text1 {
	width: inherit;
	float: none;
}
#rightContent #inRightContent #featured p span.marginAuto {
	width: 100%;
	text-align: left;
}
/*List Like Detail
-----------------------------------*/
#listLikeDetail {
	float: left;
	width: 100%;
	margin-bottom: 46px;
}
#listLikeDetail h1 {
	float: left;
	position: relative;
	width: 100%;
	font-size: 15px;
	font-weight: bold;
	padding-bottom: 20px;
}
#listLikeDetail .likeBlack {
	float: left;
	background: url("../image/like_black.png") no-repeat center;
	width: 97px;
	height: 24px;
	position: absolute;
	right: 0;
	top: -5px;
}
#listLikeDetail .likeBlack.done {
  background: url("../image/like_black_done.png") no-repeat center;
}
#listLikeDetail .likeBlack.done:hover {
  background: url("../image/like_black_hover.png") no-repeat center;
}

#listLikeDetail .groupListLikeDetail {
	float: left;
	width: 102%;
	margin-left: -1%;
}
#listLikeDetail .avatarListLikeDetail {
	float: left;
	margin: 5px;
	position: relative;
}
#listLikeDetail .avatarListLikeDetail .nameAvatarListLikeDetail {
	display: none;
	position: absolute;
	top: -10px;
	left: -20px;
	background-color: #000000;
	padding: 5px;
	font-size: 11px;
	color: #ffffff;
	border-radius: 4px;
	z-index: 9999;
	text-align: center;
}
#listLikeDetail .avatarListLikeDetail .nameAvatarListLikeDetail span {
	float: left;
	width: 100%;
	background: url("../image/row_down.png") no-repeat center;
	height: 4px;
	position: absolute;
	left: 0;
	bottom: -4px;
}
#listLikeDetail .avatarListLikeDetail a {
	float: left;
}
/*List Comment Detail
-----------------------------------*/
/*
#listCommentDetail {
	float: left;
	width: 100%;
	margin-bottom: 45px;
}
#listCommentDetail h1 {
	float: left;
	position: relative;
	width: 100%;
	font-size: 15px;
	font-weight: bold;
	padding-bottom: 30px;
}
#listCommentDetail textarea {
	float: left;
	width: 99%;
	height: 70px;
	border: solid 1px #e1e1e1;
	resize: none;
	margin-bottom: 12px;
}
#listCommentDetail #leftListCommentDetail {
	float: left;
}
#listCommentDetail #rightListCommentDetail {
	float: right;
}
.btnComment {
	float: left;
	background: url("../image/btn_comment.png") no-repeat center;
	width: 90px;
	height: 21px;
	border : none;
}
*/
/*View Comment Detail
-----------------------------------*/
/*
.listViewComments {
  clear:both;
  width: 100%;
  height: 100%;
}
.listViewCommentDetail {
	float: left;
	width: 100%;
}
.listViewCommentDetail .leftListViewCommentDetail {
	float: left;
	width: 9%;
	height:60px;
}
.listViewCommentDetail .rightListViewCommentDetail .leftListViewCommentDetail {
	float: left;
	width: 7%;
  height:40px;
}
.listViewCommentDetail .leftListViewCommentDetail img {
	width: 100%;
	height: 100%;
}
.listViewCommentDetail .rightListViewCommentDetail {
	float: right;
	width: 88%;
	margin-left: 3%;
	line-height: 1.9;
	margin-bottom: 30px;
}
.listViewCommentDetail .rightListViewCommentDetail .rightListViewCommentDetail {
	width: 89%;
	margin-left: 4%;
	margin-bottom: 0;
}
.listViewCommentDetail .rightListViewCommentDetail .headViewCommentDetail {
	float: left;
	font-size: 13px;
}
.listViewCommentDetail .rightListViewCommentDetail .headViewCommentDetail a {
	float: left;
	text-decoration: underline;
}
.listViewCommentDetail .rightListViewCommentDetail .headViewCommentDetail span {
	float: left;
	margin-left: 15px;
	color: #b5b5b5;
}
.listViewCommentDetail .rightListViewCommentDetail .contentViewCommentDetail {
	float: left;
}
.listViewCommentDetail .rightListViewCommentDetail .footViewCommentDetail {
	float: left;
}
.listViewCommentDetail .rightListViewCommentDetail .footViewCommentDetail .replyViewCommentDetail {
	float: left;
	text-decoration: underline;
	margin-right: 20px;
}
.listViewCommentDetail .rightListViewCommentDetail .footViewCommentDetail span {
	float: left;
	margin-left: 5px;
	color: #ff7e00;
}
.btnLike {
	float: left;
	background: url("../image/icon_like.png") no-repeat center;
	width: 11px;
	height: 12px;
	margin-top: 4px;
}
*/
/*Right Content
------------------------------------------------*/
.width250 {
	width: 250px !important;
}
.pad-left25 {
	padding: 25px 0 0 25px !important;
}
.magrinTop {
	margin-top: 15px;
}
.seeMore {
	float: left;
	width: 100%;
	padding: 20px 0;
	font-size: 11px;
	text-align: center;
}
.seeMore a:hover {
	text-decoration: underline;
}
/*=============================================================*/
/* Profile Page
/*=============================================================*/

/*Upper
------------------------------------------------*/
#navUpper .navUpperIcon a span.bigFont {
	font-size: 18px;
	font-weight: bold;
	margin-top: 1px;
}
#rightNavUpper {
	float: right;
	padding: 19px 0;
}
#rightNavUpper li {
	float: left;
	margin-left: 25px;
}
/*Header
------------------------------------------------*/
#navSearchWhite {
	float: left;
	position: relative;
	margin-left: 50px;
	margin-top: -6px;
}
#navSearchWhite .search {
	padding: 7px 30px;
	width: 180px;
	position: absolute;
	background-color: #f0f0f0;
	color: #787878;
	border: none;
}
#navSearchWhite .iconSearch {
	position: absolute;
	top: 9px;
	left: 9px;
	height: 16px;
	width: 16px;
	background: url("../image/icon_search_white.png") no-repeat right center;
	border: none;
}
#leftHeader h1 {
	float: left;
}
.magrinTop23 {
	margin-top: 23px !important;
}
.btnAddItem {
	float: right;
	background: url("../image/btn_add_item.png") no-repeat center;
	width: 142px;
	height: 26px;
	margin-top: 18px;
	margin-right: 52px;
}
/*Left Content
------------------------------------------------*/
#profile {
	position:relative;
	float: none;/*left;*/
	width: 95%;
}
#profile h1 {
	float: left;
	width: 100%;
	font-size: 22px;
	padding: 38px 0;
	position: relative;
}

#profile .follow {
  position: absolute;
  top: 40px;
  right:0;
}

#profile .link {
  position: absolute;
  top: 40px;
  right:0;
  
  color : #fff;
  text-align:center;
  
  border-radius : 20px;
  background-color: #505050;
  padding: 10px 20px;;
  display: block;
  
}

#leftProfile {
	float: left;
	width: 36%;
}
#leftProfile img {
	width: 100%;
	height: 100%;
}
#rightProfile {
	float: left;
	width: 59%;
	margin-left: 5%;
}
#rightProfile .contentProfile {
	line-height: 2;
	margin-top: -5px;
	margin-bottom: 75px;
}
#groupBtnLike {
	float: left;
	width: 100%;
}
#groupBtnLike p {
	float: left;
	position: relative;
	width: 100%;
	font-size: 14px;
	font-weight: bold;
	padding-bottom: 16px;
}
#groupBtnLike .likeTween {
	float: left;
	background: url("../image/like_tween_small.png") no-repeat center;
	width: 140px;
	height: 28px;
}
#groupBtnLike .likeFacebook {
	float: left;
	background: url("../image/like_facebook_small.png") no-repeat center;
	width: 140px;
	height: 28px;
	margin-left: 20px;
}
.magrinBottom {
	margin-bottom: 40px;
}
#relatedProductProfile {
}
#relatedProductProfile h1 {
	font-size: 16px;
	padding: 0;
	margin-top : 20px;
	margin-bottom: 30px;
	font-weight: bold;
}
#relatedProductProfile #groupRelatedProductProfile {
	float: left;
	width: 105%;
	margin-left: -2%;
}
#relatedProductProfile #groupRelatedProductProfile a {
	float: left;
	width: 150px;
	margin-left: 15px;
	margin-right: 15px;
	margin-bottom: 20px;
}
#relatedProductProfile #groupRelatedProductProfile a img {
	float: left;
}
#relatedProductProfile #groupRelatedProductProfile a span {
	float: left;
	margin-top: 8px;
}
/*Right Content
------------------------------------------------*/
#commentProfile {
	float: left;
	width: 100%;
	margin-bottom: 45px;
}
/*List Friend
-----------------------------------*/
#listFriend {
	float: left;
	width: 100%;
}
#rightContent #listFriend h1 {
	background: none;
}
#rightContent #listFriend div.friend {
  float: left;
  width :100%;
  padding: 13px 0;
  background: url("../image/dot-right-content.png") repeat-x top center;
  margin-top: 0;
  
}
#listFriend div.friend img {
  float: left;
}
#listFriend div.friend div.img {
  float: left;
  width:60px;
  height:60px;
  display:table-cell;
  vertical-align: middle;  
}
#listFriend div.friend div.name {
  padding: 0;
  padding-left: 20px;
  width : 60%;
  height: 60px;
  display:table-cell;
  vertical-align: middle;  
}

/*Upper
------------------------------------------------*/
#navUpper .navUpperIcon a span.bigFont {
	font-size: 18px;
	font-weight: bold;
	margin-top: 1px;
}
#rightNavUpper {
	float: right;
	padding: 19px 0;
}
#rightNavUpper li {
	float: left;
	margin-left: 25px;
}
/*Header
------------------------------------------------*/
#navSearchWhite {
	float: left;
	position: relative;
	margin-left: 50px;
	margin-top: -6px;
}
#navSearchWhite .search {
	padding: 7px 30px;
	width: 180px;
	background-color: #f0f0f0;
	color: #787878;
	border: none;
}
#navSearchWhite .iconSearch {
	position: absolute;
	top: 9px;
	left: 9px;
	height: 16px;
	width: 16px;
	background: url("../image/icon_search_white.png") no-repeat right center;
	border: none;
}
#leftHeader h1 {
	float: left;
}
.magrinTop23 {
	margin-top: 23px !important;
}
.btnAddItem {
	float: right;
	background: url("../image/btn_add_item.png") no-repeat center;
	width: 142px;
	height: 26px;
	margin-top: 18px;
	margin-right: 52px;
}
/*Upper
------------------------------------------------*/
#navUpper .navUpperIcon a span.bigFont {
	font-size: 18px;
	font-weight: bold;
	margin-top: 1px;
}
#rightNavUpper {
	float: right;
	padding: 19px 0;
}
#rightNavUpper li {
	float: left;
	margin-left: 25px;
}
/*Header
------------------------------------------------*/
#navSearchWhite {
	float: left;
	position: relative;
	margin-left: 50px;
	margin-top: -4px;
}
#navSearchWhite .search {
	padding: 7px 30px;
	width: 180px;
	background-color: #f0f0f0;
	color: #787878;
	border: none;
}
#navSearchWhite .iconSearch {
	position: absolute;
	top: 7px;
	left: 9px;
	height: 16px;
	width: 16px;
	background: url("../image/icon_search_white.png") no-repeat right center;
	border: none;
}
#leftHeader h1 {
	float: left;
}
.magrinTop23 {
	margin-top: 23px !important;
}
.btnAddItem {
	float: right;
	background: url("../image/btn_add_item.png") no-repeat center;
	width: 144px;
	height: 28px;
	margin-top: 18px;
	margin-right: 52px;
}
/* Center Content
------------------------------------*/

#width980 #leftContent.proFileEdit {
	margin: 0 auto;
	position: relative;
	float: none;
	background: none;
}
#groupDetail.groupDetail1 {
	float: left;
	margin-top: 14px;
	width: 770px;
}
#groupDetail h1#textProfileEdit {
	float: left;
	background: url("../image/img_profile_edit_header.png") no-repeat;
	background-position: 0 2px;
	padding: 5px 40px;
	padding-bottom: 15px;
	padding-right: 0;
	font-size: 22px;
	font-weight: bold;
	border-bottom: 1px solid #DFDFDF;
	width: 730px;
}
#proFileEdit {
	float: left;
	margin-top: 30px;
	width: 100%;
}
#proFileEdit .proFileEditSub {
	float: left;
	width: 100%;
}
#proFileEdit label {
	float: left;
	width: 200px !important;
	font-size: 14px;
	font-weight: bold;
}
#proFileEdit .proFileEditSub p.textProFile1 {
	font-size: 18px;
}
#proFileEdit .proFileEditSub p.textProFile1 span {
	font-size: 13px;
	margin-left: 15px;
}
#proFileEdit .proFileEditSub.proFileEditSubEmail {
	margin-top: 35px;
}
#proFileEdit input, textarea, select {
	padding: 8px;
	border: 1px solid #CECECE;
	float: left;
}
#proFileEdit input.email {
	margin-top: 5px;
	width: 370px;
}
#proFileEdit .proFileEditSub.proFileEditSubEmail label {
	margin-top: 15px;
}
#proFileEdit .proFileEditSub.proFileEditSubAdd {
	float: left;
	margin-top: 23px;
}
#proFileEdit .proFileEditSub.proFileEditSubAdd label {
	float: left;
	margin-top: 16px;
}
#proFileEdit .proFileEditSub.proFileEditSubAdd .proFileEditSubAddContent {
	float: left;
	width: 600px;
	margin-top: 4px;
}
#proFileEdit .proFileEditSub.proFileEditSubAdd .proFileEditSubAddContent .proFileEditSubAddContentPost {
	float: left;
	width: 390px;
}

#proFileEdit .proFileEditSub.proFileEditSubAdd .proFileEditSubAddContent .birthday_year {
  width: 60px;
}
#proFileEdit .proFileEditSub.proFileEditSubAdd .proFileEditSubAddContent .birthday_month,
#proFileEdit .proFileEditSub.proFileEditSubAdd .proFileEditSubAddContent .birthday_day {
	margin-left:5px;
	width: 60px;
}

#proFileEdit .proFileEditSub.proFileEditSubAdd .proFileEditSubAddContent .proFileEditSubAddContentPost .textProFileEditSubAddContentPost {
	float: left;
	margin-top: 12px;
	font-size: 17px;
}
#proFileEdit input.add {
	padding: 8px;
	float: left;
	margin-left: 5px;
	width: 80px;
}
#proFileEdit .proFileEditSub.proFileEditSubAdd .proFileEditSubAddContent .proFileEditSubAddContentPost .buttonProFileEditSubAddContentPost {
	float: left;
	margin-left: 20px;
	padding:0;
	border : 0px;
	background-color: #f0f0f0;
  height: 33px;
  padding: 5px 10px;
}
#proFileEdit .proFileEditSub.proFileEditSubAdd .proFileEditSubAddContent .proFileEditSubAddCountry {
	float: left;
	margin-top: 6px;
	width: 600px;
}
#proFileEdit .proFileEditSub.proFileEditSubAdd .proFileEditSubAddContent .proFileEditSubAddCountry .textProFileEditSubAddCountry {
	float: left;
	font-size: 14px;
	margin-top: 10px;
  width : 140px;
}
#proFileEdit select.select1 {
	float: left;
	border: 1px solid #CECECE;
	padding: 8px;
/*	margin-left: 50px;*/
	width: 130px;
}
#proFileEdit select.country {
  float: left;
  position:relative;
  border: 1px solid #CECECE;
  padding: 8px;
/*  margin-left: 50px;*/
  width: 380px;
}

#proFileEdit .proFileEditSub.proFileEditSubAdd .proFileEditSubAddContent .proFileEditSubAddCity {
	float: left;
	width: 450px;
	margin-top: 5px;
}
#proFileEdit .proFileEditSub.proFileEditSubAdd .proFileEditSubAddContent .proFileEditSubAddCity .textProFileEditSubAddCity {
	float: left;
	font-size: 13px;
	margin-top: 10px;
	width : 140px;
}
#proFileEdit input.inputTextProFileEditSubAddCity {
	padding: 8px;
	float: left;
/*	margin-left: 34px;*/
}
#proFileEdit .proFileEditSub.proFileEditSubAdd .proFileEditSubAddContent .proFileEditSubAddBuilding {
	float: left;
	margin-top: 10px;
	width: 450px;
}
#proFileEdit .proFileEditSub.proFileEditSubAdd .proFileEditSubAddContent .proFileEditSubAddBuilding .textProFileEditSubAddBuilding {
	float: left;
	font-size: 13px;
	margin-top: 10px;
  width : 140px;
}
#proFileEdit input.inputTextProFileEditSubAddBuilding {
	padding: 8px;
/*	margin-left: 34px;*/
  width : 250px;
}
#proFileEdit .proFileEditSub.proFileEditSubProfile {
	margin-top: 22px;
}
#proFileEdit .proFileEditSub.proFileEditSubProfile label {
	margin-top: 14px;
}
#proFileEdit textarea.ProflieContent {
	padding: 8px;
	width: 520px;
	resize: none;
}
#proFileEdit .proFileEditSub.proFileEditSubCraft {
	margin-top: 25px;
}
#proFileEdit .proFileEditSub.proFileEditSubCraft label {
	margin-top: 13px;
}
#proFileEdit select.Craft {
	padding: 8px;
	width: 288px;
}
#proFileEdit .proFileEditSub.proFileEditSubProfileImg {
	margin-top: 26px;
}
#proFileEdit .proFileEditSub.proFileEditSubProfileImg label {
	margin-top: 11px;
}
#proFileEdit .proFileEditSub.proFileEditSubProfileImg .proFileEditSubProfileImg1 {
	float: left;
	width: 170px;
	position: relative;
}
#proFileEdit .proFileEditSub.proFileEditSubProfileImg .proFileEditSubProfileImg1 p.img2 {
	float: left;
}
.proFileEditSubProfileImg1 p.img2 img {
	width: 100%;
}

.rightImgRemoveBtn {
  position: absolute;
  right: -9px;
  top: 0;
  background: url(../image/img_itemregist_crows.png) no-repeat;
  width: 21px;
  height: 21px;
}


#proFileEdit input.button1 {
	float: left;
	border: 0px solid #FFFFFF;
	width: 150px;
	padding: 9px;
	margin-top: 10px;
	cursor: pointer;
}
#proFileEdit .proFileEditSub.proFileEditSubLoginPass {
	float: left;
	margin-top: 28px;
}
#proFileEdit .proFileEditSub.proFileEditSubLoginPass label {
	margin-top: 12px;
}
#proFileEdit .proFileEditSub.proFileEditSubLoginPass label.magTop13{
    margin-top: 13px;
}
#proFileEdit input.pass, input.repass {
	padding: 8px;
	width: 266px;
}
#proFileEdit .proFileEditSub.proFileEditSubCapcha {
	margin-top: 31px;
	padding-bottom: 50px;
	border-bottom: 1px solid #C0C0C0;
	width: 85%;
}
#proFileEdit .proFileEditSub.proFileEditSubCapcha label {
	margin-top: 12px;
}
#proFileEdit input.capcha {
	padding: 8px;
	width: 200px;
}
#proFileEdit .groupButton2 {
	width: 100%;
	overflow: hidden;
}
.centerGroup {
	margin: 35px auto 0;
	width: 100%;
	padding: 0 19%;
}
#proFileEdit .button2 {
	float: left;
	/*background: url("../image/img_profile_edit_edit.png") no-repeat;*/
	width: 175px;
	height: 37px;
	border: 0;
	cursor: pointer;
  background-color: #505050;
  border-radius : 6px;
  color: #fff;
  font-size: 1.3em;;
  text-align: center;
}
#proFileEdit .button3 {
	float: left;
	margin-left: 31px;
/*	background: url("../image/img_profile_edit_reload.png") no-repeat;*/
	width: 175px;
	/*height: 37px;*/
	border: 0;
	cursor: pointer;
	
  background-color: #f0f0f0;
  border-radius : 6px;
  color: #000;
  font-size: 1.3em;;
  text-align: center;
  display: block;
  padding: 9px 5px;
}
#proFileEdit .button2 i,
#proFileEdit .button3 i {
  float:left;
  margin-top  : 4px;
  margin-left : 15px;
  text-align:left;  
}


#proFileEdit .button2:hover,
#proFileEdit .button3:hover {
    opacity:0.7;
    filter: alpha(opacity=70);        /* ie lt 8 */
    -ms-filter: "alpha(opacity=70)";  /* ie 8 */
    -moz-opacity:0.7;                 /* FF lt 1.5, Netscape */
    -khtml-opacity: 0.7;              /* Safari 1.x */
    zoom:1;
}

/*=============================================================*/
/* item-regist
/*=============================================================*/

/*Comments Right Content
------------------------------------*/
#itemRegist1 {
	float: left;
	margin-top: 24px;
	width: 100%;
	padding-bottom: 15px;
	border-bottom: 1px solid #DFDFDF;
}
#itemRegist {
	float: left;
	margin-top: 24px;
	width: 100%;
}
.pad-Bottom50 {
	padding-bottom: 50px !important;
}
h1#textItemRegist {
	float: left;
	background-image: url("../image/img_header_add.png");
	background-repeat: no-repeat;
	background-position: left center;
	padding: 5px 40px;
	width: 730px;
	padding-right: 0;
	font-size: 22px;
	font-weight: bold;
}
#itemRegist .itemRegistSub {
	float: left;
	width: 100%;
	margin-top: 27px;
}
#itemRegist .itemRegistSub label {
	float: left;
	width: 200px;
	font-size: 13px;
	font-weight: bold;
}
#itemRegist .itemRegistSub p.textProFile1 {
	font-size: 18px;
}
#itemRegist .itemRegistSub p.textProFile1 span {
	font-size: 13px;
	margin-left: 15px;
}
#itemRegist .itemRegistSub .imgitemRegistSub {
	float: left;
	width: 490px;
}
#itemRegist .itemRegistSub .imgitemRegistSub .imgitemRegistSubImageUpload {
	float: left;
	width: 108px;
}
/*
#itemRegist .itemRegistSub .imgitemRegistSub .imgitemRegistSubImageUpload.imgitemRegistSub2 {
	margin-left: 15px;
}
*/
#itemRegist .itemRegistSub .imgitemRegistSub li.imgitemRegistSubImageUpload {
	/*height: 56px;*/
	width: 108px;
	line-height: 20px;
	border: 1px solid #ddd;
	padding: 3px;
	margin-left: 10px;
	display: inline-block;
}

#itemRegist .itemRegistSub .imgitemRegistSub .imgitemRegistSubImageUpload .imgitemRegistSub010 {
	float: left;
	position: relative;
	margin-top: 8px;
}
#itemRegist .itemRegistSub .imgitemRegistSub .imgitemRegistSubImageUpload .imgitemRegistSub011 {
	float: left;
	margin-top: 9px;
}
.itemRegistSub.itemRegistSubEmail label {
	margin-top: 14px;
}
.itemRegistSub.itemRegistSubContent label {
	margin-top: 14px;
}
#itemRegist .itemRegistSub .imgitemRegistSub .imgitemRegistSubImageUpload .rightImgitemRegistSub012 {
	position: absolute;
	right: -9px;
	top: 0;
	background: url(../image/img_itemregist_crows.png) no-repeat;
	width: 21px;
	height: 21px;
}
#itemRegist .itemRegistSub .imgitemRegistSub .imgitemRegistSubImageUpload p {
	text-align: center;
	width: 100px;
}
#itemRegist .itemRegistSub .imgitemRegistSub input.button1 {
	background: #E7E7E7;
	border: 0;
	padding: 8px;
	margin-top: 18px;
	font-size: 12px;
	cursor: pointer;
}
#itemRegist .itemRegistSub.imgitemRegistSubImageUpload label {
	margin-top: 19px;
}
#itemRegist input.email {
	padding: 8px;
	border: 1px solid #D1D1D1;
	width: 370px;
}
#itemRegist .itemRegistSub.itemRegistSub03 {
	margin-top: 29px;
}
#itemRegist .itemRegistSub.itemRegistSub03 label {
	margin-top: 15px;
}
#itemRegist textarea.content1 {
	border: 1px solid #D8D8D8;
	resize: none;
	padding: 8px;
}
#itemRegist .itemRegistSub.itemRegistSubCraft {
	margin-top: 38px;
}
#itemRegist .itemRegistSub.itemRegistSubCraft label {
	margin-top: 15px;
}
#itemRegist .itemRegistSub.itemRegistSubCraft select.select2 {
	border: 1px solid #DFDFDF;
	padding: 8px;
	width: 290px;
	border-radius: 0 !important;
	-moz-border-radius: 0 !important;
}
#itemRegist .itemRegistSub.itemRegistSubPublish {
	margin-top: 35px;
}
#itemRegist .itemRegistSub.itemRegistSubPublish .itemRegistSubPublish1 {
	float: left;
	width: 200px;
}
#itemRegist .itemRegistSub.itemRegistSubPublish .itemRegistSubPublish1 .radioSub1 {
	float: left;
}
#itemRegist .itemRegistSub.itemRegistSubPublish .itemRegistSubPublish1 .radioSub1 input.radio1 {
	float: left;
}
#itemRegist .itemRegistSub.itemRegistSubPublish .itemRegistSubPublish1 .radioSub1 span {
	float: left;
	margin-top: 3px;
	margin-left: 5px;
}
#itemRegist .itemRegistSub.itemRegistSubPublish .itemRegistSubPublish1 .radioSub2 {
	float: left;/* margin-left: 24px; */
}
#itemRegist .itemRegistSub.itemRegistSubPublish .itemRegistSubPublish1 .radioSub2 input.radio2 {
	float: left;
}
#itemRegist .itemRegistSub.itemRegistSubPublish .itemRegistSubPublish1 .radioSub2 span {
	float: left;
	margin-top: 3px;
	margin-left: 5px;
}
#itemRegist .itemRegistSub.itemRegistSubCapcha {
	margin-top: 30px;
	padding-bottom: 50px;
	border-bottom: 1px solid #DADADA;
}
#itemRegist .itemRegistSub.itemRegistSubCapcha label {
	margin-top: 10px;
}
#itemRegist .itemRegistSub.itemRegistSubCapcha input.capcha {
	padding: 8px;
	border: 1px solid #CACACA;
	width: 190px;
}
#itemRegist .groupButton2 {
	float: left;
	margin-top: 46px;
	width: 100%;
	text-align: center;
}
#itemRegist .groupButton2 .button2 {
	margin: 0 auto;
/*
	background: url(../image/img_button_item_regist.png) no-repeat;
*/
  background-color: #505050;
  border-radius : 10px;
  color : #fff;
  font-size: 14px;
	border: 0;
	width: 175px;
	height: 36px;
	cursor: pointer;
}
/*=============================================================*/
/* preview
/*=============================================================*/

/*Comments Right Content
------------------------------------*/

#groupDetail .groupDetailPreview {
	border-bottom: 1px solid #D3D3D3;
	padding-bottom: 20px;
}
#groupDetail h1.preview {
	background: url("../image/img_preview_header.png") no-repeat;
	background-position: 0 2px;
	padding-left: 36px;
	font-size: 22px;
	margin-top: 7px;
	font-weight: bold;
}
#groupDetail #leftGroupDetail h2 {
	float: left;
	width: 100%;
	font-size: 22px;
	margin-top: 28px;
	font-weight: bold;
	padding-bottom: 14px;
}
#content #width980 #leftContent #detail #groupDetail .Preview {
	margin-top: 70px;
}
#content #width980 #leftContent #detail #groupinfo {
	float: left;
	padding-left: 104px;
	margin-top: 3px;
	border-top: 1px solid #CACACA;
	padding-top: 50px;
	width: 84%;
	padding-bottom: 100px;
}
#content #width980 #leftContent #detail #groupinfo input.addinfo {
	float: left;
	background: url("../image/img_preview_add.png") no-repeat;
	width: 231px;
	height: 42px;
	border: 0;
    cursor: pointer;
}
#content #width980 #leftContent #detail #groupinfo input.editinfo {
	float: left;
	background: url("../image/img_preview_edit.png") no-repeat;
	width: 231px;
	height: 42px;
	margin-left: 30px;
    border: 0;
    cursor: pointer;
}
#content #width980 #leftContent #detail .groupLikeDetailAdd {
	margin-bottom: 47px;
}
/*============================================================*/
/*===============My Page======================================*/
#content #profile.contentMyPage {
	padding-bottom: 100px;
}
#content #profile #rightProfile.myPage {
	padding-bottom: 48px;
}
/*
#content #profile h1 a {
	position: absolute;
	right: 0;
	top: 38px;
}
*/
#content #profile #rightProfile p.contentMypage {
	float: left;
	font-weight: bold;
	width: 460px;
}
#content #profile #rightProfile a.contentMypageEmail {
	float: left;/* margin-top: 5px; */
}
#content #profile #rightProfile #groupBtnLike.mypageRight {
	padding-bottom: 25px;
	border-bottom: 1px solid #CCC;
	margin-bottom: 23px;
}
#content #profile #rightProfile #groupBtnLike p.contentMypageAdd {
	font-weight: normal;
	line-height: 1.4;
	padding-bottom: 0;
}
#content #profile #rightProfile #groupBtnLike p.contentMypageAddContent {
	line-height: 1.75;
	font-weight: normal;
	padding-bottom: 0;
}
#content #profile #rightProfile #groupBtnLike.magrinBottomEmail {
	border-bottom: none;
}
#content #profile #relatedProductProfile #groupRelatedProductProfile .groupRelatedProductProfileSub {
	float: left;
	width: 180px;
}
.groupRelatedProductProfileSub span.title {
	text-align: center;
}

#content #profile #relatedProductProfile #groupRelatedProductProfile span.group2Button {
	float: left;
	width: 166px;
	
}
#content #profile #relatedProductProfile #groupRelatedProductProfile span.group2Button a.setting {
	float: left;
	width: 70px;
	margin-right: 0;
	
  color:#fff;
  border-radius:20px;
  background: #505050;
  text-align: center;
  padding:5px 0;
	
}
#content #profile #relatedProductProfile #groupRelatedProductProfile span.group2Button a.delete {
	float: left;
	margin-right: 0;
	margin-left: 8px;
	width: 70px;
	
  color:#fff;
  border-radius:20px;
  background: #bebebe;
  text-align: center;
  padding:5px 0;
	
}
#content #profile #relatedProductProfile .buttonLoading {
	float: left;
	margin-top: 30px;
  margin-bottom: 30px;
	width: 100%;
	text-align: center;

}
#content #profile #relatedProductProfile .buttonLoading a {
  border : 1px solid #f0f0f0;
  border-radius:10px;
  padding: 10px 20px;
}  


/*Left content*/

#rightContent #inRightContent h1 a.more {
	float: right;
	font-size: 10px;
}
#rightContent #inRightContent h1 a.more:hover {
	text-decoration: underline;
}
 @-moz-document url-prefix() {
select.select2-moz {
 background-image: url("../image/bgSelectbox.png");
 background-repeat: no-repeat;
 background-position: right center;
 padding-right: 20px;
}
}
input[type=radio].css-checkbox {
	display: none;
}
input[type=radio].css-checkbox + label.css-label {
	padding-left: 21px;
	height: 16px;
	display: inline-block;
	line-height: 16px;
	background-repeat: no-repeat;
	background-position: 0 0;
	font-size: 16px;
	vertical-align: middle;
	cursor: pointer;
	font-weight: normal !important;
	width: 50px !important;
}
input[type=radio].css-checkbox:checked + label.css-label {
	background-position: 0 -16px;
}
label.css-label {
	background-image: url("../image/img_option.png");
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

/* Firefox rules here */
@-moz-document url-prefix() {
 .select {
position: relative;
float: left;
}
 .select:after {
 content:"";
 text-align: center;
 line-height:32px;
 position: absolute;
 width: 32px;
 height: 34px;
 background: #ffffff url("../image/arow_select.png") no-repeat right center;
 right: 1px;
 top: 1px;
 pointer-events: none;
}
}
select {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	background: url("../image/arow_select.png") no-repeat right center;
}
select::-ms-expand {
 display: none;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {     /* Safari and Chrome */
}
/*============================================================*/
/*==================== Member Regist ========================*/
/* Header
-----------------------------------------*/
#header.HeaderMemberRegist {
	border: none;
}
#upper.member {
	margin-top: 30px;
	border: none;
}
#upper #width980 ul.navMember {
	float: right;
}
#upper #width980 ul.navMember li {
	float: left;
	padding: 0 5px;
}
#upper #width980 .navMember li.borderLeftRight {
	border-left: 1px solid #666;
	border-right: 1px solid #666;
	padding: 0 5px;
}
#upper #width980 ul.navMember li a {
	font-size: 11px;
	text-decoration: underline;
}
#header #width980 #leftHeader.magrinLeft0.marginTop {
	margin-top: 19px;
	width: 50%;
}
#header #width980 #rightHeader .navMemberRight {
	float: right;
}
#header #width980 #rightHeader ul.navMemberRight li {
	float: left
}
#header #width980 #rightHeader p.textMember {
	float: left;
	margin-top: 11px;
	font-size: 11px;
}
#header #width980 #rightHeader.width430 {
	width: 400px;
	margin-top: 18px;
}
#header #width980 #rightHeader .navMemberRight .hover.Facebook {
	margin-right: 15px;
}
/* Form
--------------------------------------------------------------------*/
#detail.ContentMember {
	padding: 72px 0px 0px 89px;
	margin-top: 2px;
	border: 10px solid #ebebeb;
	width: 79%;
}
#textMemberRegist {
	float: left;
	background-position: 0 2px;
	padding: 4px 35px;
	padding-bottom: 15px;
	padding-right: 0;
	font-size: 23px;
	font-weight: bold;
	border-bottom: 1px solid #DFDFDF;
	width: 730px;
	background: url(../image/imgMemberRegistIconH2.png) no-repeat;
}
#proFileEdit.MemberRegist {
	float: left;
}
#proFileEdit .proFileEditSub input.name {
	margin-top: -10px;
	width: 370px;
}
#proFileEdit.MemberRegist .proFileEditSub.proFileEditSubEmail {
	margin-top: 27px;
}
input.addMemberRegist {
	margin-left: 0;
	width: 45px;
}
p.textMemberRegist {
	margin-top: 14px;
	margin-left: 10px;
	float: left;
}
.img2.avtarMemberRegist {
	margin-top: 10px;
	width: 171px;
}
#proFileEdit input.button1.avatarMemberRegist {
	width: 126px;
	padding: 6px;
	font-size: 12px;
	background: #F3F3F3;
	margin-top: 6px;
}
#proFileEdit .groupButton2.MemberRegist {
	float: left;
	margin-top: 46px;
	width: 90%;
	text-align: center;
}
#content #width980 #leftContent #detail #proFileEdit .groupButton2 .buttonMember {
	margin: 0 auto;
	background: url(../image/btnMemberRegist.png) no-repeat;
	border: 0;
	width: 175px;
	height: 36px;
	cursor: pointer;
	float: none;
}
#proFileEdit .proFileEditSub.proFileEditSubProfile .radioSub1.MemberRegistChoose {
	float: left;
	width: 30%;
	margin-left: 200px;
}
#content.MemberRegist {
	padding-bottom: 50px;
}
.ProflieContent.MemberRegist {
	/*background: url(../image/imgMemberRegistScroll.png) no-repeat;*/
	/*background-position: 98% 50%;*/
}

.arowUp{
    background: url("../image/arow_up.png") no-repeat;
    width: 9px;
    height: 5px;
    position: absolute;
}
.arowDown{
    background: url("../image/arow_down.png") no-repeat;
    width: 9px;
    height: 5px;
    position: absolute;
}

/*============================================================*/
/*======================== Search ===========================*/
#content #leftContent.search {
	width: 1074px;
}

#searchResult h2 {
	text-align: center;
	font-size: 24px;
	margin-top: 10px;
}
#searchResult h2.title {
  padding: 15px 0;
}

#searchResult h3 {
	font-size: 11px;
	margin-top: 17px;
	text-align: center;
}

/*=============================================================*/
/* Message Page
/*=============================================================*/
/*Content
------------------------------------*/
.width470 {
	width: 470px !important;
	background: none !important;
}
/*Message List
------------------------------------*/
#titleMessageList {
	float: left;
	width: 100%;
	border-bottom: solid 1px #e1e1e1;
	padding-bottom: 25px;
}
#titleMessageList h1 {
	font-size: 18px;
	float: left;
	margin-top: 44px;
}
#titleMessageList .searchTitleMessageList {
	float: right;
	border: solid 1px #e1e1e1;
	border-radius: 12px;
	padding: 6px 10px 6px 30px;
/*	background: url("../image/search_message.png") no-repeat 7px center;*/
	width: 150px;
}

#titleMessageList .search {
  position: relative;
  float: right;
  margin-top: 40px;
}
#titleMessageList .search .iconSearch {
  position: absolute;
  top: -2px;
  left: 0;
  height: 31px;
  width: 23px;
  background: url("../image/search_message.png") no-repeat right center;
  border: none;
}

#titleMessageList a.new {
  position: relative;
	width: 98%;
  padding: 5px 0;
  float: left;
  margin: 38px 4px 0;
  border: none;
  background-color: #000;
  color: #ffffff;
  border-radius: 5px;
  cursor: pointer;
}

#titleMessageList a.new div {
  background: url("../image/new_message_icon.png") no-repeat 150px center;
  border: none;
  font-size: 11px;
  padding: 4px 0;
  text-align: center;
}

#messageDetails {
	padding: 10px 5px;
	mergin: auto 10px;
	
	clear:both;
	height:100%;
	overflow: hidden;
}

#messageDetails input.btnSend,
#messageDetails button.btnSend {
    width: 84px;
    padding: 6px 0;
    border: none;
    background-color: #000;
    color: #ffffff;
    border-radius: 5px;
    cursor: pointer;
}


.messageListWrapper {
  height:85%;
  padding:0 2px;
  padding-bottom : 3px;
  overflow: auto;	
}

.messageList {
	float: left;
	width: 100%;
	border-bottom: solid 1px #e1e1e1;
	padding-bottom: 15px;
	padding-top: 15px;
	display: table;
}
.messageList.selected,
.messageList:hover {
	cursor:pointer;
	background: #eee;
}

.messageList.messageListDetail:hover {
	cursor:auto;
	background: #fff;
}

.messageList.Fun:hover {
	cursor:auto;
	background: #fff;
}

.messageList .leftMessageList {
	display: table-cell;
	vertical-align: middle;
}
.messageList .midMessageList {
  display: table-cell;
	width: 120px;
	vertical-align: middle;
	padding: 17px;
}
.messageList .rightMessageList {
	display: table-cell;
	vertical-align: middle;
	width:230px;
}
.messageList .rightMessageList p {
	line-height: 1.7;
	
  overflow: hidden;
  white-space: nowrap;  
  width: 100%;
  text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis; /* Safari */
  -o-text-overflow: ellipsis; /* Opera */  
}

.messageList .rightMessageList span {
	float: left;
	margin-top: 9px;
	font-size: 10px;
	color: #797979;
}
/*Message List
------------------------------------*/
#titleNewMessage {
	float: left;
	width: 100%;
	border-bottom: solid 1px #e1e1e1;
	padding-bottom: 29px;
	margin-top: 38px;
}
#titleNewMessage a {
	background-color: #1e1e1e;
	width: 100%;
	float: left;
	text-align: center;
	color: #ffffff;
	padding: 9px 0 4px;
	border-radius: 5px;
	vertical-align: top;
	font-size: 14px;
	letter-spacing: 2px;
}
#titleNewMessage a img {
	margin-right: 15px;
	margin-top: -2px;
}

.newMessageWrapper {
	height:60%;
	padding: 0 2px;
	overflow: scroll;
  overflow-x: hidden;
}

.newMessageWrapperAttach {
  height:40%;
  padding: 0 2px;
  overflow: auto;
}

.newMessage {
/*  position: relative;*/
  clear: both;
/*  height: auto;*/
}
.newMessage .timeNewMessage {
	float: left;
	width: 100%;
	margin-top: 15px;
	color: #797979;
	font-size: 11px;
	text-align : left;
}
.newMessage .questNewMessage {
	float: left;
	width: 100%;
	margin-top: 20px;
  margin-bottom: 5px;
}
.newMessage .questNewMessage .avatarNewMessage {
	float: left;
}
.newMessage .questNewMessage .contentNewMessage {
	float: right;
	width: 81%;
	padding: 4%;
	line-height: 1.8;
	border-radius: 8px;
	background-color: #ebebeb;
	position: relative;
	margin-top: -4px;
}
.newMessage .questNewMessage .contentNewMessage .arowMessageLeft {
	background: url("../image/arow_message_left.png") no-repeat;
	width: 7px;
	height: 13px;
	position: absolute;
	left: -6px;
	top: 11px;
}
.newMessage .answerNewMessage {
	float: left;
	width: 100%;
	margin-top: 20px;
	padding-bottom: 5px;
}
.newMessage .answerNewMessage .avatarNewMessage {
	float: right;
}
.newMessage .answerNewMessage .contentNewMessage {
	float: left;
	width: 81%;
	padding: 4%;
	line-height: 1.8;
	border-radius: 8px;
	background-color: #969696;
	position: relative;
	color: #ffffff;
	margin-top: -4px;
}
.newMessage .answerNewMessage .contentNewMessage .arowMessageRight {
	background: url("../image/arow_message_right.png") no-repeat;
	width: 7px;
	height: 13px;
	position: absolute;
	right: -6px;
	top: 11px;
}

.newMessage .contentNewMessage .attach {
  position:relative; 
  float:left; 
}

.newMessage .contentNewMessage .attach .image {
  position:relative;
  display:inline-block;
  margin:5px;
}
.newMessage .contentNewMessage .attach .image:hover {
	cursor:pointer;
}

.newMessage .read {
  clear:both;
	display:table-cell;
  border:1px solid #e8e8e8;
  padding:5px 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  margin:3px;
  text-align:center;
  font-size:10px;
  background-color:  #F0F0F0;
  color:silver;
  border:1px solid #F0F0F0;
}
.newMessage .questNewMessage .read {
  float:right;
}
.newMessage .answerNewMessage .read {
  float:left;
}

.groupCommentNewMessage {
	margin:15px 0;
	float: left;
	width: 99%;
	position: relative;
	/*padding-bottom: 20px;*/
	/*border-bottom: solid 1px #e1e1e1;*/
  border: solid 3px #e1e1e1;
}
.groupCommentNewMessage .commentNewMessage {
/*	float: left;*/
	width: 91%;
	resize: none;
/*	border: solid 3px #e1e1e1;*/
  border: none;
	height: 75px;
	padding-right: 7%;
	overflow:  auto;
	outline: none;
}
.groupCommentNewMessage .cameraCommentNewMessage {
	background: url("../image/camera.png") no-repeat;
	width: 20px;
	height: 14px;
	position: absolute;
	z-index:80;
	right: 20px;
	top: 5px;
	cursor: pointer;
}
.groupCommentNewMessage .attach {
  position:relative; 
  float:left;	
}

.groupCommentNewMessage .attach .image {
  position:relative;
  display:inline-block;
  margin:5px;
}

.groupCommentNewMessage .attach .removeIcon {
  position: absolute;
  right: -9px;
  top: 0;
  background: url(../image/img_itemregist_crows.png) no-repeat;
  width: 21px;
  height: 21px;
}

.next-btn {
  display:table-cell;
  float:right;
  border:1px solid #e8e8e8;
  padding:5px 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  
}

.messageLoad {
	margin: 0 auto;
	width: 100%;
	text-align: center;
	overflow: hidden;
	padding-top: 30px;
}

.width50l{
  background: none !important;
  width: 49% !important;
  height:100%;
  padding-right: 42px;
/*  border-right: solid 1px #E1E1E1;*/
}

.width50r{
  background: none !important;
  width: 49% !important;
  height:100%;
}


.width690{
  background: none !important;
  width: 690px !important;
  padding-right: 42px;
  border-right: solid 1px #E1E1E1;
}
#titleMessageList .searchTitleMessageList.width190{
	width: 190px;
}


/*==============================================*/
/* items Grid */
/*==============================================*/
#tiles {
  margin:3px auto;
  text-align: center;
  width : 100%;
  min-width:750px;
}

.inGrid {
  float: left;
  width  : 244px;
  height : 282px;
  border: 1px solid #EDEDED;
  position: relative;
  text-align: center;
  margin:3px;

  background-color:#fff;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;

  -webkit-transition-duration:0.2s;
  -moz-transition-duration:0.2s;
  -ms-transition-duration:0.2s;
  -o-transition-duration:0.2s;
  transition-duration:0.2s;
}

.inGrid p.image {
  text-align:center;
  vertical-align:middle;
  margin: 10px auto;
  width  : 50%;
  height : 70%;
  overflow: hidden;
  position: relative;
}

.inGrid p.image img {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width : 100%;
  height : auto;
}
.inGrid div.title {
  position: absolute;
  width : 100%;
  bottom: 10px;
  left: 0px;
}

.inGrid h2 {
  margin:0 auto;
  font-size: 12px;
  font-weight:bold;
  line-height: 1.5;

  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
}
.inGrid.pickup-1 {
  width : 745px;
  height: 572px;
}
.inGrid.pickup-1 p.image {
  width : 90%;
  height: 80%;
}
.inGrid.pickup-2 {
  width : 494px;
  height: 572px;
}
.inGrid.pickup-2 p.image {
  width : 90%;
  height: 80%;
}
.inGrid.pickup-1 div.title,
.inGrid.pickup-2 div.title {
  text-align: left;
  padding-left:10px;
}
.inGrid p.image:hover {
  zoom:1;
	opacity : 0.7;
  filter: alpha(opacity=70);        /* ie lt 8 */
  -ms-filter: "alpha(opacity=70)";  /* ie 8 */
  -moz-opacity:0.7;                 /* FF lt 1.5, Netscape */
  -khtml-opacity: 0.7;              /* Safari 1.x */
}

.inGrid:hover .mouseOver2 {
	display:block;
}

.mouseOver2 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background: rgba(245, 125, 9, 0.93);
    height: 100%;
	display:none;
}

.mouseOver2 h1 {
    text-align: left;
    width: 79%;
    margin-left: 11%;
    border-bottom: 4px solid;
    padding-bottom: 6px;
    font-size: 14px;
    float: left;
}

.groupText {
    position: absolute;
    top: 16%;  text-align: center;  width: 100%;
    color: #fff;
    height : 60%;
}

.groupText p.text1 {
    top: 50px;
    text-align: left;
    padding: 0 11%;
    line-height: 1.7;
    /*overflow: hidden;*/
    overflow: auto;
    overflow-x: hidden;;
    float: left;
    margin-top: 11%;
    height: 40%;
}

.groupText .text2 {
    float: left;
    text-align: center;
    margin: 0 11%;
    border: 6px solid;
    border-radius: 15px;
    width: 72%;
    padding: 7px 0;
    margin-top: 5%;
    cursor: auto;
}

.groupText .text2 {
	color: inherit; /*#fff;*/
}

.groupText .text2:hover {
    cursor: pointer;
    opacity : 0.8;
    filter: alpha(opacity=80);        /* ie lt 8 */
    -ms-filter: "alpha(opacity=80)";  /* ie 8 */
    -moz-opacity:0.8;                 /* FF lt 1.5, Netscape */
    -khtml-opacity: 0.8;              /* Safari 1.x */
    zoom:1;
}

.show{
	display:block;
}

.top-image {
  box-sizing: border-box;
  padding: 0;
  width  : 100%;
  height : auto;
  position: relative;
  margin-top: 26px;
  margin-bottom: 52px;
}
	
/*==============================================*/
/* Item Grid */
/*==============================================*/
.inGrid-item {
  float: left;
  box-sizing: border-box;
  padding: 0 10px;
  width  : 315px;
  height : 380px;
  position: relative;
  margin : 1px 0;
}

.inGrid-item p.image {
  box-sizing: border-box;
  margin: 0px auto;
  width : 280px;
  height: 310px;
	text-align:center;
  vertical-align: middle;
  overflow: hidden;
  position: relative;
  background-color: #ECECEC;
}
#fancybox-thumbs img {
  background-color: #ECECEC;
}

.inGrid-item.item p.image:hover {
  zoom:1;
  opacity : 0.7;
  filter: alpha(opacity=70);        /* ie lt 8 */
  -ms-filter: "alpha(opacity=70)";  /* ie 8 */
  -moz-opacity:0.7;                 /* FF lt 1.5, Netscape */
  -khtml-opacity: 0.7;              /* Safari 1.x */
}

.inGrid-item p.image img {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width : 100%;
  height : auto;
}


.inGrid-item div.title,
.inGrid-item div.artist {
  box-sizing: border-box;
  display: block;
  padding:5px;
  padding-top:8px;
  width: 280px;
  text-align: left;
}

.inGrid-item div.title h2 {
  font-size: 12px;
  font-weight: normal;
  line-height: 1.5;
  display:inline-block;
  width : 75%;
  color : #adadad;
  
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
}

.inGrid-item div.title a,
.inGrid-item div.artist a{
  color: #adadad;
  font-weight: normal;
  text-decoration: none;
  width : 100%;
}

.inGrid-item div.title .caption {
	float:right;
  margin:0px auto;
  display:inline-block;
  font-size: 6px;
  font-weight:normal;
  padding:4px 12px;
  color: #fff;
  background-color: #bbbbbb;
  
  border-radius: 2px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
}

.inGrid-item.top-image{
  float: left;
  box-sizing: border-box;
  padding: 0 10px;
  width  : 1260px;
  height : 665px;
  position: relative;
  margin-top: 26px;
}

.inGrid-item.top-image p.image {
  box-sizing: border-box;
  margin: 0px auto;
  width : 1230px;
  height:  615px;
  text-align:center;
  vertical-align: middle;
  overflow: hidden;
  position: relative;
  
}

/*
.inGrid-item.pickup-1 div.title,
.inGrid-item.pickup-1 div.artist {
  box-sizing: border-box;
  display: block;
  padding:5px;
  padding-top:8px;
  width: 1240px;
  text-align: left;
}

.inGrid-item.pickup-1 div.title h2 {
  width : auto;
  padding: 0 30px;
}

.inGrid-item.pickup-1 div.title .caption {
	vertical-align : top;
  float:none;
}
*/

	
/*==============================================*/
/* Event Grid */
/*==============================================*/
/*
#tiles.event {
	margin:10px;
}
*/

.inGrid-event {
  float: left;
  box-sizing: border-box;
  padding: 0 10px;
  width  : 315px;
  height : 370px;
  position: relative;
  margin : 20px 0;
  margin-bottom: 0px;
}

.inGrid-event p.image {
  box-sizing: border-box;
  margin: 0px auto;
  width  : 280px;
  height : 200px;
  text-align:center;
  vertical-align: middle;
  overflow: hidden;
  position: relative;
  border: 1px solid #f2f2f2;
}

.inGrid-event p.image:hover {
  zoom:1;
  opacity : 0.7;
  filter: alpha(opacity=70);        /* ie lt 8 */
  -ms-filter: "alpha(opacity=70)";  /* ie 8 */
  -moz-opacity:0.7;                 /* FF lt 1.5, Netscape */
  -khtml-opacity: 0.7;              /* Safari 1.x */
}

.inGrid-event p.image img {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width : 100%;
  height : auto;
}

.inGrid-event div.info {
  box-sizing: border-box;
  padding: 10px;
  width  : 280px;
  height : 140px;
  margin : 0 auto;
  position: relative;
  border: 1px solid #f2f2f2;
  margin-top: 15px;
}

.inGrid-event div.info .title {
  position: relative;
  box-sizing: border-box;
  text-align: left;
  width: 100%;
  margin-bottom: 6px;
}

.inGrid-event div.info .title h2 {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
}

.inGrid-event div.info .title a {
  position: relative;
  text-decoration: none;
  width : 100%;
}

.inGrid-event div.info .desc {
  text-align:left;
  width   : 100%;
  height  : 40px;
  padding : 0;
  margin-top: 3px;
  overflow: hidden;
}

.inGrid-event div.info .desc p {
  line-height: 1.8em;
  overflow: hidden;
  word-break: break-all;  
}

.inGrid-event div.info div.site-info {
	text-align: left;
}
	
.inGrid-event div.info div.site-info > div {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
}

.inGrid-event div.info div.site-info .caption {
  margin: 5px 0;
	margin-right: 10px; 
}
 
/* -------------------------------------------------*/
/*
.inGrid.event p.image.vl {
	display:none;
}

.inGrid.event div.info {
  position:relative;
  width :100%;
  height:50%;
  padding:20px;
  box-sizing:border-box;
  text-align: left;
}

.inGrid.event div.info div.title {
  position: static;
  width : 100%;
  padding:0;
}

.inGrid.event div.info div.site-info {
  width : 100%;
}

.inGrid.event div.info div.site-info > div {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
}

.inGrid.event div.info div.site-info p.caption {
  margin-right: 10px;	
}
 
.inGrid.event div.info div.desc {
  position: static;
  width   : 100%;
  height  : 56%;
  padding : 0;
  margin-top: 5px;
  overflow: hidden;
}

.inGrid.event div.info div.desc > p.fade {
	overflow : hidden;
  line-height: 1.8;
  word-break: break-all;
}

.inGrid.event.pickup-1 {
  width : 734px;
}
.inGrid.event.pickup-1 p.image {
  width : 95%;
  height: 60%;
}
.inGrid.event.pickup-1 div.info {
  width :100%;
  height:40%;
}

.inGrid.event.pickup-2 {
  width : 480px;
}

.inGrid.event.pickup-1 div.info div.site-info > div {
  width: 50%;
  display:table-cell;
  float:left;
}

.inGrid.event.pickup-2off p.image {
  display:none;
}

.inGrid.event.pickup-2off p.image.vl {
  display:block;
}

.inGrid.event.lv3only p.image {
  display:none;
}

.inGrid.event.lv3only p.image.vl {
  display:block;
}
*/

/*==============================================*/
/* Interview Grid */
/*==============================================*/
/*
#tiles.interview {
  margin:10px;
}
*/
.inGrid-interview {
  float: left;
  box-sizing: border-box;
  padding: 0 10px;
  width  : 315px;
  height : 370px;
  position: relative;
  margin : 20px 0;
}

.inGrid-interview p.image {
  box-sizing: border-box;
  margin: 0px auto;
  width : 280px;
  height: 200px;
  text-align:center;
  vertical-align: middle;
  overflow: hidden;
  position: relative;
  margin-left : 4px;
}

.inGrid-interview p.image:hover {
  zoom:1;
  opacity : 0.7;
  filter: alpha(opacity=70);        /* ie lt 8 */
  -ms-filter: "alpha(opacity=70)";  /* ie 8 */
  -moz-opacity:0.7;                 /* FF lt 1.5, Netscape */
  -khtml-opacity: 0.7;              /* Safari 1.x */
}

.inGrid-interview p.image img {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width : 100%;
  height : auto;
}

.inGrid-interview div.info {
  box-sizing: border-box;
  padding: 15px;
  width  : 280px;
  height : 130px;
  margin : 0 auto;
  position: relative;
  border: 1px solid #f2f2f2;
  box-shadow: 2px 3.464px 6px 0px #f5f4f5;
	margin-top: 15px;
}
.inGrid-interview div.info-back {
	display:none;
}

.inGrid-interview div.info .artist {
  position: relative;
	box-sizing: border-box;
  text-align: left;
  float: left;
  padding:10px 0;
  padding-top:15px;
  width: 100%;
}

.inGrid-interview div.info .artist h2 {
  line-height: 1.5;
  display:inline-block;
  width : 70%;
  
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
}

.inGrid-interview div.info .artist a {
	position: relative;
  text-decoration: none;
  width : 100%;
}

.inGrid-interview div.info .artist .genre {
  float:right;
  width :auto;
  vertical-align: middle;
}

.inGrid-interview div.info .desc {
	text-align:left;
  width   : 100%;
  padding : 0;
  margin-top: 5px;
  overflow: hidden;
}

.inGrid-interview div.info .desc p {
  line-height: 1.8em;
  overflow: hidden;
  word-break: break-all;  
}

/* inGrid-interview.pickup-1 */
.inGrid-interview.pickup-1 {
  float: left;
  box-sizing: border-box;
  padding: 0 10px;
  width  : 1260px;
  height : 635px;
  position: relative;
  margin-bottom: 20px;
}

.inGrid-interview.pickup-1 p.image {
  box-sizing: border-box;
  margin: 0px auto;
  width : 1230px;
  height:  615px;
  text-align:center;
  vertical-align: middle;
  overflow: hidden;
  position: relative;
}

.inGrid-interview.pickup-1 p.img-subject {
  position: absolute;
  box-sizing: border-box;

  top: 0;
  left: 15px;
  width  : 450px;
  height : 615px;
  z-index: 101;
}

@media screen and (max-width:1260px) {
  /* card 3 */
  .topContent {
    width : 945px;
  }
  
  #upper .topContent,
  #header .topContent,
  #header-top .topContent {
    width : 915px;
  }
  
  .leftContent {
    width: 675px;
  }
  
  #navMain li {
    margin-left : 10px;
    width : 80px;
  }

  .inGrid-item.top-image {
    width  : 945px;
    height : 498.8px;
    position: relative;
  }

  .inGrid-item.top-image p.image{
    box-sizing: border-box;
    margin: 0px auto;
    width : 915px;
    height:  457.5px;
    text-align:center;
    vertical-align: middle;
    overflow: hidden;
    position: relative;
  }

	/*
	  .inGrid-item.pickup-1 div.title,
	  .inGrid-item.pickup-1 div.artist {
	    width : 915px;
	  }
	*/

  .inGrid-interview.pickup-1 {
    width  : 945px;
    height : 472.5px;
    position: relative;
  }
  .inGrid-interview.pickup-1 p.image {
    box-sizing: border-box;
    margin: 0px auto;
    width : 915px;
    height:  457.5px;
    text-align:center;
    vertical-align: middle;
    overflow: hidden;
    position: relative;
  }

  .inGrid-interview.pickup-1 p.img-subject {
    width  : 333px;
    height : 457.5px;
    z-index: 101;
  }

/*
  .inGrid-interview.pickup-1 div.info,
  .inGrid-interview.pickup-1 div.info-back {
    top: 30px;
    left: 30px;
    width  : 350px;
    height : 390px;
    padding: 15px 20px;
  }
  .inGrid-interview.pickup-1 div.info-back {
    top: 23px;
    left: 23px;
  }

  .inGrid-interview.pickup-1 div.info .desc {
    font-size: 13px;
  }

  .inGrid-interview.pickup-1 div.info .desc .subject {
    padding-top: 20px;
  }
  
  .inGrid-interview.pickup-1 div.info .artist,
  .inGrid-interview.pickup-1 div.info .title {
    line-height: 1.6em;
  }
*/

}



/*==============================================*/
/* Image Gallery Grid */
/*==============================================*/
#gallery-box {
  position:relative;
  width: 100%;
}

#gallery-box .picture-frame {
  width:100%;
  width:650px;
  height:490px;
/*  border: 1px solid;*/
  text-align: center;
}
#gallery-box .image {
  overflow:hidden;
  display: inline-block;
}

#gallery-box .image.hidden {
  /*visibility:hidden;*/
  display: none;
}
#gallery-box .galleries {text-align: center;}
#gallery-box .galleries a{text-decoration:none;}
#gallery-box .galleries img{border:2px solid white;width: 96px;}
#gallery-box .galleries .active img{border:2px solid #333 !important;}





/*==============================================*/
/* common */
/*==============================================*/
.subCapcha .captchaBox {
    margin-left :200px;
}

.error {
    display: block;
     padding-top: 5px;
    /*
    margin-left: 200px;
    */
    color: red;
    clear: both;
    width: 100%;
}
.help-inline {
  display: inline-block;
  *display: inline;
  padding-left: 5px;
  vertical-align: middle;
  *zoom: 1;
}

.filebox {
	display:block;
	clear:both;
    position:relative;
    overflow:hidden;
    /*↓幅はデザイン依存。場合によっては、指定しなくていい*/
    width:126px;
}

.filebox input[type='file']{
    position:absolute;
    top:0;
    right:0;
    z-index:99;
    width:100%;
    height:100%;
    opacity:0;
    -moz-opacity:0.0;                 /* FF lt 1.5, Netscape */
    -khtml-opacity: 0.0;              /* Safari 1.x */
    zoom:1;

    font-size:80px;
    filter: alpha(opacity=0);        /* ie lt 8 */
    -ms-filter: "alpha(opacity=0)";  /* ie 8 */
}

.clear {
    clear:both;
}

.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  visibility: hidden;
  clear: both;
}
.clearfix {display: inline-block;}


.alert-box {
  width: 200px;
  color:#555;
  border-radius:10px;
  font-size:11px;
  padding:10px 10px 10px 36px;
  margin:10px;
}

.alert-box.fixed {
  position: fixed;
  bottom: 30px;
  right: 2%;
  display: none;
}

.alert-box span.type {
  font-weight:bold;
  text-transform:uppercase;
}

.alert-box.error {
/*  background:#ffecec url('images/error.png') no-repeat 10px 50%;*/
  background-color: rgba( 255, 236, 236, 0.75 );
  border:1px solid #f5aca6;
}
.alert-box.success {
/*  background:#e9ffd9 url('images/success.png') no-repeat 10px 50%;*/
  background-color: rgba( 233, 255, 217, 0.75 );
  border:1px solid #a6ca8a;
}
.alert-box.warning {
/*  background:#fff8c4 url('images/warning.png') no-repeat 10px 50%;*/
  background-color: rgba( 255, 248, 200, 0.75 );
  border:1px solid #f2c779;
}
.alert-box.notice {
/*  background:#e3f7fc url('images/notice.png') no-repeat 10px 50%;*/
  background-color: rgba( 227, 247, 252, 0.75 );
  border:1px solid #8ed9f6;
}


.clamp-box {
  overflow: hidden;
  width: 100%;
  /*width: inherit;*/
}

.clamp,
.clamp-box .clamp {
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
  text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  display: inline-block;
/*
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
*/
}

.follow {
  position : relative;
  margin-left: 10px;
  height: 25px;
}
.follow a {
  width:78px;
  display:block;
  /*float: left;*/
  /*background: url("../image/follow_icon.png") no-repeat 4px center;*/
  border-radius: 10px;
  background-color:#1e1e1e;
  color : #fff;
  padding: 8px 12px;
}
.follow a.done {
/*  background: url("../image/unfollow_icon.png") no-repeat 4px center;*/
  background-color:#f5f5f5;
  color : #000;

}

.well {
  background-color: #F4F6FA;
}

/*.tag,*/
.caption {
  margin:8px auto;
  display:inline-block;
  
  font-size: 6px;
  font-weight:bold;
  padding:4px 10px;
  color: #7D7D7D;
  background-color: #EDEDED;
  border-radius: 2px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
}


.status {
  margin:8px auto;
	font-size: 12px;
  color: #000000;
  background: none;
  font-weight:normal;
  border: solid 1px #e8e8e8;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
}

.status.pending {
  color: #000000;
  background: none;
}
.status.publish {
  color: #ffffff;
  background-color: #337AB7;
}
.status.private {
  color: #ffffff;
  background-color: #505050;
}



.img-radius {
	border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
}

/* sns icon */
.icon-facebook,
a.icon-facebook {
  color: #3A589E;
  font-size: 20px;
}
.icon-twitter,
a.icon-twitter {
  color: #22ADEA;
  font-size: 20px;
}

.icon-google-plus,
a.icon-google-plus {
	color: #DB4C38;
  font-size: 20px;
}

.icon-instagram,
a.icon-instagram {
  color: #9E6E4B;
  font-size: 20px;
}



/* ------------------------------- */
/* company
/* ------------------------------- */ 
.company * {
	clear:both;
	box-sizing:border-box;
}

.company {
	padding: 10px 60px;
	width:100%;
	margin: 30px auto;
}

.company .subject {
	font-size: 26px;
	font-weight : bold;
  margin: 0;
}

.company .info {
  display : block;
  width : 80%;
  margin: 40px 20px;
}

.company .info .row {
	display : block;
	width : 100%;
	padding : 10px 20px;
  border-bottom : 1px solid #F0F0F0;
}

.company .info .row .label,
.company .info .row .value {
  display: inline-block;  
  font-size : 16px;
  line-height :2.5em;
	margin: 5px;
	
}

.company .info .row .label {
  width : 170px;
  border-right : 1px solid #F0F0F0;
}

.company .info .row .value {
	width : 70%;
  margin: 5px;
}


/* ------------------------------- */
/* privacy-policy
/* ------------------------------- */ 
.privacy {
  box-sizing:border-box;
	width:100%;
	padding: 10px 60px;
  margin: 30px auto;
  font-size:16px;
}

.privacy * {
  clear:both;
  box-sizing:border-box;
  line-height: 1.8em;
}

.privacy .subject {
  font-size: 26px;
  font-weight : bold;
  margin: 0;
}

.privacy p {
	width : 100%;
  word-break: break-all;  
  margin : 40px 0;
}

.privacy dl dd {
  word-break: break-all;  
  margin-bottom: 40px;
}

.privacy dl dd ul li{
  word-break: break-all;  
  margin-bottom: 5px;
}