@charset "UTF-8";

/* ==========================================================================
	【for staffcoordinate】
	XX Common
		XX-01 item_list
	01 Wrap
		01-01 detail_container_wrap
			01-01-01 detail_photo_box(Left Column)
			01-01-02 detail_info_box(Right Column)
				01-01-02-01 info_box_info_area
				01-01-02-02 info_box_styling_area
			01-01-02 detail_other_style_box
========================================================================== */


/* XX Common
------------------------------------------------------------------------------------*/
#contents.staffcoordinate {
	max-width: 100%;
}

.section_heading {}
/* XX-01 item_list
--------------------------------------------------------------------*/
.item_list {
	width:100%;
	display:flex;
	flex-wrap:wrap;
}
.item_list_item {
	font-family:"Fjalla One", sans-serif;
}
.item_list_item.cols2 {
	width:49%;
}
.item_list_item.cols3 {
	width:32%;
}
.item_list_item.cols4 {
	width:24%;
}
.item_list_item.cols5 {
	width:18.4%;
}
.item_list_item + .item_list_item {
	margin-left:2%;
}
.item_list_item.cols2:nth-of-type(2n+3) {
	margin-left:0;
}
.item_list_item.cols3:nth-of-type(3n+4) {
	margin-left:0;
}
.item_list_item.cols4:nth-of-type(5n+4) {
	margin-left:0;
}
.item_list_item.cols5:nth-of-type(5n+6) {
	margin-left:0;
}
.item_list_item.cols2:nth-child(n+3) {
	margin-top:2%;
}
.item_list_item.cols3:nth-child(n+4) {
	margin-top:2%;
}
.item_list_item.cols4:nth-child(n+5) {
	margin-top:2%;
}
.item_list_item.cols5:nth-child(n+6) {
	margin-top:2%;
}
.item_list_item a {
	display:block;
}
.item_info_area {
	overflow:hidden;
}
.item_info_photo {}
.item_photo_img {
	width:100%;
	height:auto;
}
.item_info_name {}
.item_info_photo + .item_info_name {
	margin-top:10px;
}
.item_info_price {}
.item_info_name +.item_info_price {
	margin-top:5px;
}
.item_info_textarea {
	display:block;
}
.item_info_textarea.item_name {
	max-height:26.4px;
	/*-- fontSize:12px*2+lineHeight:1.2*3 --*/
	max-height:calc(2em + 3.6px);
	max-height:-o-calc(2em + 3.6px);
	max-height:-ms-calc(2em + 3.6px);
	max-height:-moz-calc(2em + 3.6px);
	max-height:-webkit-calc(2em + 3.6px);
	/*-- fontSize:12px*2+lineHeight:1.2*3 --*/
	padding-right:1em;
	position:relative;
/*
	display:block;
	text-overflow:ellipsis;
	overflow:hidden;
	white-space:nowrap;
*/
}
.item_info_textarea.item_name:before,
.item_info_textarea.item_name:after {
	background:#fff;
	position:absolute;
}
.item_info_textarea.item_name:before {
	content:"...";
	top:13.2px;
	right:0px;
}
.item_info_textarea.item_name:after {
	content:"";
	width:100%;
	height:100%;
}


/* 01 Wrap
------------------------------------------------------------------------------------*/
#section_wrap {
	width: 100%;
}

/* 01-01 detail_container_wrap
--------------------------------------------------------------------*/
.detail_container_wrap {
	width: 100%;
}
.section_heading + .detail_container_wrap {
	margin-top:20px;
}
.detail_container_wrap a:hover {
	opacity:0.8;
	text-decoration: none;
}
.detail_container_inner {
	display: flex;
	flex-wrap: nowrap;
	max-width: 1200px;
	margin-bottom: 60px;
	padding-bottom: 60px;
	border-bottom: 1px solid #DDD;
}
.detail_column {}
.detail_column_item {}
/* 01-01-01 detail_photo_box(Left Column)
----------------------------------------------------*/
.detail_photo_box {
	flex-basis: 560px;
	max-width: 560px;
	margin: 0 70px 0 0;
}
.detail_photo_slider {
	position: relative;
}
.detail_photo_list {}
.detail_photo_item {
	position: relative;
}
.detail_photo_image {
	width: 100%;
	height: auto;
}
.slick-slide img{
	opacity: 1 !important;
}
.slick-dots {
	display: none !important;
}
.slick-dotted.slick-slider {
	margin-bottom: 0;
}
/* slick.css */

