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

/* =========================================
listpickup CSS
=========================================== */
#listpickup h1,#listpickup h2{ line-height:1.4; margin:0; padding:0;}
#listpickup p{margin:0;}
#listpickup a{text-decoration:none;}
#listpickup img{max-width:100%; height:auto; vertical-align:bottom;}
#listpickup *{box-sizing:border-box;}
#listpickup a.touch{text-decoration:underline;}
#listpickup a img{backface-visibility: hidden; display:block;}/*hover時画像のズレ防止*/
#listpickup a.touch img{opacity:0.7; transition:opacity 0.2s ease;}

#listpickup{
	font-size:14px;
	line-height:1.6;
}

#listpickup .h1_wrap{
	position:relative;
	margin-left:-15px;
	margin-right:-15px;
}
#listpickup .h1_wrap h1{
	font-size:28px;
	padding:1.4rem 2%;
	border-top:2px solid #e0e0e0;
	border-bottom:2px solid #e0e0e0;
}
#listpickup .h1_wrap h1 br.sp{
	display:none;
}
#listpickup .h1_listpickup{background:#ffffff;}
#listpickup .h1_hair{background:#e9f6f8;}
#listpickup .h1_esthe{background:#fdf3f0;}
#listpickup .h1_massage{background:#f1fbf0;}
#listpickup .h1_nail{background:#f8f1fb;}
#listpickup .h1_eyelash{background:#fcf0f6;}

#listpickup .h1_wrap .btn_wrap{
	position:absolute;
	right:2%;
	top:50%;
	margin-top:-18px;
}
#listpickup .listpickup_txt{
	margin:30px 0;
}
@media screen and (max-width: 1023px) {
	#listpickup .h1_wrap{
    margin-left: -15px;
    margin-right: -15px;
  }
  #listpickup .h1_wrap h1{
    font-size: 18px;
  }
}
@media screen and (max-width: 767px) {
	#listpickup .h1_wrap{
    margin-left: -5px;
    margin-right: -5px;
	}
	#listpickup .h1_wrap h1{
		font-size:16px;
	}
	#listpickup .h1_wrap h1 span{
		font-size:12px;
	}
	#listpickup .h1_wrap .btn_wrap{
		margin-top:-14px;
	}
	#listpickup .listpickup_txt{
		margin:20px 0;
	}
	.container{
		padding-left: 10px;
		padding-right: 10px;
	}
}
@media screen and (max-width:430px) {
	#listpickup .h1_wrap h1 br.sp{
		display:block;
	}
}

/*-------- カテゴリ選択ドロップダウン --------*/
#listpickup .dropdown-toggle {
  background-color: #f9f9f9;
  min-width: 100px;
  padding: 10px 30px 10px 10px;
  line-height:1;
  border: 1px solid #e0e0e0;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  appearance: none;
  margin: 0;
  font-weight: normal;
  text-align: left;
  position: relative;
  overflow: hidden;
}
#listpickup .dropdown-toggle .fa-caret-down {
  color: #666;
  position: absolute;
  right: 7px;
  top: 12px;
}
#listpickup .dropdown-menu {
  position: absolute;
  top: -1px;
  left: -70px;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  opacity: 0.95;
  min-width:200px;
  margin: 0;
  padding: 0;
  border: 0;
  -webkit-box-shadow: 0px 0px 10px 1px rgba(6, 0, 1, 0.3);
  -moz-box-shadow: 0px 0px 10px 1px rgba(6, 0, 1, 0.3);
  box-shadow: 0px 0px 10px 1px rgba(6, 0, 1, 0.3);
  color: #333333;
}
@media screen and (min-width: 1024px) {
  #listpickup .dropdown-menu {
    max-height: 255px;
  }
}
@media screen and (max-width: 767px) {
	#listpickup .dropdown-toggle {
		width:80px;
		overflow:hidden;
		padding: 5px 20px 5px 5px;
		line-height:1.5;
	}
	#listpickup .dropdown-toggle span{
		font-size:12px;
	}
	#listpickup .dropdown-toggle .fa-caret-down {
		top: 10px;
	}
  #listpickup .dropdown-menu {
    max-height:255px;
		min-width:170px;
  }
}
#listpickup .dropdown-menu > li{
	line-height/**/:0;
}
#listpickup .dropdown-menu > li:first-child > a {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}
#listpickup .dropdown-menu > li:last-child > a {
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}
#listpickup .dropdown-menu > li > a {
  padding: 1rem 25px 1rem 15px;
  position: relative;
  white-space: normal;
}
#listpickup .dropdown-menu > li > a:hover,
#listpickup .dropdown-menu > li > a.active {
  background-color: #d6e5ee;
  color: #4c97be;
	text-decoration:none;
}
#listpickup .dropdown-menu > li > a.active:after {
  content: "\f00c";
  position: absolute;
  color: #4c97be;
  right: 10px;
  top: 1rem;
  font-family: FontAwesome;
}

