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

#IDX .ttl-bg {
	height: 600px;
	margin-bottom: 0;
}
#IDX .top-clm{
	background-color: rgba(239,239,239,0.9);
	margin-bottom: 0;
	position: absolute;
	z-index: 10;
	width: 100%;
}
#IDX .sub-section{
	position: relative;
	z-index: 14;
	font-size: 1.071em;
	width: 1400px;
	margin: 0 auto 130px;

	margin-left: -700px;
	max-width: 1400px;
	position: relative;
	left: 50%;

	min-height: 342px;
	padding-top: 0;
}
#IDX .sub-section .sub-clm {
	margin-right: 490px;
}
#IDX .sub-section.rev .sub-clm {
	margin-left: 500px;
	margin-right: 0;
}
#IDX .sub-section .sec-btn-lst{
	margin-right: -10px;
	/* overflow: hidden; */
	width: 588px;
}
#IDX .sub-section .sec-btn-lst .sec-btn{
	margin-right: 10px;
	margin-bottom: 10px;
	float: left;
	text-align:center;
}
#IDX .sub-section .sec-btn-lst .sec-btn h3{
	font-size:100%;
}
#IDX .sub-section .sec-btn{
	width: 284px;
}
#IDX .sub-section .ttl{
	padding-bottom: 35px;
}
#IDX .sub-section .txt{
	margin-bottom: 35px;
}
#IDX .sub-section .copy-txt{
	color: #792906;
	font-size: 1.200em;
	margin-bottom: 25px;
}
#IDX .section .btn-lists-02{
	margin-bottom: 129px;
}

#IDX .sub-section-01{
	background: url(/images/about/clm1_img01.jpg) top right 100px no-repeat;
	background-size: 520px auto;
	margin-top: 90px;
}
#IDX .sub-section-02{
	background: url(/images/about/clm2_img01.jpg) top left 100px no-repeat;
	background-size: 520px auto;
	margin-bottom: 63px;
}
#IDX .sub-section-03{
	background: url(/images/about/clm3_img01.jpg) top right 100px no-repeat;
	background-size: 520px auto;
}
#IDX .sub-section-04{
	background: url(/images/about/clm4_img01.jpg) top right 100px no-repeat;
	background-size: 520px auto;
}
#IDX .sub-section-06 {
	background: url(/images/about/clm6_img01.jpg) top left 100px no-repeat;
	background-size: 520px auto;
}
#IDX .sub-section-05{
	text-align: center;
}
#IDX .sub-section-05 .ttl{
	font-size: 100%;
	padding-bottom: 17px;
}
#IDX .sub-section-05 > .inner{
	background: #EBEBEB;
	padding: 40px 0;
	max-width: 1200px;
}
#IDX .sub-section-05 .youtube{
	display: inline-block;
	position: relative;
}
#IDX .sub-section-05 .youtube::after{
	content: "";
	background: url(/common/images/icon_youtube.svg) no-repeat;
	background-size: contain;
	width: 76px;
	height: 54px;
	display: block;
	position: absolute;
	top: calc(50% - 27px);
	left: 0;
	right: 0;
	bottom: 0;
	margin: 0 auto;
}
#IDX .sub-section-05 .youtube:hover::after{
	transition: all 0.3s;
	opacity: 0.7;
}
#IDX .sub-section-05 .youtube img{
	border-radius: 20px;
	overflow: hidden;
	width: 560px;
}

/*----------------会社概要*/
#OUTLINE .main-img{
	margin-bottom:100px;
}
#OUTLINE .main-img img{
	margin:0 auto;
}
#OUTLINE .map{
	margin-left: -150px;
	margin-top: 20px;
}

