﻿
@media screen and (min-width: 768px) {

	._sp {
		display: none !important;
	}

}

@media screen and (max-width: 768px) {

	._pc {
		display: none !important;
	}

}

#pickup,
#pickup_detail {
	background: #e6d9c4;
	overflow: hidden;
}

#pickup .pickup_header {
	background: #786043;
}

#pickup .pickup_body picture.pickup_txt {
	display: block;
	margin: 0 auto;
	z-index: 1;
	position: relative;
}

#pickup .pickup_body div.pickup_sec01 {
	z-index: 1;
}

#pickup .pickup_body div.pickup_sec01 > div {
	position: relative;
}

#pickup .pickup_body div.pickup_sec01 .pickup_list01 {
	background: #f3f2ef;
	border-radius: 20px;
}

#pickup .pickup_body #pick_list,
#pickup_detail .pickup_body #pick_list {
	height: 0;
	overflow: hidden;
}

#pickup .pickup_body .result,
#pickup_detail .pickup_body .result {
	position: relative;
}

#pickup .pickup_body .result div.elm,
#pickup_detail .pickup_body .result div.elm {
	position: absolute;
	top: -100%;
}

#pickup .pickup_body .loading,
#pickup_detail .pickup_body .loading {
	background: url(../pickup/loading.gif) center no-repeat;
	min-height: 400px;
}

#pickup .pickup_body .loading .result,
#pickup_detail .pickup_body .loading  .result {
	display: block;
	background: #fff;
	position: relative;
	overflow: hidden;
}

#pickup .pickup_body .result .loading img,
#pickup_detail .pickup_body .result .loading img {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate( -50%, -50% );
}


/* include */

#pickup .result div.elm .title,
#pickup_detail .result div.elm .title {
	font-weight: 600;
	line-height: 1.3;
	margin: 10px 0 5px;
	display: block;
}

#pickup .result div.elm .spot,
#pickup_detail .result div.elm .spot {
	color: #999999;
	font-size: 80%;
	display: block;
}

#pickup .result div.elm .sort,
#pickup_detail .result div.elm .sort {
	display: none;
}

#pickup .result div.elm a .img_outer,
#pickup_detail .result div.elm a .img_outer {
	width: 100%;
	height: 130px;
	border: 1px solid #999;
	background: #fff;
	position: relative;
	display: block;
}

#pickup .result div.elm a .img_outer img,
#pickup_detail .result div.elm a .img_outer img {
	position: absolute;
	top: 50%;
	left: 50%;
	max-width: 100%;
	max-height: 100%;
	transform: translate( -50%, -50% );
}