.slick-prev {
	left: -15px;
}
.slick-next {
	right: -15px;
}
.checkitem_slider .slick-prev {
	left: -10px;
}
.checkitem_slider .slick-next {
	right: -10px;
}

.detail_photo_slider .slick-arrow {
    display: block;
    width: 10%;
    height: 100%;
    outline: none;
    text-decoration: none;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    position: absolute;
    top: 0;
    z-index: 10;
    opacity: 0;
    cursor: pointer;
    transition: all .5s ease;
}

.detail_photo_slider .slick-arrow:hover {
    opacity: 1;
}

.detail_photo_slider .slick-prev:after {
    content: "";
    width: 15px;
    height: 15px;
    margin-top: -8px;
    border-top: 1px solid #000;
    border-right: 1px solid #000;
    transform: rotate(-135deg);
    position: absolute;
    top: 50%;
    left: 25px;
}

.detail_photo_slider .slick-next:after {
	content: "";
    width: 15px;
    height: 15px;
    margin-top: -8px;
    border-top: 1px solid #000;
    border-left: 1px solid #000;
    transform: rotate(135deg);
    position: absolute;
    top: 50%;
    right: 25px;
}


/* 01-01-02 detail_info_box(Right Column)
----------------------------------------------------*/
.detail_info_box {
	max-width: 410px;
	flex-basis: 410px;
}

/* 01-01-02-01 info_box_info_area
------------------------------------*/
.info_box_info_area {}
.info_area_item {}
.info_area_item.info_data {
	padding-bottom: 40px;
    margin-bottom: 40px;
    border-bottom: 1px solid #DDD;
	display: flex;
	align-items: center;
}

.info_data_thumarea .info_data_logo_area a {
	display: inline-block;
}

.info_data_thumarea .info_data_logo_area img {
    width: 60px;
    height: 60px;
    border: 1px solid #DDD;
    -webkit-border-radius: 50px;
    border-radius: 30px;
}

.info_data_textarea {
	margin-left: 40px;
}
.textarea_item {}
.textarea_item.user_name {
	margin-bottom: 10px;
}
.user_name_link {
	font-size: 13px;
    letter-spacing: 0px;
    color: #000;
    text-decoration: underline;
    text-underline-offset: 5px;
}
.textarea_item.shop_name {
	font-size: 13px;
    letter-spacing: 0px;
    color: #000;
}

.textarea_item.shop_name a {
	font-size: 13px;
    letter-spacing: 0px;
    color: #000;
}

.textarea_item.shop_name a {
	text-decoration: none;
}

.textarea_item.user_height {
	font-size: 13px;
    letter-spacing: 0px;
    color: #000;
}

.textarea_item.user_height a {
	font-size: 13px;
    letter-spacing: 0px;
    color: #000;
}

.textarea_item.user_height a:hover {
	text-decoration: none;
}

.info_area_item.info_comment {
	margin-bottom:15px;
}
.info_comment_item {}
.info_comment_item.commentDate {
	display: flex;
	margin-bottom: 27px;
}
.info_item_title {
	font-size: 13px;
    width: 100px;
}
.info_comment_item.comment_text {
	display: flex;
	font-size: 13px;
	line-height: 1.6;
	margin-bottom: 27px;
}

.info_item_comment_textarea{
	flex: 1;
}

.info_box_thumb_area {

}
.info_thumb_list {
	display: flex;
	flex-flow: column;
	margin-right: 30px;
}
.info_thumb_item {
	width: 100%;
	margin-bottom: 12px;
	position:relative;
}
.info_thumb_photo {
	display: block;
	overflow: hidden;
	position: relative;
}
.info_thumb_photo:before {
	content: "";
	display: block;
	padding-top: 133.33%;
}

.info_thumb_item.flex-active {
	border: 2px solid #000;
}

.info_thumb_item.flex-active .info_thumb_photo {
	background: #FFF;
}
.info_thumb_image {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	width: 100%;
	height: auto;
	padding: 2px;
}
.info_thumb_item.flex-active .info_thumb_image {
	/* opacity:0.7; */
}