/*----------------ツマガリの歩み*/
#HISTORY .section-01{
	margin-bottom:0;
}
#HISTORY .main-txt{
	text-align: center;
	margin-top: 9px;
	margin-bottom: 43px;
}
#HISTORY .list-type-01{
	position: relative;
	margin-left:25px;
	padding-left:20px;
	padding-top: 20px;
	padding-bottom: 100px;
}
#HISTORY .list-type-01::before{
	content: "";
	width: 1px;
	height: 100%;
	background-color: #bdc9c2;
	position: absolute;
	left: -1px;
	top: 0;
	z-index: -1;
}
#HISTORY .list-type-01 .date::before{
	content: "";
	display: inline-block;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background-color: #7b9485;
	position: absolute;
	top: 40px;
	left: -6px;
}
#HISTORY .section-01:last-child .list-type-01::before{
	height: 40px;
}
#HISTORY .list-type-01 .ttl-02-1{
	margin-bottom: 16px;
}
#HISTORY .list-type-01 .date{
	min-width: 83px;
	margin-right: 20px;
	display: inline-block;
	color: #666;
	font-size: 14px;
	font-weight: normal;
}
#HISTORY .list-type-01.point{
	background: url(/images/about/history_clm2_img01.png) no-repeat bottom right;
	min-height: 257px;
	box-sizing: border-box;
}
#HISTORY .list-type-01.point02{
	background-image:url(/images/about/history_clm5_img02.png);
}

/* SP
----------------------------------------------------------*/
@media only screen and (max-width: 640px) {

#IDX .pc-inner{
	padding: 0;
	width: 100%;
	max-width: none;
}

#IDX .sub-section{
	width:100%;
	margin-left:0;
	max-width: auto;
	position: relative;
	left: 0;

}
#IDX .sub-section .sub-clm,
#IDX .sub-section.rev .sub-clm{
	margin-left:0;
	margin-right:0;
}
#IDX .sub-section-01,
#IDX .sub-section-02,
#IDX .sub-section-03,
#IDX .sub-section-04,
#IDX .sub-section-05,
#IDX .sub-section-06{
	background:none;
	height: auto;
	margin-top: 0;
	padding-top: 0;
}
#IDX .sub-section-02{
	margin-bottom: 10%;
}
#IDX .sub-section-05{
	min-height: auto;
}
#IDX .sub-section .sub-ph{
	margin-bottom: 5%;
}
#IDX .sub-section .ttl{
	padding: 0 3.125%;
	margin-bottom: 7.5%;
	height: 76px;
}
#IDX .sub-section .ttl img{
	height:100%;
	width:auto;
}
#IDX .ttl-bg {
	height: auto;
	margin-bottom: 11.25%;
}
#IDX .sub-section .sec-btn-lst{
	width: 100%;
	margin-right: 0;
}
#IDX .sub-section .sec-btn-lst .sec-btn{
	float:none;
	max-width: 474px;
	width: 100%;
	margin: 0 auto 2.5%;
}
#IDX .sub-section-05 .ttl{
	padding-bottom: 17px;
	margin: 0;
	height: auto;
}
#IDX .sub-section-05 .ttl img{
	min-width: 47.5vw;
	max-width: 80%;
	height: auto;
}
#IDX .sub-section-05 > .inner{
	padding: 7.813vw 0;
}
#IDX .sub-section-05 .youtube::after{
	width: 15.625vw;
	height: 12.5vw;
	top: calc(50% - 6.25vw);
}
#IDX .sub-section-05 .youtube img{
	width: 93%;
}


.section{
	margin-bottom: 12.5%;
}
.copy-section{
	background: url(/images/home/copy_bg_sp.png) 30px bottom  no-repeat;
	margin-bottom: 50px;
	background-size: contain;
}
.copy-section .copy-ttl{
	width: 100%;
	margin: 0 auto 10%;
}
.copy-section .copy-txt{
	margin-left: 3.125%;
	padding-bottom: 7.8125%;
	width: 70%;
	max-width: 348px;
}
.sub-section{
	width: 100%;
	margin: 0 auto 7.8125%;
}