@media screen and (min-width: 768px) {

	#pickup .pickup_header img {
		display: block;
		margin: 0 auto;
		width: 22.6%;
		padding: 32px 0;
	}

	#pickup .pickup_body {
		background: url(../pickup/pickup_bg01_pc.png) center top repeat-y;
		background-size: contain;
		width: 1369px;
		margin: 80px auto;
		position: relative;
	}

	#pickup .pickup_body:before,
	#pickup .pickup_body:after {
		content: "";
		display: block;
		left: 0;
		width: 100%;
		position: absolute;
		height: 200px;
	}

	#pickup .pickup_body:before {
		background: url(../pickup/pickup_bg01t_pc.png) center top no-repeat;
		background-size: 100%;
		top: -30px;
		z-index: 0;
	}

	#pickup .pickup_body:after {
		background: url(../pickup/pickup_bg01b_pc.png) center bottom no-repeat;
		background-size: 100%;
		bottom: -30px;
		z-index: 0;
	}

	#pickup .pickup_body picture.pickup_txt {
		max-width: 1280px;
		box-sizing: border-box;
	}

	#pickup .pickup_body .pickup_sec01 {
		max-width: 1280px;
		padding: 50px 50px 0;
		margin: 0 auto;
		box-sizing: border-box;
	}

	#pickup .pickup_body .pickup_sec01 h2 {
		margin: 0 auto;
		width: 30%;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list01,
	#pickup .pickup_body div.pickup_sec01 .pickup_list02 {
		max-width: 1000px;
		margin: 50px auto;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list01 {
		padding-bottom: 30px;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list02 {
		margin: 50px auto 20px;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list01 h3 {
		position: absolute;
		top: -20px;
		left: 30px;
		width: 25%;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list01 p {
		padding-top: 20px;
		margin: 0 auto 15px;
		width: 30%;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list01 ul {
		display: flex;
		flex-wrap: wrap;
		max-width: 945px;
		margin: 15px auto 0;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list01 ul li {
		margin: 5px;
		width: calc( 100% / 3 - 10px );
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list02 {
		position: relative;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list02 h3 {
		position: absolute;
		top: -20px;
		left: 30px;
		width: 25%;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list02 div.split {
		display: flex;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list02 div.split div:nth-child(1) {
		background: #f3f2ef;
		padding: 30px 0;
		border-radius: 20px;
		width: 64.35%;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list02 div.split div:nth-child(1) p {
		width: 48%;
		margin: 0 auto 10px;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list02 div.split div:nth-child(1) ul {
		display: flex;
		flex-wrap: wrap;
		margin: 0 auto;
		max-width: 580px;
		width: 100%;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list02 div.split div:nth-child(1) ul li {
		width: calc( 50% - 10px );
		margin: 5px;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list02 div.split div:nth-child(2) {
		background: #f3f2ef;
		padding: 30px 0 0;
		border-radius: 20px;
		width: 35.65%;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list02 div.split div:nth-child(2) p {
		margin: 0 auto 15px;
		width: 270px;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list02 div.split div:nth-child(2) ul {
		width: 300px;
		margin: 10px auto;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list02 div.split div:nth-child(2) ul li {
		margin: 10px 5px;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list01 ul li a img,
	#pickup .pickup_body div.pickup_sec01 .pickup_list02 div.split div:nth-child(1) ul li a img,
	#pickup .pickup_body div.pickup_sec01 .pickup_list02 div.split div:nth-child(2) ul li a img {
		transition: .3s;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list01 ul li a:hover img,
	#pickup .pickup_body div.pickup_sec01 .pickup_list02 div.split div:nth-child(1) ul li a:hover img,
	#pickup .pickup_body div.pickup_sec01 .pickup_list02 div.split div:nth-child(2) ul li a:hover img {
		opacity: 0.5;
	}

	#pickup .pickup_body div.pickup_sec02 {
		background: url(../pickup/pickup_img03_pc.png) bottom center no-repeat;
		background-size: 100%;
		position: relative;
		overflow: hidden;
		z-index: 1;
		margin: 0 auto 50px;
		max-width: 1200px;
		box-sizing: border-box;
	}

	#pickup .pickup_body div.pickup_sec02 h3 {
		width: 50%;
		margin: 50px auto;
	}

	#pickup .pickup_body div.pickup_sec02 p.pickup_btn01 {
		background: url(../pickup/pickup_btn01_o.png) no-repeat;
		background-size: contain;
		width: 30%;
		margin: 50px auto;
	}

	#pickup .pickup_body div.pickup_sec02 p.pickup_btn01 a img {
		transition: .3s;
	}

	#pickup .pickup_body div.pickup_sec02 p.pickup_btn01 a:hover img {
		opacity: 0;
	}

	#pickup .pickup_body .loading,
	#pickup_detail .pickup_body .loading {
		background-size: 50%;
	}

	#pickup .result,
	#pickup_detail .result {
		position: relative;
		max-width: 86%;
		margin: 0 auto;
	}

	#pickup .result div.elm,
	#pickup_detail .result div.elm {
		width: 25%;
		margin: 0 0 30px;
	}

	#pickup .result div.elm a,
	#pickup_detail .result div.elm a {
		display: block;
		margin: 0 auto;
		width: 222px;
		transition: .3s;
	}

	#pickup .result div.elm a:hover,
	#pickup_detail .result div.elm a:hover {
		opacity: 0.5;
	}

	#pickup .result div.elm a .img_outer,
	#pickup_detail .result div.elm a .img_outer {
		width: 100%;
		height: 130px;
		border: 1px solid #999;
		background: #fff;
		position: relative;
		overflow: hidden;
	}

	#pickup .result div.elm a .img_outer img,
	#pickup_detail .result div.elm a .img_outer img {
		transition: .3s;
	}

	#pickup .result div.elm a:hover .img_outer img,
	#pickup_detail .result div.elm a:hover .img_outer img {
		max-width: 135%;
		max-height: 135%;
	}

	#pickup .pickup_body .pickup_sec01 {
		position: relative;
	}

	#pickup .pickup_body .pickup_sec01 .sec01_bln01 {
		position: absolute;
		right: 7%;
		top: 6%;
		width: 14%;
		max-width: 180px;
		z-index: 1;
	}

}

