@charset "utf-8";

@media screen and (max-width : 767px ) {
/*=================================================
	共通
=================================================*/	
#side_cts #shops #shopLIst li a{
	background:url(../Image/common/bg_02.png) left top repeat;
	padding:15px 12px;
	position:relative;
        width: 50%;
}
/*=================================================
	ハンバーガーボタン
=================================================*/

.drawer-hamburger {
	background: #eab116;
}
.drawer-hamburger :hover {
	background: #eab116;
}
/*=================================================
	TOP PAGE
=================================================*/
#top .topsec {
	width: 90%;
	margin: 0 auto;
}
/*========================
	BLOG NEWS
=======================*/
#top .topicList li a {
	padding: 20px 0;
	display: block;
}
#top #sec_01 #newsList .ttl {
	float: left;
	width: 100%;
	padding-left: 0px;
}
#top #sec_02 #blogList .ttl {
	float: left;
	width: 100%;
	padding-left: 0px;
}
#top #sec_02 #blogList .cat {
	margin-bottom: 5px;
}
#top #sec_02 .topbanner li {
    width: 100%;
    float:none;
    margin-right:0;
	margin-bottom: 30px;
}
#top .viewmore {
	padding-right:0;
	padding:15px 40px 0;

}
#top .viewmore a{
	padding: 10px 0 10px 95px;
	display: block;
	text-align: left;
	background: url(../Image/common/arrow_01.png) 50px center no-repeat #fff;
}
/*========================
	ABOUT UNIR
=======================*/	
#top #sec_03 #aboutList {
	padding: 40px;
}
#top #sec_03 #aboutList li {
	display: block;
	margin-right: 0;
	width: 100%;
	margin-bottom: 70px;
}
#top #sec_03 #aboutList li .img:after {
	content: "";
	height: 110%;
	width: 90%;
	background: #b5b5b5;
	position: absolute;
	top: -12px;
	left: 15px;
}
#top #sec_03 #aboutList li .readmore {
	font-size: 11px;
	font-weight: bold;
	letter-spacing: 0.1em;
	border: 1px solid #000;
	padding: 10px 0 10px 95px;
	background: url(../Image/common/arrow_01.png) 50px center no-repeat #fff;
	transition: .3s;
}
/*========================
	SNS
=======================*/		
#top #sec_04 #sns_bnr li {
	float: left;
	width: 48%;
	margin: 0;
	padding: 0;
	margin-right: 4%;
	margin-bottom: 4%;
}
#top #sec_04 #sns_bnr li:nth-child(2n) {
	margin-right: 0;
}
#top #sec_04 #sns_bnr {
	padding: 0 5%;
}
#top #sec_04 {
	padding-top: 0;
}
/*========================
	SHOP
=======================*/	
#side_cts #shops {
	width: 100%;
}
/*=================================================
	下層ページ　共通
=================================================*/
.under #mainimage h1 {
	width: 100%;
	color: #fff;
	font-size: 40px;
	letter-spacing: 0.3em;
	line-height: 1;
	margin: 0 auto;
	text-align: right;
	padding: 28px 0 20px;
}
.under #breadcrumb .breadcrumb_list {
	width: 100%;
	margin: 0 auto;
	font-size: 12px;
	overflow: hidden;
	margin-bottom: 30px;
}
#blog_single.under #breadcrumb .breadcrumb_list {
	height:30px;
}
.under #mainimage {
	background: url(../Image/about-unir/bg01.jpg) left -240px top -30px repeat-x;
	min-height: 250px;
	background-size: 800px;
	background-attachment: fixed;
	position: relative;
}
.under .ttl_01:before {
	display: none;
}
/*=================================================
	COMPANY
=================================================*/	
#company .ttl_01:before {
	display: none;
}
#company h2 {
	font-size: 30px;
	letter-spacing: 0.2em;
	/* position: relative; */
    /* line-height: 1; */
    /* display: inline-block; */
	margin-bottom: 40px;
	width: 100%;
	margin-left: 0;
	text-align: -webkit-center;
}
#company section {
	padding: 35px 0;
	padding-bottom: 0px;
	margin-bottom: 0px;
	width: 90%;
	margin: 0 auto;
}
#company section .sheet_01 {
	font-size: 14px;
	margin-top: 30px;
	margin-left: 0px;
}
#company section .sheet_01 dt {
	font-weight: bold;
	float: none;
	width: 100%;
	margin-bottom: 10px;
	padding-right: 0px;
}
#company section .sheet_01 dd {
	padding: 0px 0px 20px 40px;
	border-bottom: 1px dotted #fff;
	float: none;
	width: 100%;
	border-left: 3px solid #eee9dc;
	margin-bottom: 30px;
	margin-left: 10px;
	box-sizing: border-box;
}
#company #timeline {
	list-style: none;
	margin: 50px 0px 0 10px;
	padding-left: 30px;
	border-left: 8px solid #eee9dc;
}
#company .date {
	margin-top: -10px;
	top: 0;
	left: -50px;
	line-height: 20px;
	position: absolute;
	font-weight: bold;
}
#company label {
	position: absolute;
	z-index: 100;
	cursor: pointer;
	top: 18px;
	transition: transform 0.2s linear;
	padding-left: 20px;
}
#company .com_txt {
	font-weight: bold;
	padding-left: 60px;
	padding-left: 20px;
}
#company #sec_03 {
	padding-bottom: 60px;
}
/*=================================================
	ABOUT UNIR
=================================================*/	
#about-unir .sec_txt {
	padding: 20px;
}
/*=================================================
	PROFILE
=================================================*/	
#profile section {
	width: 90%;
	margin: 0 auto;
}
#profile .sec_box h2 {
	border-bottom: solid 1px #bd8e4b;
	text-align: center;
	font-size: 28px;
	line-height: 1;
	padding: 50px 0;
}
#profile #sec_01 {
}
#profile .prof {
	padding: 10px;
}
#profile .prof .prof_img {
	width: 80%;
	margin: 10%;
	border-radius: 100%;
	overflow: hidden;
	display: block;
	/* padding: 20px; */
	box-sizing: border-box;/* display: inline-flex; */
}
#profile .prof dl dt {
	font-size: 22px;
	font-weight: bold;
	border-bottom: dashed 1px #333;
	padding: 10px;
	text-align: -webkit-center;
}
/*========================
	SECTION 1
=======================*/
#profile #sec_01 .prof dl dd ul li {
	background: url(../Image/common/icon_bean.png) left 15px no-repeat;
	font-weight: bold;
	padding: 10px 0 10px 15px;
	font-size: 11px;
	line-height: 24px;
}
#profile .prof dl {
	display: block;
	width: 100%;
}
#profile #sec_01 .prof_txt {
	padding: 20px;
	font-weight: 400;
}
/*========================
	SECTION 2
=======================*/
#profile #sec_02 {
	margin-bottom: 40px;
}
#profile #sec_02 .prof_txt {
	padding: 20px;
	font-weight: 400;
}
#profile #sec_02 dl dd table th {
	background: url(../Image/common/icon_bean.png) left 15px no-repeat;
	font-weight: bold;
	padding: 10px 0 10px 15px;
	font-size: 11px;
	line-height: 24px;
}
#profile #sec_02 dl dd table td {
	font-size: 11px;
	padding-right: 0;
}
#profile .trophy {
	width: 100%;
	position: relative;
	display: inline-block;
	overflow: hidden;
	box-sizing: border-box;
	text-align: center;
	margin-top: 30px;
	padding: 10px;
}
#profile #sec_02 div.prof:nth-child(2n+1) .prof_img {
	display: block;
	margin: 10%;
}
#profile .img_box {
	padding: 0 20px;
}
#profile .img_box li {
	width: 100%;
	margin-right: 0;
	display: block;
	text-align: center;
	margin-bottom: 50px;
}
#profile .img_box li img {
	border-radius: 50%;
	overflow: hidden;
	width: 80%;
}
/*=================================================
	FOR BUSINESS
=================================================*/
#forbusiness section{
	width: 90%;
	margin: 0 auto;
}
#forbusiness .ttl_03 {
	text-align: center;
	margin-bottom: 30px;
}
/*========================
	SECTION1
=======================*/
#forbusiness #sec_01 .help img {
	margin: 0 auto;
	width: 100%;
}
#forbusiness #sec_01 .want_unir {
	height: auto;
	border: 1px solid #000;
	margin-bottom: 20px;
}
#forbusiness #sec_01 span.want_txt {
	width: 100%;
}