.products-section .ttl,
.shops-section .ttl{
	padding-top: 9.375%;
	margin-bottom: 12.5%;
	width: 100%;
	max-width: 439px;
}
.products-section .bx-viewport{
	margin-bottom: 9.375%;
}
.products-section .product-lists{
	width: 100%;
	margin-bottom: 12.5%;
}
.products-section .product-lists li{
	width: 100%;
	margin: 0 auto;
}
.products-section .product-lists li img{
	max-width: 285px;
	width: 75%;
}
.products-section .shop-btn{
	width: 93.75%;
	max-width: 474px;
	margin-bottom: 10%;
}
.products-section .bx-wrapper{
	width: 100%;
}
.products-section .bx-wrapper .bx-prev {
	left: 0px;
	margin-left: 0;
}
.products-section .bx-wrapper .bx-next {
	right: 0px;
	margin-right: 0;
}
.shops-section .shop-lists{
	padding-left: 0;
	width: 103.125%;
	margin: 0 auto 3.125%;
	margin-right: -3.125%;
}
.shops-section .shop-lists li{
	margin-right: 3.125%;
	margin-bottom: 6.25%;
	width: 46.875%;
	box-sizing: border-box;
}
.shops-section .shop-lists li a.photo{
	margin-bottom: 3.125%;
	padding-top: 80%;
}
.shops-section .shop-lists li.shop01 a.photo{
	background: url(/images/home/shop_img01_sp.jpg) no-repeat left top;
	background-size: contain;
}
.shops-section .shop-lists li.shop02 a.photo{
	background: url(/images/home/shop_img02_sp.jpg) no-repeat left top;
	background-size: contain;
}
.shops-section .shop-lists li.shop03 a.photo{
	background: url(/images/home/shop_img03_sp.jpg) no-repeat left top;
	background-size: contain;
}
.shops-section .shop-lists li.shop01 a.photo.mouse-over:hover,
.shops-section .shop-lists li.shop02 a.photo.mouse-over:hover,
.shops-section .shop-lists li.shop03 a.photo.mouse-over:hover{
	background-position: 0 0;
}
.shops-section .shop-lists li .txt .tel {
	font-size: 1em;
}
.shops-section .shop-lists li .txt .tel .small {
	font-size: 0.75em;
}
.topics-section,
.oshirase-section{
	width: 100%;
	float: none;
}
.topics-section .ttl,
.oshirase-section .ttl{
	margin-bottom: 6.25%;
	min-width: 140px;
	width: 33.33%;
}
.topics-section ul{
	margin-right: 0;
	margin-bottom: 10%;
}
.topics-section ul li .detail,
.topics-section ul li a .detail{
	width: 100%;
	margin: 0 0 3.125% 0;
	box-sizing: border-box;
	padding-bottom: 0;
}
.topics-section ul li .photo{
	margin-bottom: 0;
	margin-right: 3.125%;
	padding: 2%;
	float: left;
	width: 30%;
}
.topics-section ul li .txt-box .txt{
	float: left;
	padding: 2% 2% 2% 0;
	width: 59.5%;
}
.topics-section ul li .txt-box .date{
	padding-right: 3.125%;
	margin-bottom: 0;
	padding-bottom: 0;
}
.oshirase-section ul li{
	margin-bottom: 4.69%;
	padding-bottom: 4.69%;
}
.oshirase-section ul li:first-child{
	border-top: 1px dashed #a7a7a7;
	padding-top: 4.69%;
}

/*----------------会社概要*/
#OUTLINE .main-img{
	margin-bottom:15%;
}
#OUTLINE .main-img img{
	width:63%;
}
#OUTLINE .map{
	margin-left: 0;
}
#OUTLINE iframe {
	top: 0;
	left: 0;
	width: 100%;
	height: 402px;
}

/*----------------あゆみ*/
#HISTORY .main-txt{
	max-width: 447px;
	width: 80%;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 10%;
}
#HISTORY .list-type-01{
	margin-left: 3%;
	padding-left: 5%;
}
#HISTORY .section-01:last-child .list-type-01::before{
	height: 35px;
}
#HISTORY .list-type-01 .date{
	display: block;
}
#HISTORY .list-type-01 .date::before{
	top: 26px;
}


}