.info_box_tags_area {
	display: flex;
}
.info_tags_list:before,
.info_tags_list:afetr {
	content: none;
}
.info_tags_list {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin: -10px -5px -12px 0;
	flex: 1;
}
.info_tags_item {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	position: relative;
	margin-right: 12px;
	margin-bottom: 12px;
}
.info_tags_link {
	display:block;
	color: #000;
	padding: 13px 12px;
	border: 1px solid #DDD;
	font-size: 13px;
}
.info_tags_text {
	/* display:block; */
	font-size: 13px;
	text-align: center;
	background-color: #fff;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	-ms-border-radius: 2px;
	-o-border-radius: 2px;
}
/* 01-01-02-02 info_box_styling_area
------------------------------------*/
.info_box_styling_area {
	margin-top: 30px;
	padding-top: 30px;
	border-top: 1px solid #ccc;
}
.styling_area_heading {
	font-size: 15px;
	font-weight: bold;
	margin-bottom: 40px;
}
.styling_area_block {}
.styling_area_list {
	display: block;
}

.styling_area_list:before {
	display: none;
}

.styling_area_item {
	display: flex;
	margin-bottom: 40px;
}
.styling_area_link {
	display: block;
	position: relative;
}

.styling_area_photo {
	width: 115px;
}

.styling_area_photo:before {

}
.styling_area_image {
	width: 100%;
	height: auto;

}
.styling_area_item_name {
	font-size: 13px;
	color: #000;
    font-family: "Roboto", sans-serif;
	line-height: 2em;
    opacity: 1;
}

.styling_area_info {
	margin-left: 20px;
	flex: 1;
}

.styling_area_color_size {
	letter-spacing: -.4em;
	margin-bottom: 10px;
}
.styling_area_item_color {
	display: inline-block;
	vertical-align: middle;
	letter-spacing: 0;
}
.styling_area_item_size {
	display: inline-block;
	letter-spacing: 0;
	font-size: 13px;
    color: #000;
	line-height: 2em;
    font-family: "Roboto", sans-serif;
	margin-top: 40px;
}
.styling_area_item_text {
	display: inline-block;
	vertical-align: middle;
	letter-spacing: 0;
	padding: 0 2px;
}
.styling_area_price {
	font-size: 13px;
    color: #000;
    font-family: "Roboto", sans-serif;
}
.styling_area_item_price {
	font-size: 13px;
    color: #000;
	line-height: 2em;
    font-family: "Roboto", sans-serif;
}
.styling_area_item_price * {
	font-size: 13px;
    color: #000;
	line-height: 2em;
    font-family: "Roboto", sans-serif;
}

.goods_price_proper {
	font-size: 13px;
    color: #000;
	line-height: 2em;
    font-family: "Roboto", sans-serif;
}



/* 01-01-02 detail_other_style_box
----------------------------------------------------*/
.detail_other_style_box {
	width: 100%;
	margin-bottom: 80px;
	padding-bottom: 80px;
}
.other_style_box_inner_box {
	max-width: 1200px;
	margin: 0 auto;
}
.other_style_heading {
	font-size: 15px;
	font-weight: bold;
}
.other_style_block {
	/* margin-bottom:30px; */
}
.other_style_list {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-left: -20px;
	margin-right: -20px;
	position: relative;
}
.other_style_item {
	-ms-flex: 0 0 20%;
	flex: 0 0 20%;
	width: 100%;
	max-width: 20%;
	padding: 0 20px;
	position:relative;
}
.other_style_link {
	display: block;
	position: relative;
}
.other_style_link:before {
	content: "";
	display: block;
	padding-top: 133.33%;
}
.other_style_image {
	width: 100%;
	height: auto;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}
.other_style_btn_area {
	display: block;
	text-align: center;
	position: absolute;
	right: 0;
}

.other_style_btn_area.page_back {
	margin: 80px 0;
    position: initial;
    display: flex;
    justify-content: center;
}

.other_style_btn_area.page_back .common_more_text {
	padding-left: 8px;
}

.other_style_btn {
	color: #000;
    font-family: "Roboto", sans-serif;
    font-size: 15px;
    font-weight: 700;
    padding: 0 50px 0 0;
    transition: all .2s;
    position: relative;
}

.other_style_title_wrapper {
	display: flex;
    align-items: center;
    margin-bottom: 40px;
	position: relative;
}

.detail_thum_box {
	width: 92px;
    max-width: 92px;
}

.common_title_name:hover {
    color: #000;
    opacity: .5;
	text-decoration: none;
    transition: all .4s;
    -webkit-transition: all .4s;
    -moz-transition: all .4s;
    -ms-transition: all .4s;
    -o-transition: all .4s;
}