#forbusiness #sec_01 span.want02 {
	background: url(../Image/whole-sale/forbusi_02b.jpg)right no-repeat;
}
/*========================
	SECTION2
=======================*/
#forbusiness #sec_02 .ttl05_txt {
    width: 100%;
    float: left;
    padding: 0px;
    box-sizing: border-box;
    line-height: 24px;
}
#forbusiness #sec_02 .graf_box {
    width: 100%;
    float: none;
}
#forbusiness #sec_02 li .graf {
    width: 90%;
    box-sizing: border-box;
    float: none;
    text-align: center;
    margin: 0 auto;
    display: block;
}
#forbusiness #sec_02 li {
    height: auto!important;
	margin-bottom: 30px;
}
#forbusiness #sec_02 .box {
    width: 100%;
    float: none;
}
#forbusiness #sec_02 .img_box {
    width: 90%;
    float: none;
    text-align: center;
    margin:10px auto;
}
#forbusiness #sec_02 .other_shop .txt_box {
    width: 100%;
    padding-left:0px;
    float: none;
    height: auto;
    box-sizing: border-box;
}
#forbusiness #sec_02 .online {
    width: 100%;
    background: url(../Image/whole-sale/forbusi_05.jpg)no-repeat;
    text-align: center;
    color: #fff;
    font-weight: bold;
    margin-bottom: 30px;
    box-sizing: border-box;
    background-size: cover;
}
#forbusiness .link_btn {
    float: none;
    background: #b52124;
    margin-bottom: 30px;
    text-align: center;
    width: 100%;
    margin-right: 0;
    /* min-height: 123px; */
    box-sizing: border-box;
}
#forbusiness .tel_btn {
    float: none;
    width: 100%;
    margin-right: 0;
    padding: 30px;
    box-sizing: border-box;
    font-size: 16px;
    border: 1px solid;
    font-weight: 700;
    height: auto;
    text-align: -webkit-center;
    margin-bottom: 30px;
}
#forbusiness #sec_02 p.number {
    padding: 10px 0;
    font-size: 18px;
    font-weight: bold;
}
#forbusiness #sec_02 p {
	padding: 0;
	box-sizing: border-box;
}
#forbusiness #sec_02 .ttl_05 {
	width:100%;
	float: left;
	text-align: center;
	border-bottom: 6px solid #000;
	border-right: 0;
	margin: 0 auto;
	margin-bottom:10px;
}
/*========================
	SECTION3
=======================*/
#forbusiness #sec_03 .ttl_05 {
    width: 100%;
    float: none;
    text-align: center;
	border-right: none;
	padding-bottom: 10px;
    border-bottom: 6px solid #000;
    margin-right: 0px;
    height: auto;
}
#forbusiness #sec_03 span.eng {
    text-align: center;
    float: none;
    height:auto;
    padding: 0;
    box-sizing: border-box;
    width: 100%;
    margin-bottom: 5px;
}
#forbusiness #sec_03 .ttl05_txt {
    width: 100%;
    float: none;
    height: auto;
    padding: 15px 2px;
    box-sizing: border-box;
    font-weight: bold;
    text-align: -webkit-center;
}
#forbusiness #sec_03 .img_box {
    width: 90%;
    padding: 0 10px;
    box-sizing: border-box;
    float: none;
    text-align: center;
    margin: 0 auto;
	margin-bottom: 10px;
}
#forbusiness #sec_03 .box {
    width:100%;
    box-sizing: border-box;
    float: none;
    min-height: auto;
    position: relative;
    margin: 0 auto;
    padding-bottom: 50px;
}
#forbusiness #sec_03 .link {
    width: 100%;
    float: none;
    border: 1px soild#000;
    position: absolute;
    /* top: 0; */
    bottom: 0;
    text-align: -webkit-center;
}
#forbusiness #sec_03 .link a {
    padding: 10px;
    background: #fff;
    color: #000;
    border: 1px solid #000;
    width: 100%;
    box-sizing: border-box;
}
/*=================================================
	PRIVACY
=================================================*/
#privacy .sec_inner {
	background-color: #fff;
	box-sizing: border-box;
	padding: 20px;
}
#privacy .sec_inner dl dd .number_list {
	background-color: #f5f5f5;
	padding: 10px 20px 10px 5px;
}
/*=================================================
	CONTACT
=================================================*/
	