@media screen and (max-width: 768px) {

	#pickup .pickup_body .pickup_sec01 {
		position: relative;
	}

	#pickup .pickup_body .pickup_sec01 .sec01_bln01 {
		position: absolute;
		right: 1em;
		top: 5.5em;
		width: 20%;
		z-index: 1;
	}

	#pickup .pickup_header img {
		display: block;
		margin: 0 auto;
		width: 90%;
		padding: 8vw 0;
	}

	#pickup .pickup_body {
		background: url(../pickup/pickup_bg01_sp.png) center top repeat-y;
		background-size: 100%;
		margin: 3em 1em;
		position: relative;
	}

	#pickup .pickup_body:before,
	#pickup .pickup_body:after {
		content: "";
		display: block;
		left: 0;
		width: 100%;
		position: absolute;
		height: 3em;
	}

	#pickup .pickup_body:before {
		background: url(../pickup/pickup_bg01t_sp.png) center top no-repeat;
		background-size: 100%;
		top: -1.5em;
		z-index: 0;
	}

	#pickup .pickup_body:after {
		background: url(../pickup/pickup_bg01b_sp.png) center bottom no-repeat;
		background-size: 100%;
		bottom: -1.5em;
		z-index: 0;
	}

	#pickup .pickup_body picture.pickup_txt {
		max-width: 100%;
		padding: 1.5em 1.5em 0;
		box-sizing: border-box;
	}

	#pickup .pickup_body .pickup_sec01 {
		max-width: 100%;
		padding: 3em 1.5em 0;
		margin: 0 auto;
		box-sizing: border-box;
	}

	#pickup .pickup_body .pickup_sec01 h2 {
		margin: 0 auto;
		width: 80%;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list01,
	#pickup .pickup_body div.pickup_sec01 .pickup_list02 {
		max-width: 1000px;
		margin: 3em auto 1.5em;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list01 {
		padding-bottom: 0.5em;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list02 {
		margin: 3em auto 1em;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list01 h3 {
		position: absolute;
		top: -1em;
		left: 1em;
		width: 60%;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list01 p {
		padding-top: 1.5em;
		margin: 0 auto 1em;
		width: 80%;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list01 ul {
		margin: 1em auto 0;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list01 ul li {
		margin: 0.5em 1.5em;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list02 {
		position: relative;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list02 h3 {
		position: absolute;
		top: -1em;
		left: 1em;
		width: 60%;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list02 div.split div:nth-child(1) {
		background: #f3f2ef;
		padding: 2em 0 1em;
		border-radius: 1em;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list02 div.split div:nth-child(1) p {
		width: 75%;
		margin: 0 auto 1em;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list02 div.split div:nth-child(1) ul {
		margin: 0 auto;
		width: 100%;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list02 div.split div:nth-child(1) ul li,
	#pickup .pickup_body div.pickup_sec01 .pickup_list02 div.split div:nth-child(2) ul li {
		margin: 0.5em 1.5em;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list02 div.split div:nth-child(2) {
		background: #f3f2ef;
		padding: 1em 0 0.5em;
		border-radius: 1em;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list02 div.split div:nth-child(2) p {
		margin: 0 auto 0.5em;
		width: 270px;
	}

	#pickup .pickup_body div.pickup_sec01 .pickup_list02 div.split div:nth-child(2) ul {
		width: 100%;
		margin: 1em auto;
	}

	#pickup .pickup_body div.pickup_sec02 {
		position: relative;
		overflow: hidden;
		z-index: 1;
		margin: 0 auto 2em;
		padding: 1em 0 0;
		box-sizing: border-box;
	}

	#pickup .pickup_body div.pickup_sec02 h3 {
		width: 90%;
		margin: 0 auto 1.5em;
	}

	#pickup .pickup_body div.pickup_sec02 p.pickup_btn01 {
		width: 60%;
		margin: 0.5em auto;
	}

	#pickup .pickup_body .loading {
		background-size: 50%;
	}

	#pickup .result,
	#pickup_detail .result {
		position: relative;
		max-width: 86%;
		margin: 0 auto;
	}

	#pickup .result div.elm,
	#pickup_detail .result div.elm {
		width: 50%;
		margin: 0 0 1.5em;
	}

	#pickup .result div.elm a,
	#pickup_detail .result div.elm a {
		display: block;
		margin: 0 auto;
		width: 95%;
	}

	#pickup .result div.elm a .img_outer,
	#pickup_detail .result div.elm a .img_outer {
		width: 100%;
		height: 100px;
		border: 1px solid #999;
		background: #fff;
		position: relative;
		overflow: hidden;
	}

	#pickup .sec02_bln01 {
		width: 90%;
		margin: 0 auto;
	}

}

/* 
pickup detail
///////////////////////////////////////////////////////////////// */

#pickup_detail .pickup_title {
	font-size: 2.25rem;
	letter-spacing: 0.08em;
	font-weight: 700;
	text-align: center;
	color: #694e2e;
}

