@charset "euc-jp";

/* top */
.top-contents{
    max-width: 1100px;
    margin: 0 auto;
}
.top-contents h2 {
			text-align: center;
			font-weight: bold;
			font-size: 24px;
			color: #000;
		}


/*slider*/
@media (max-width: 1099px) {
.top-contents{
    width: 96%;
    margin: 0 auto 5% auto;
}
.slider {
			position: relative;
			}
			.slider .slider-inner {
			}
			.slider .bx-custom-controls-direction {
				position: static;
				width: auto;
				height: 0;
			}
			.slider .bx-custom-controls-direction > div {
				position: absolute;
				top: calc(50% - 15.5px / 2);
				outline: 0;
				width: auto;
				height: auto;
				text-indent: initial;
				z-index: 100;
			}
			.slider .bx-custom-controls-direction .bx-custom-prev {
				left: 20px;
			}
			.slider .bx-custom-controls-direction .bx-custom-prev a {
				display: block;
			}
			.slider .bx-custom-controls-direction .bx-custom-next {
				right: 20px;
			}
			.slider .bx-custom-controls-direction .bx-custom-next a {
				display: block;
			}
			.slider .bx-custom-controls-direction .bx-custom-prev img,
			.slider .bx-custom-controls-direction .bx-custom-next img {
				width: auto;
				height: 15.5px;
			}
			.slider .bx-wrapper {
				margin-bottom: 30px;
			}
			.slider .bx-wrapper img {
			}
			.slider .bx-wrapper .bx-viewport {
				-moz-box-shadow: initial;
				-webkit-box-shadow: initial;
				box-shadow: initial;
				border: initial;
				left: initial;
				background: initial;
				-webkit-transform: initial;
				-moz-transform: initial;
				-ms-transform: initial;
				-o-transform: initial;
				transform: initial;
			}
			.slider .bx-wrapper .bx-pager {
				padding-top: 10px;
				bottom: -20px;
			}
			.slider .bx-wrapper .bx-pager.bx-default-pager a:hover {
				background: #888;
			}
			.slider .bx-wrapper .bx-pager.bx-default-pager a.active {
				background: #000;
			}
			.slider .bx-wrapper .bx-pager.bx-default-pager a {
				background: #d2d2d2;
				width: 30px;
				height: 5px;
			}
 }
/*slider*/
@media (min-width: 1100px) {
.slider {
				position: relative;
				overflow: hidden;
				width: 100%;
				margin: auto;
			}
			.slider .slider-inner {
				margin: auto;
			}
			.slider .bx-custom-controls-direction {
				position: static;
				width: auto;
				height: 0;
				height: 0;
			}
			.slider .bx-custom-controls-direction > div {
				position: absolute;
				top: calc(50% - 31px / 2);
				outline: 0;
				width: auto;
				height: auto;
				text-indent: initial;
				z-index: 100;
			}
			.slider .bx-custom-controls-direction .bx-custom-prev {
				left: calc(50vw - (1100px / 2) + 20px);
			}
			.slider .bx-custom-controls-direction .bx-custom-prev a {
				display: block;
			}
			.slider .bx-custom-controls-direction .bx-custom-next {
				right: calc(50vw - (1100px / 2) + 20px);
			}
			.slider .bx-custom-controls-direction .bx-custom-next a {
				display: block;
			}
			.slider .bx-custom-controls-direction .bx-custom-prev img,
			.slider .bx-custom-controls-direction .bx-custom-next img {
				width: auto;
				height: 31px;
			}
			.slider .bx-wrapper {
				margin-left: calc((100vw - (1100px + 0px)) / 2 - (1100px + 10px)); /* 1100px ... slideWidth, 10px ... slideMargin */
				margin-bottom: 30px;
				max-width: none;
				width: calc(3300px + 10px * 3);
			}
			.slider .bx-wrapper img {
			}
			.slider .bx-wrapper .bx-viewport {
				-moz-box-shadow: initial;
				-webkit-box-shadow: initial;
				box-shadow: initial;
				border: initial;
				left: initial;
				background: initial;
				-webkit-transform: initial;
				-moz-transform: initial;
				-ms-transform: initial;
				-o-transform: initial;
				transform: initial;
			}
			.slider .bx-wrapper .bx-pager {
				padding-top: 10px;
				bottom: -20px;
			}
			.slider .bx-wrapper .bx-pager.bx-default-pager a:hover {
				background: #888;
			}
			.slider .bx-wrapper .bx-pager.bx-default-pager a.active {
				background: #000;
			}
			.slider .bx-wrapper .bx-pager.bx-default-pager a {
				background: #d2d2d2;
				width: 30px;
				height: 5px;
			}
}