#contact input, #contact textarea {
	width: 100%!important;
	border: solid 1px #CCC;
	border-radius: 3px;
	padding: 3px 8px;
	margin: 2px;
	vertical-align: middle;
	box-sizing: border-box;
}
form#mailformpro {
	padding: 10px 0px;
	padding: 20px;
}
/*=================================================
	BLOG
=================================================*/
#blog #sec_01, #blog #sec_02, #blog #sec_03, #blog #sec_04 {
	width: 90%;
	margin: 0 5%;
}
#blog article ul {
	margin-left: 0px;
}
#blog #sec_01 .box_list {
	width: 100%;
	margin-right: 0px;
	margin-bottom: 60px;
	display: block;
	padding: 20px;
	box-sizing: border-box;
	background: #382628;
	background: linear-gradient(135deg, rgba(0,0,0,0) 5px, #e7e7e2 0) top left, linear-gradient(225deg, rgba(0,0,0,0) 5px, #f7f7f3 0) top right, linear-gradient(315deg, rgba(0,0,0,0) 5px, #f9f9f9 0) bottom right, linear-gradient(45deg, rgba(0,0,0,0) 5px, #f9f9f9 0) bottom left;
	background-size: 40% 55%;
	background-repeat: no-repeat;
	text-align: center;
}
#blog #sec_01 .box_list .box_img {
	width: 100%;
	height: 150px;
	overflow: hidden;
	padding-bottom: 10px;
	text-align: -webkit-auto;
}
#blog .categoly {
	padding-bottom: 30px;
	width: 100%;
	float: left;
}
#blog .log {
	border-top: 1px #000;
	padding-bottom: 30px;
	width: 100%;
	float: left;
	margin-left: 0px;
}
#blog #media_contact{
	text-align: center;
}
/*=================================================
	BLOG SINGLE
=================================================*/
#blog_single section {
	width: 90%;
	margin: 0 auto;
}
#blog_single .log {
	width: 100%;
	margin: 0;
}
#blog_single .news_txt img {
	max-width:100%;
	height:auto;
}
/*=================================================
	SITEMAP
=================================================*/
	