#pickup_detail .pickup_read {
	font-size: 1.3125rem;
	letter-spacing: 0.08em;
	margin-top: 20px;
	text-align: center;
	font-weight: 500;
}

#pickup_detail .detail_wrap {
	position: relative;
	z-index: 1;
}

@media screen and (min-width: 768px) {

	#pickup_detail .pickup_body {
		background: url(../pickup/pickup_bg01_pc.png) center top repeat-y;
		background-size: 100%;
		width: 1369px;
		margin: 80px auto;
		position: relative;
	}

	#pickup_detail .pickup_body:before,
	#pickup_detail .pickup_body:after {
		content: "";
		display: block;
		left: 0;
		width: 100%;
		position: absolute;
		height: 200px;
	}

	#pickup_detail .pickup_body:before {
		background: url(../pickup/pickup_bg01t_pc.png) center top no-repeat;
		background-size: 100%;
		top: -30px;
		z-index: 0;
	}

	#pickup_detail .pickup_body:after {
		background: url(../pickup/pickup_bg01b_pc.png) center bottom no-repeat;
		background-size: 100%;
		bottom: -30px;
		z-index: 0;
	}

	#pickup_detail p.pickup_btn02 {
		background: url(../pickup/pickup_btn02_o.png) no-repeat;
		background-size: contain;
		width: 30%;
		margin: 50px auto;
	}

	#pickup_detail p.pickup_btn02 a img {
		transition: .3s;
	}

	#pickup_detail p.pickup_btn02 a:hover img {
		opacity: 0;
	}

	#pickup_detail .detail_wrap {
		background: url(../pickup/pickup_img03_pc.png) bottom center no-repeat;
		background-size: 100%;
		position: relative;
		overflow: hidden;
		z-index: 1;
		margin: 0 auto 50px;
		padding: 20px 0 0;
		max-width: 1200px;
		box-sizing: border-box;
	}

	#pickup_detail .result {
		margin-top: 2rem;
	}

}

@media screen and (max-width: 768px) {


	#pickup_detail .pickup_title {
		font-size: 2rem;
	}

	#pickup_detail .pickup_read {
		font-size: 1rem;
	}

	#pickup_detail .pickup_body {
		background: url(../pickup/pickup_bg01_sp.png) center top repeat-y;
		background-size: 100%;
		margin: 3em 1em;
		position: relative;
	}

	#pickup_detail .pickup_body:before,
	#pickup_detail .pickup_body:after {
		content: "";
		display: block;
		left: 0;
		width: 100%;
		position: absolute;
		height: 3em;
	}

	#pickup_detail .pickup_body:before {
		background: url(../pickup/pickup_bg01t_sp.png) center top no-repeat;
		background-size: 100%;
		top: -1.5em;
		z-index: 0;
	}

	#pickup_detail .pickup_body:after {
		background: url(../pickup/pickup_bg01b_sp.png) center bottom no-repeat;
		background-size: 100%;
		bottom: -1.5em;
		z-index: 0;
	}

	#pickup_detail .pickup_body .loading {
		background-size: 60%;
	}

	#pickup_detail p.pickup_btn02 {
		width: 80%;
		margin: 0.5em auto 2rem;
	}

	#pickup_detail .sec02_bln01 {
		width: 90%;
		margin: 0 auto;
	}

	#pickup_detail .result {
		margin-top: 2rem;
	}

}

.loading p.no_pick {
	background: #fff;
	display: block;
	height: 100%;
	position: relative;
	min-height: 400px;
	width: 90%;
	margin: 0 auto;
}

.loading p.no_pick img {
	position: absolute;
	width: 40%;
	left: 50%;
	top: 50%;
	transform: translate( -50%, -50% );
}