/*about*/
		.about {
			margin-top: 100px;
		}
		.about h2 {
			font-size: 11px;
			color: #000;
            font-weight: bold;
            text-align: left;
		}
		.about .about-lead {
			margin-top: 15px;
			font-size: 20px;
			color: #000;
            line-height: 1.6;
		}
		@media (min-width: 1100px) {
            .about h2 {
                padding: 100px 0 0 0;
            }
			.about .about-bg {
				width: 100%;
				height: 610px;
				background: url(https://file003.shop-pro.jp/PA01427/895/img/about_bg.jpg);
				background-repeat: no-repeat;
				background-position: center top;
				color: inherit;
			}
		}
		@media (max-width: 1099px) {
			.about .about-bg {
				width: auto;
				height: auto;
				background: none;
				background-repeat: initial;
				background-position: initial;
				color: inherit;
			}
		}
        @media (max-width: 768px) {
            .about{
                width:100%;
                margin: 10% auto 5% auto;
            }
		}
		.about .about-content {
			display: block;
			margin: auto;
			background: transparent none;
		}
		.about .about-inner-content {
			background: #f6f6f6;
			color: inherit;
		}
		@media (min-width: 1100px) {
            .about .sp{
                display: none;
            }
			.about .about-content {
				width: 1100px;
			}
			.about .about-inner-content {
				width: 480px;
			}
		}
		@media (max-width: 1099px) {
			.about .about-content {
				width: auto;
			}
			.about .about-inner-content {
				width: auto;
			}
            .about .about-inner-content {
				width: 48%;
			}
         }
            .about .about-body {
                margin-top: 40px;
                line-height: 1.65;
                font-size: 14px;
                color: #535353;
            }
        @media (max-width: 1099px) and (min-width: 768px) {
            .about h2 {
                padding: 10% 0 0 0;
            }
			.about .about-bg {
				width: 100%;
				height: 610px;
				background: url(https://file003.shop-pro.jp/PA01427/895/img/about_bg.jpg);
				background-repeat: no-repeat;
				background-position: center top;
				color: inherit;
			}
            .about .about-image img{
                display: none;
            }
            .about .about-inner-content {
				width:45%;
                margin: 0 0 0 2%;
			}
        }

        @media (max-width: 768px) {
            .about .sp{
                display: block;
            }
            .about h2 {
                width: 90%;
                margin: 5% auto;
            }
           .about{
			margin:10% auto 5% auto;
		    }
            .about .about-lead{
			    width: 90%;
                margin: 5% auto;
		    }
             .about .about-body{
			    width: 90%;
                margin: 5% auto;
		    }
            .about .about-inner-content {
				width: 100%;
			}
            .about .about-image{
                background: none;
                height: auto;
            }
            .about .about-image img{
                display: block;
                width: 96%;
                float: right
            }
		}


/*pickup*/
.pickup {
		margin-top: 80px;
		}
.pickup .pickup-items{
    padding: 80px 0;
}
		@media (min-width: 1100px) {
			.pickup .pickup-item {
				padding: 0 30px;
			}
			.pickup .pickup-item a {
				display: block;
				margin-bottom: 40px;
			}
		}
		@media (max-width: 1099px) {
            .pickup .pickup-items{
                padding: 10% 0;
            }
			.pickup .pickup-item {
				padding: 0 3%;
			}
			.pickup .pickup-item a {
				display: block;
				margin-bottom: 10px;
			}
		}
		.pickup .pickup-item-caption {
			margin-top: 10px;
			font-weight: bold;
		}

/*category*/
.category {
			margin-top: 50px;
		}

		.category .category-items {
			margin-top: 50px;
		}

		.category .category-item {
			margin-top: 20px;
			padding: 0 10px;
		}

		.category .category-item a {
			display: block;
		}

		.category .category-item img {
			width: auto;
			height: auto;
		}

		.category .category-item-caption {
			width: 100%;
			height: 50px;
			font-size: 14px;
			font-weight: bold;
			line-height: 50px;
			text-align: center;
			background: #000;
			color: #fff;
		}
@media (max-width: 1099px) {
            .category {
                margin-top: 10%;
            }
            .category .category-items {
                    margin-top:10%;
                }
            .category .category-item {
                    margin-top:5%;
                    padding: 0 3%;
                }
		}

/*news*/
.news {
			margin-top: 50px;
		}

		@media (min-width: 1100px) {
			.news .news-items {
				margin: 50px auto 0;
			}
		}
		.news .news-items li {
			padding: 30px 0;
			font-size: 12px;
			border-bottom: solid thin #d2d2d2;
		}
		.news .news-items li:first-child {
			border-top: solid thin #d2d2d2;
		}
		.news .news-items li b {
			padding-right: 4em;
		}
@media (max-width: 1099px) {
        .news {
                margin-top: 15%;
            }
  
            .news .news-items {
                    margin: 10% 5px 0;
                }
            .news .news-items li {
                    padding: 5% 0;
                }
            .news .news-items li b {
                    padding: 0 0 2% 0;
                display: block;
		}
}

/*products-category*/
.products-category {
			margin-top: 50px;
		}

		.products-category h3 {
			text-align: center;
		}
        .products-category h3 span{
            font-family: 'Montserrat', 'Noto Sans JP', sans-serif;
        }
		.products-category h3 span:nth-of-type(1) {
			display: block;
			font-weight: bold;
			font-size: 12px;
			color: #959595;
		}

		.products-category h3 span:nth-of-type(2) {
			margin-top: 15px;
			display: block;
			font-weight: bold;
			font-size: 17px;
			color: #000;
		}

		@media (min-width: 1100px) {
			.products-category .products-category-item {
				margin: 70px 0 0 0;
				padding: 0 0 0 0;
                width: 45%;
                float: left;
			}

			.products-category .products-category-item:nth-of-type(2n) {
                float: right;
			}

			.products-category .products-category-product-item {
				padding: 0 0 0 15px;
			}

			.products-category .products-category-product-item:nth-of-type(odd) {
				padding: 0 15px 0 0;
			}
		}
		@media (max-width: 1099px) {
            .products-category {
                margin-top: 10%;
            }
			.products-category .products-category-item {
				margin: 5% 0 10% 0; 
				padding: 0 3%;
			}

			.products-category .products-category-item:nth-of-type(odd) {
				padding: 0 3%;
			}

			.products-category .products-category-product-item {
				padding: 0 3%;
			}

			.products-category .products-category-product-item:nth-of-type(odd) {
				padding: 0 3%;
			}
		}

		.products-category .products-category-product-items {
			margin-top: 10%;
		}

		.products-category .products-category-product-item img {
		}

		.products-category .products-category-product-item:nth-of-type(odd) img {
		}

		.products-category .products-category-product-item a {
			display: block;
		}

		.products-category .products-category-product-item-caption {
			margin-top: 19px;
			font-weight: bold;
		}

		.products-category .products-category-item-more {
			display: block;
			margin: 40px auto 0;
			width: 120px;
			height: 36px;
			line-height: 36px;
			text-align: center;
			font-size: 12px;
			font-weight: bold;
			background: #000;
			color: #fff;
		}

/*instagram */
.instagram {
			margin-top: 100px;
		} {
			padding-top: 100px;
			padding-bottom: 100px;
		}

		.instagram h2 {
		}

		.instagram .instagram-items {
		}

		@media (min-width: 1100px) {
			.instagram .instagram-item {
				margin-top: 89px;
				padding: 0 30px;
			}
		}
		@media (max-width: 1099px) {
            .instagram {
                padding-top: 10%;
                padding-bottom: 10%;
            }
            .instagram .instagram-items {
                margin-top: 5%;
		    }
			.instagram .instagram-item {
				margin-top: 6%;
				padding: 3%;
			}
            
		}
		.instagram .instagram-item a {
			display: block;
		}


/* 2020年7月22日追記 */

/* PCのバナー表示指定 "banner_pc"のclassがついた画像が表示される */
.banner_pc { display: block !important; }
.banner_sp { display: none !important; }

/* SMPのバナー表示指定　"banner_sp"のclassがついた画像が表示される */
@media only screen and (max-width: 750px) {
.banner_pc { display: none !important; }
.banner_sp { display: block !important; }
}