#sitemap .left {
	width: 100%;
	padding: 0 30px;
	margin-bottom: 0px;
	box-sizing: border-box;
}
#sitemap .sitemap_nav {
	width: 90%;
	list-style-type: none;
	margin: 0 auto;
	border: solid 1px #000;
	border-top: solid 8px #000;
	margin-bottom: 100px;
}
#blog_single .categoly {
	padding-bottom: 30px;
	width: 100%;
	float: none;
}
#sitemap .right {
	width: 100%;
	padding: 0 30px;
	box-sizing: border-box;
	float: none;
}
/*=================================================
	SHOP
=================================================*/	
#shop section {
	padding-top: 50px;
	padding-bottom: 50px;
	width: 90%;
	margin: 0 auto;
}
#shop .img_left {
	margin-bottom:25px;
}
#shop .shop_guide {
	background: rgba(226, 232, 160, 0.23);
	padding: 20px;
	width: 100%;
	background-image: linear-gradient(90deg, rgba(204,204,204,0) 0%, rgba(204,204,204,0) 49%, rgba(255,255,255,100) 50%, rgba(255,255,255,100) 100%), linear-gradient(180deg, rgba(204,204,204,0) 0%, rgba(204,204,204,0) 98.5%, rgba(100,100,100,100) 100%);
	background-repeat: repeat-x, repeat-y;
	background-size: 4px 100%, 100% 2.4em;
	line-height: 2.4;
	float: left;
	min-height: 160px;
	box-sizing: border-box;
	margin-bottom:25px;
}
#shop .img_left {
	width: 100%;
	float: left;
	padding: 0;
}
#shop .img_left img {
	width: 100%;
	padding: 0;
}
#shop .viewmore {
	padding: 0;
	width: 100%;
	margin: 10px 0;
}
#shop .viewmore a {
	font-size: 11px;
	font-weight: bold;
	letter-spacing: 0.1em;
	border: 1px solid #000;
	padding: 10px 40px 10px 65px;
	background: url(../Image/common/arrow_01.png) 40px center no-repeat #fff;
	transition: .3s;
	text-align: center;
	width: 100%;
	box-sizing: border-box;
}
#shop h2 {
	font-size: 21px;
	letter-spacing:0.05em;
}
#shop .shop_guide dt {
	width: 100%;
	float: none;
	display: inline-block;
	font-weight: bold;
	padding-right: 0px;
}
#shop .shop_guide dd {
	width: 100%;
	float: none;
	padding-left: 10px;
	box-sizing: border-box;
	margin-bottom: 10px;
}
/*=================================================
	SHOP SINGLE
=================================================*/	
#shop_single section {
	padding-top: 50px;
	padding-bottom: 50px;
	width: 90%;
	margin: 0 auto;
}
#shop_single #slideshow {
	margin: 0 auto;
	width: 100%;
	height: auto;
	text-align: left;
}
#shop_single #slideshow div div {
	top: 0;
	left: 0;
	position: absolute;
	width: 100%;
	height: auto;
}
#shop_single #slideshow img {
	width: 100%;
	height: auto;
}
#shop_single section iframe {
	width: 100%!important;
}
#shop_single #slideshow div {
	width: 100%;
	min-height: 205px;
	margin-bottom: 30px;
}
#shop_single #slideshow ul {
	width:100%;
}
#shop_single #slideshow ul li {
    width: 18%;
    padding: 0px 1% 12px 1%;
}
#shop_single #sec_01 li {
	width: 70%;
	padding-right: 0;
	float: none;
	text-align: center;
	margin: 0 auto;
	margin-bottom: 30px;
}
#shop_single #sec_01 li img {
	margin-top: 0;/* margin-top: 10px; */
    /* margin: 0 auto; */
    /* margin: auto; */
}
#shop_single .shop_guide dt {
	width: 100%;
	float: none;
	padding: 10px;
	font-weight: bold;
	padding-left: 0;
}
#shop_single .shop_guide dd {
	width: 100%;
	float: none;
	padding: 10px 0 10px 40px;
	border-left: 5px solid #fff;
	margin-bottom: 20px;
	box-sizing: border-box;
}
#shop_single li.shop_other {
	width: 45%;
	margin-right: 10%;
}
#shop_single li.shop_other:nth-child(2n) {
	margin-right: 0;
}
#shop_single .shop_guide {
	width: 100%;
}
/*=================================================
	下層ページ名
=================================================*/
/*========================
	コンテンツ名
=======================*/
/****************
　コンテンツ　小
**************/
	
}