/*------------- カテゴリ選択ページ.start -------------*/
#listpickup #categoryWrap{
	overflow:hidden;
}
#listpickup #categoryWrap ul{
	margin-bottom:40px;
	float:left;
}
#listpickup #categoryWrap ul:hover,
#listpickup #categoryWrap ul:focus{
	cursor:pointer;
}
#listpickup #categoryWrap ul:nth-child(odd){
	margin-right:30px;
}
#listpickup #categoryWrap ul li{
	width:570px;
}
#listpickup #categoryWrap ul .h2_wrap{
	position:relative;
	overflow:hidden;
}
#listpickup #categoryWrap ul .h2_wrap h2{
	width:290px;
	position:absolute;
	left:40px;
	top:0;
}
#listpickup #categoryWrap ul .h2_wrap h2 img{
	position:absolute;
	left:0;
	top:50%;
	-webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
	border-top:1px solid #888888;
	border-bottom:1px solid #888888;
}
#listpickup #categoryWrap ul .h2_wrap .h2_hair img{
	border-top:1px solid #ffffff;
	border-bottom:1px solid #ffffff;
}
#listpickup #categoryWrap ul .h2_wrap figure img{
	border-radius:8px 8px 0 0;
	-webkit-border-radius:8px 8px 0 0;
}
#listpickup #categoryWrap ul .box_figure{
	overflow:hidden;
}
#listpickup #categoryWrap ul .box_figure figure{
	float:left;
	border-right:1px solid #e0e0e0;
	border-top:1px solid #e0e0e0;
}
#listpickup #categoryWrap ul .box_figure figure:first-child{
	border-left:1px solid #e0e0e0;
}
#listpickup #categoryWrap ul p{
	padding:15px;
	text-align:center;
	border:1px solid #e0e0e0;
	border-radius:0 0 8px 8px;
	-webkit-border-radius:0 0 8px 8px;
	background:#f9f9f9;
}
#listpickup #categoryWrap ul p a{
  height: 60px;
  width: 100%;
  font-size: 1.6rem;
  padding: 6px;
  border-width: 1px;
  border-radius: 5px;
  line-height: 47px;
  color: #ffffff;
  background-color: #70accb;
  border-color: #70accb;
}
.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active,
.btn-secondary.active,
.open .dropdown-toggle.btn-secondary {
  color: #666666;
  background-color: #ffffff;
  border-color: #70accb;
  -webkit-box-shadow: none;
  box-shadow: none;
}

#listpickup #categoryWrap ul p a span:nth-child(2),
#listpickup #categoryWrap ul p a .fa-chevron-right{
	margin-left:1rem;
}
@media screen and (max-width:1199px){
	#listpickup #categoryWrap ul{
		width:48%;
		margin-bottom:40px;
		float:left;
	}
	#listpickup #categoryWrap ul:nth-child(odd){
		margin-right:4%;
	}
	#listpickup #categoryWrap ul li{
		width:100%;
		position:relative;
	}
	#listpickup #categoryWrap ul .h2_wrap h2{
		width:50%;
		left:7%;
	}
	#listpickup #categoryWrap ul .box_figure figure{
		width:33.33333%;
	}
	#listpickup #categoryWrap ul p a{
    height: 40px;
    padding: 4px 4px;
    line-height: 31px;
  }
}
@media screen and (max-width: 767px) {
	#listpickup #categoryWrap{
		padding-bottom:40px;
	}
	#listpickup #categoryWrap ul{
		width:100%;
		margin-bottom:0;
		float:none;
		background:#f9f9f9;
		border-top:1px solid #cccccc;
	}	
	#listpickup #categoryWrap ul:nth-child(odd){
		margin-right:0;
	}
	#listpickup #categoryWrap ul:last-child{
		border-bottom:1px solid #cccccc;
	}
	#listpickup #categoryWrap ul li{
		overflow:hidden;
	}
	#listpickup #categoryWrap ul .h2_wrap{
		width:70.5%;
		float:left;
		margin:5% 0 0 3%;
	}
	#listpickup #categoryWrap ul .h2_wrap h2{
		width:56%;
		left:7%;
	}
	#listpickup #categoryWrap ul .h2_wrap figure img{
		border-radius:0;
		-webkit-border-radius:0;
	}
	#listpickup #categoryWrap ul .box_figure{
		width:23.5%;
		float:left;
		margin:5% 3% 0 0;
	}
	#listpickup #categoryWrap ul .box_figure figure{
		float:none;
		width:auto;
		border-right:none;
		border-top:none;
	}
	#listpickup #categoryWrap ul .box_figure figure:first-child{
		border-left:none;
	}
	#listpickup #categoryWrap ul .box_figure figure:nth-child(2){
		border-top:1px solid #e0e0e0;
	}
	#listpickup #categoryWrap ul .box_figure figure:nth-child(3){
		display:none;
	}
	#listpickup #categoryWrap ul p{
		padding:3% 3% 5%;
		border:none;
		border-radius:0;
		-webkit-border-radius:0;
		clear:both;
	}
}

/*------------- 各業種ページ.start -------------*/

#listpickup .box_pickup,
#listpickup .box_campaign{margin:30px 0 40px;}
#listpickup h2{
	font-size:20px;
	padding-bottom:10px;
	border-bottom:2px solid #eeeeee;
}
#listpickup .box_pickup ul{
	width:calc(100% + 16px);
	display:flex;
	flex-wrap:wrap;
	margin: 0 -8px;
}
#listpickup .box_pickup ul li{
	width:calc(20% - 16px);
	margin:36px 8px 0;
	display:block;
	background:#F9F9F9;
	border:1px solid #E0E0E0;
}
#listpickup .box_pickup ul li a{
	display:block;
	position:relative;
}
#listpickup .box_pickup ul li a .txtBox{
	padding:8px;
	border-top:none;
	background:#F9F9F9;
	font-family:"游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, "Open Sans", Helvetica, Arial, -apple-system, blinkMacSystemFont, sans-serif;
	margin:0;
	color:#1F1F1F;
}
#listpickup .box_campaign ul li{
	display:flex;
	margin-top:15px;
}
#listpickup .box_campaign ul li time,
#listpickup .box_campaign ul li a{
	font-size:15px;
	font-family:"游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, "Open Sans", Helvetica, Arial, -apple-system, blinkMacSystemFont, sans-serif;
}
#listpickup .box_campaign ul li time{
	display:block;
	padding-right:20px;
	position:relative;
	color:#999;
}
#listpickup .box_campaign ul li time:after{
	content:"|";
	position:absolute;
	right:8px;
	top:0;
}
#listpickup .box_campaign ul li a{color:#1F1F1F;}


@media screen and (max-width:1199px){
	#listpickup .box_pickup ul li{width:calc(25% - 16px);}
}
@media screen and (max-width:899px){
	#listpickup .box_pickup ul li{width:calc(33.333333333% - 16px);}
}
@media screen and (max-width: 767px) {
	#listpickup h2{font-size:16px;}
	#listpickup .box_campaign ul li time,#listpickup .box_campaign ul li a{font-size:13px;}
}
@media screen and (max-width: 600px) {
	#listpickup .box_pickup ul li{width:calc(50% - 16px);}
	#listpickup .box_pickup ul li a .txtBox{font-size:12px;}
}

/*------------- newIconWrap -------------*/

#listpickup .newIconWrap .newIcon{
	position:absolute;
	left:0;
	top:-24px;
	line-height:1;
}
#listpickup .newIconWrap .newIcon span{
	font-size:12px;
  line-height:1;
	padding:2px 10px;
	color:#FFF;
	font-weight:bold;
	text-align:center;
	background:#d83980;
  border: 1px solid #d83980;
  border-radius: 5px;
  -webkit-border-radius: 5px;
}
#listpickup .newIconWrap .newIcon i{
	display:block;
	width:0;
	height:0;
	border:5px solid transparent;
	border-top:10px solid #d83980;
	margin:0 auto;
}
@media screen and (max-width:600px){
	#listpickup .box_pickup ul li{margin-top:28px;}
	#listpickup .newIconWrap .newIcon span{
		font-size:10px;
		padding:2px 7px;
	}
	#listpickup .newIconWrap .newIcon i{border-top:7px solid #ff3c6c;}
	#listpickup .newIconWrap .newIcon{top:-22px;}
}