@charset "UTF-8";

/*
	vw基準値
	pc：1400px
	sp：375px
*/

main img{
	width: 100%;
}

main{
	color: #333;
}

/* ############################### accBlock */

main .accBlock .accBase{
	position: relative;
}

main .accBlock .accBody{
  transition: grid-template-rows 0.5s ease;
  display: grid;
  grid-template-rows: 0fr;
	position: absolute;
	top: 0;
	left: 0;
}

main .accBlock .accBody .accWrap{
  overflow: hidden;
  transition: opacity 0.5s ease;
	opacity: 0;
	/* z-index: -1; */
}

main .accBlock .accBody .areaWrap{
  border: 2px solid #8B585E;
  border-radius: var(--20px);
  padding: var(--30px) var(--30px) var(--40px);
  box-shadow: #8A595F var(--5px) var(--5px) 0 0;
  margin: 0 var(--5px) var(--5px);
  position: relative;
	background: #fff;
}

main .accBlock .accBody .arw{
  position: absolute;
  top: -21px;

	opacity: 0;
	z-index: 11;
}

main .accBlock .accBody .bttn{
  text-align: center;
}

main .accBlock .accBody .btnClose{
  display: inline-block;
  position: relative;
  font-size: var(--16px);
  font-weight: bold;
  margin-top: var(--50px);
  padding-left: var(--35px);
  cursor: pointer;
}

main .accBlock .accBody .btnClose:before{
	content: '';
	position: absolute;
	display: block;
	background: url(../img/summary/search_close.svg) no-repeat center;
	top: 50%;
	margin-top: max(-0.86vw,-12px);
	left: 0;
	width: var(--24px);
	height: var(--24px);
	background-size: contain !important;
}

	@media screen and (max-width:768px){

	main .accBlock .accBody .accWrap{
		left: -1vw;
	}

	main .accBlock .accBody{
	  border-radius: 5.33vw;
	}

	main .accBlock .accBody .areaWrap{
	  border: 2px solid #8B585E;
	  border-radius: 5.33vw;
	  padding: 10.67vw 5.33vw 10.67vw;
	  box-shadow: #8A595F 0 0.8vw 0 0;
	  margin: 0 0.8vw 1vw;
		width: 89.33vw;
	}

	main .accBlock .accBody .btnClose{
	  font-size: 4.27vw;
	  margin-top: 8vw;
	  padding-left: 8vw;
	}

	main .accBlock .accBody .btnClose:before{
		margin-top: -3.3vw;
		width: 6.4vw;
		height: 6.4vw;
	}

	}/* --- max-width:768px */


/* ############################### ttlSubMain */

.ttlThisMain{
	text-align: center;
}

.ttlThisMain span{
	display: inline-block;
	font-family : YuMincho,'Yu Mincho',serif;
  /* font-family: 'Noto Serif JP', serif; */
	color: #8B585E;
	font-size: var(--40px);
	font-weight: bold;
	position: relative;
	letter-spacing: 2px;
	line-height: 1.5;
}

.ttlSubMain {
	text-align: center;
}

.ttlSubMain span{
	display: inline-block;
	font-family : YuMincho,'Yu Mincho',serif;
  /* font-family: 'Noto Serif JP', serif; */
	color: #8B585E;
	font-size: var(--30px);
	font-weight: bold;
	position: relative;
	/* padding-bottom: var(--20px); */
	letter-spacing: 2px;
	line-height: 1.5;
}

.ttlSubMain span:before{
	display: none;
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	margin-left: max(-2.86vw,-40px);
	width: min(5.71vw,80px);
	height: 1px;
	border-bottom: 2px solid #8B585E;
}

	@media screen and (max-width:768px){

	.ttlThisMain span{
		font-size: 6.2vw;
	}

	.ttlSubMain span{
		font-size: 5.2vw;
		/* padding-bottom: 3.2vw; */
	}

	.ttlSubMain span:before{
		left: 50%;
		margin-left: -10.65vw;
		width: 21.33vw;
		border-bottom: 2px solid #8B585E;
	}

	}/* --- max-width:768px */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ mvSection */

.mvSection{
	position: relative;
	width: min(100%,1400px);
	margin: auto;
}

.mvSection .img{
  width: min(92.86vw,1300px);
  margin: 0 0 0 auto;
}

.mvSection .ttlLogo{
	position: absolute;
	background: rgba(102,53,59,0.7);
	width: min(43.21vw,605px);
	text-align: right;
	top: min(16.64vw,233px);
	left: 0;
	padding: min(5vw,70px);
	border-radius: 0 min(5.71vw,80px) 0 0;
}

.mvSection .ttlLogo span{
	display: inline-block;
	width: min(27.86vw,390px);
}

	@media screen and (max-width:768px){

  .mvSection{
  	width: 100%;
  }

  .mvSection .img{
  	width: 100%;
  }

  .mvSection .ttlLogo{
  	width: 78.4vw;
  	text-align: left;
  	top: 54.13vw;
  	padding: 10.67vw 8vw;
  	border-radius: 0 12.27vw 0 0;
  }

  .mvSection .ttlLogo span{
  	display: inline-block;
  	width: 63.2vw;
  }

	}/* --- max-width:768px */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ topSection */

.topSection{
  padding: min(4.29vw,60px) 0 min(5.71vw,80px);
}

.topSection .txt{
  margin-top: var(--30px);
  font-size: var(--18px);
  text-align: center;
  line-height: 2.1;
}

	@media screen and (max-width:768px){

  .topSection{
    padding: 10.67vw 0;
  }

  .topSection .txt{
    margin-top: 7.2vw;
    font-size: 4vw;
    text-align: left;
		line-height: 1.7;
  }

	}/* --- max-width:768px */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ searchSection */

.searchSection{
  position: relative;
  padding: var(--30px) 0 var(--50px);
}

.searchSection > .secInner{
	padding: 0 min(6.43vw,90px);
}

.searchSection:before{
	content: '';
	position: absolute;
	display: block;
	background: #EDEDED;
	top: 0;
	left: 0;
	width: 100%;
	height: min(19.29vw,270px);
	background-size: contain !important;
  z-index: -1;
}

.searchSection .searchBox{
  display: table;
  margin: var(--35px) auto 40px;
}

.searchSection .searchBox > li{
  display: table-cell;
}
.searchSection .searchBox > li:first-child{padding-right: var(--40px);}
.searchSection .searchBox > li:last-child{padding-left: var(--40px);}

.searchSection .searchBox > li a{
  display: table;
  width: min(30.36vw,425px);
  padding: var(--35px);
  background: #fff;
  border-radius: var(--10px);
  box-shadow: #8A595F var(--5px) var(--5px) 0 0;
  cursor: pointer;
}

.searchSection .searchBox > li .img{
	display: table-cell;
	vertical-align: middle;
}
.searchSection .searchBox > li .img img{display: inline-block;}
.searchSection .searchBox > li.category .img img{width: min(3.71vw,52px);}
.searchSection .searchBox > li.keyword .img img{width: min(5.07vw,71px);}

.searchSection .searchBox > li .txt{
  display: table-cell;
	vertical-align: middle;
	text-align: right;
}

.searchSection .searchBox > li .txt > span{
  display: inline-block;
  font-size: var(--24px);
  font-weight: bold;
  position: relative;
  padding-right: var(--45px);
}

.searchSection .searchBox > li .txt > span:before{
	content: '';
	position: absolute;
	display: block;
	background: url(../img/summary/search_arw.svg) no-repeat center;
	top: 50%;
	margin-top: max(-0.86vw,-12px);
	right: 0;
	width: var(--24px);
	height: var(--24px);
	background-size: contain !important;
}

.searchSection .commonSmallTagArea a{
	font-size: var(--13px);
}

.searchSection.is_opened.category .searchBox .category a span{opacity: 0.5;}
.searchSection.is_opened.keyword .searchBox .keyword a span{opacity: 0.5;}
.searchSection.is_opened.category .searchBox .category .txt > span:before{rotate: 180deg;}
.searchSection.is_opened.keyword .searchBox .keyword .txt > span:before{rotate: 180deg;}

	@media screen and (max-width:768px){

	.searchSection{
	  padding: 10.67vw 0 0;
	}

	.searchSection > .secInner{
		padding: 0 5.33vw;
	}

	.searchSection:before{
		height: 58.67vw;
	}

	.searchSection .searchBox{
		display: block;
		width: 100%;
	  margin: 9.33vw auto 45px;
	}

	.searchSection .searchBox > li{width: 100%;display: block;}
	.searchSection .searchBox > li:first-child{padding-right: 0;}
	.searchSection .searchBox > li:last-child{padding-left: 0;}

	.searchSection .searchBox > li a{
	  width: 72vw;
	  padding: 4vw 6.4vw;
	  border-radius: 2.67vw;
	  box-shadow: #8A595F 0.8vw 0.8vw 0 0;
		margin: 4.8vw auto 0;
	}

	.searchSection .searchBox > li .img{

	}
	.searchSection .searchBox > li.category .img img{width: 8vw;}
	.searchSection .searchBox > li.keyword .img img{width: 10.4vw;}

	.searchSection .searchBox > li .txt{
	  margin-top: 4vw;
	}

	.searchSection .searchBox > li .txt > span{
	  font-size: 4.27vw;
	  padding-right: 8vw;
	}

	.searchSection .searchBox > li .txt > span:before{
		margin-top: -3vw;
		width: 5.07vw;
		height: 5.07vw;
	}

	.searchSection .commonSmallTagArea a{
		font-size: 3.47vw;
	}

	}/* --- max-width:768px */

/* ############################### accBody */

.searchSection .category .arw{left: 31%;margin-left: -30px;}
.searchSection .keyword .arw{right: 28%;margin-right: -30px;}

	@media screen and (max-width:768px){

	.searchSection .category .arw{left: 50%;margin-left: -30px;}
	.searchSection .keyword .arw{right: 50%;margin-right: -30px;}

	}/* --- max-width:768px */

/* ===================== category */

.searchSection .accBody .categoryList{
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	flex: auto;
  gap: var(--40px) 0;
}

.searchSection .accBody .categoryList > li{
  width: 25%;
}

.searchSection .accBody .categoryList > li a{
  display: table;
}

.searchSection .accBody .categoryList > li a .img{
  display: table-cell;
  vertical-align: middle;
  width: min(10.71vw,150px);
}

.searchSection .accBody .categoryList > li a .txt{
  display: table-cell;
  vertical-align: middle;
	font-size: var(--12px);
  font-weight: bold;
  padding: 0 var(--10px);
	line-height: 1.5;
}

	@media screen and (max-width:768px){

	.searchSection .accBody .categoryList{
	  gap: 6.4vw auto;
	align-items: flex-start;
	}

	.searchSection .accBody .categoryList > li{
	  width: 36vw;
	}

	.searchSection .accBody .categoryList > li a{
	  display: block;
	}

	.searchSection .accBody .categoryList > li a .img{
	  display: block;
	  width: 100%;
	}

	.searchSection .accBody .categoryList > li a .txt{
	  display: block;
	  width: 100%;
	  padding: 2.67vw 0 0;
		font-size: 3.2vw;
	}

	}/* --- max-width:768px */

/* ===================== keyword */

.searchSection .accBody.keyword .ttlBar span{
  font-size: var(--18px);
  font-weight: bold;
  padding: var(--3px) var(--10px);
  border-left: var(--8px) solid #65353B;
}

.searchSection .accBody.keyword .ttlBar.mt{
  margin-top: var(--45px);
}

.searchSection .accBody.keyword .keywordList{
  margin-top: var(--20px);
}

	@media screen and (max-width:768px){

	.searchSection .accBody.keyword .ttlBar span{
	  font-size: 4.27vw;
	  padding: 0.53vw 2.67vw;
	  border-left: 1.87vw solid #65353B;
	}

	.searchSection .accBody.keyword .ttlBar.mt{
	  margin-top: 10.67vw;
	}

	.searchSection .accBody.keyword .keywordList{
	  margin-top: 6.67vw;
	}

	}/* --- max-width:768px */

/* ############################### accBody acc */

main .searchSection .accBody{
	left: 50%;
	margin-left: max(-43.57vw,-610px);
}

.searchSection .accBody .areaWrap{display: block;	width: min(85.71vw,1200px);}
/* category */
.searchSection.is_opened.category .accBody.category{grid-template-rows: 1fr;}
.searchSection.is_opened.category .accBody.category .areaWrap{display: block;}
.searchSection.is_opened.category .accBody.keyword .areaWrap{display: none;}
.searchSection.is_opened.category .accBody.category .accWrap{z-index: 10;opacity: 1;}
.searchSection.is_opened.category .category .arw{opacity: 1;}
/* keyword */
.searchSection.is_opened.keyword .accBody.keyword{grid-template-rows: 1fr;}
.searchSection.is_opened.keyword .accBody.keyword .areaWrap{display: block;}
.searchSection.is_opened.keyword .accBody.category .areaWrap{display: none;}
.searchSection.is_opened.keyword .accBody.keyword .accWrap{z-index: 10;opacity: 1;}
.searchSection.is_opened.keyword .keyword .arw{opacity: 1;}

	@media screen and (max-width:768px){

	.searchSection.accBlock .accBody{
		left: 0;
		margin-left: 0;
	}

	.searchSection.is_opened.category .accBody.category{margin-top: -21vw;}
	.searchSection.is_opened.category .accBody.keyword{}

	.searchSection.accBlock .accBody .areaWrap{
		margin: 0 0 1vw;
	}

	}/* --- max-width:768px */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ beginnerSection */

.beginnerSection{
	padding: var(--20px) 0 min(5vw,70px);
}

.beginnerSection .ttl span{
	position: relative;
	font-size: var(--24px);
	font-weight: bold;
	padding-left: min(5.36vw,75px);
}

.beginnerSection .ttl span:before{
	content: '';
	position: absolute;
	display: block;
	top: 50%;
	margin-top: max(-2.21vw,-31px);
	left: 0;
	width: min(4.43vw,62px);
	height: min(4.43vw,62px);
	background-size: contain !important;
}
.beginnerSection .recommendBlock .ttl span:before{background: url(../img/summary/beginner_ttl1.svg) no-repeat center;}
.beginnerSection .keywordBlock .ttl span:before{background: url(../img/summary/beginner_ttl2.svg) no-repeat center;}

	@media screen and (max-width:768px){

	.beginnerSection{
		padding: 8vw 0 16vw;
	}

	.beginnerSection .ttl span{
		font-size: 4.8vw;
		padding-left: 14.67vw;
	}

	.beginnerSection .ttl span:before{
		margin-top: -6vw;
		width: 11vw;
		height: 11vw;
	}

	}/* --- max-width:768px */

/* ############################### recommendBlock */

.beginnerSection .recommendBlock{
	margin-top: min(19.47vw,73px);
}

.beginnerSection .recommendBlock .beginnerBox{
	margin-top: min(4.29vw,60px);
}

.beginnerSection .recommendBlock .beginnerBox .subTtl{
	display: block;
	padding-left: var(--8px);
	border-left: var(--8px) solid #65353B;

}

.beginnerSection .recommendBlock .beginnerBox .subTtl span{
	display: flex;
	align-items: center;
	font-size: var(--16px);
	height: var(--28px);
	font-weight: bold;
}

.beginnerSection .recommendBlock .beginnerBox .subTtl.fsmall span{
	font-size: var(--15px);
}

.beginnerSection .recommendBlock .beginnerBox .areaWrap{
	margin-top: var(--20px);
	position: relative;
	display: block;
}

.beginnerSection .recommendBlock .beginnerBox .areaWrap .txtArea{
	margin-top: var(--20px);
}

.beginnerSection .recommendBlock .beginnerBox .areaWrap .txtArea .ttl{
	font-size: var(--16px);
	line-height: 1.5;
	font-weight: normal;
}

.beginnerSection .recommendBlock .beginnerBox .areaWrap .txtArea .bttn{
	display: none;
}

	@media screen and (max-width:768px){

	.beginnerSection .recommendBlock{
		margin-top: 13.63vw;
	}

	.beginnerSection .recommendBlock .beginnerBox{
		margin-top: 6vw;
	}

	.beginnerSection .recommendBlock .beginnerBox .swiper-slide{
		padding: 8vw 0;
		border-bottom: 1px solid #EDEDED;
		margin: 0;
	}

	.beginnerSection .recommendBlock .beginnerBox .subTtl{
		padding: 1px 2.67vw;
		border-left: 2.13vw solid #65353B;
	}

	.beginnerSection .recommendBlock .beginnerBox .subTtl span,
	.beginnerSection .recommendBlock .beginnerBox .subTtl.fsmall span{
		font-size: 4.27vw;
		height: auto;
	}

	.beginnerSection .recommendBlock .beginnerBox .areaWrap{
		margin-top: 8vw;
		display: flex;
		align-items: flex-start;
		justify-content: space-between;
	}

	.beginnerSection .recommendBlock .beginnerBox .areaWrap .imgArea{
		width: 38.67vw;
		max-width: 100%;
		order: 2;
	}

	.beginnerSection .recommendBlock .beginnerBox .areaWrap .txtArea{
		margin-top: 0;
		width: 60%;
		padding-right: 4vw;
		order: 1;
	}

	.beginnerSection .recommendBlock .beginnerBox .areaWrap .txtArea .ttl{
		font-size: 3.2vw;
	}

	.beginnerSection .recommendBlock .beginnerBox .areaWrap .txtArea .bttn{
		display: block;
		text-align: center;
		margin-top: 2.67vw;
	}

	.beginnerSection .recommendBlock .beginnerBox .areaWrap .txtArea .bttn .btnArwDown span{
		width: 36.27vw;
		height: 6.67vw;
		font-size: 3.2vw;
		background: #8A595F;
		border: 1px solid #8A595F;
		color: #fff;
	}

	.beginnerSection .recommendBlock .beginnerBox .areaWrap .txtArea .bttn .btnArwDown span:before{
		background: url(../img/summary/icon_down.svg) no-repeat center !important;
    width: 4px;
    height: 6px;
		margin-top: -3px;
		right: 2.13vw;
		rotate: 0deg;
	}

	.beginnerSection .recommendBlock .beginnerBox .areaWrap:before {
    width: 15.4vw;
	}

	.beginnerSection .recommendBlock .beginnerBox .commonSmallTagArea{
		display: none;
	}

	}/* --- max-width:768px */

/* ############################### keywordBlock */

.beginnerSection .keywordBlock{
	margin-top: min(5.57vw,78px);
}

.beginnerSection .keywordBlock .commonTagArea{
	justify-content: flex-start;
	margin-top: var(--45px);
}

	@media screen and (max-width:768px){

	.beginnerSection .keywordBlock{
		margin-top: 6.7vw;
	}

	.beginnerSection .keywordBlock .commonTagArea{
		margin-top: 8vw;
		gap: 5.33vw 2.67vw;
	}

	}/* --- max-width:768px */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ categorySection */

.categorySection{
	background: #EDEDED;
	padding: min(4.29vw,60px) min(2.14vw,30px) min(3.57vw,50px);
}

.categorySection .categoryBox{
	margin: min(4.29vw,60px) auto 40px;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	width: min(81.43vw,1140px);
}

.categorySection .categoryBox li{
	width: min(25vw,350px);
}

.categorySection .categoryBox .txtBox{
	display: flex;
	padding-top: var(--28px);
	justify-content: center;
	height: min(11.79vw,165px);
	background: #fff;
	text-align: center;
}

.categorySection .categoryBox .txtBox .ttl{
	display: block;
	font-weight: bold;
	font-size: var(--18px);
	line-height: 1.5;
}
.categorySection .categoryBox .txtBox .ttl em{color: #8A595F;}

.categorySection .categoryBox .txtBox .cap{
	display: block;
	font-size: var(--12px);
	margin-top: var(--13px);
}

.categorySection .categoryBox .bttn{
	text-align: center;
	margin-top: max(-1.79vw,-25px);
}

.categorySection .commonSmallTagArea a{
	font-size: var(--11px);
}

	@media screen and (max-width:768px){

	.categorySection{
		padding: 10.67vw 0 0;
	}

	.categorySection .categoryBox{
		margin-top: 10.67vw;
		margin-left: 0;
		margin-right: 0;
		display: block;
		margin-bottom: 0;
		width: 100%;
	}

	.categorySection .categoryBox li{
		width: 100%;
		margin-bottom: 0;
	}

	.categorySection .categoryBox li .accArea{
		padding-top: 40px;
	}

	.categorySection .categoryBox .txtBox{
		padding-top: 5.33vw;
		height: 38.67vw;
	}

	.categorySection .categoryBox .txtBox .ttl{
		font-size: 4.8vw;
	}

	.categorySection .categoryBox .txtBox .cap{
		font-size: 3.2vw;
		margin-top: 2.67vw;
	}

	.categorySection .categoryBox .bttn{
		margin-top: -6.66vw;
	}

	.categorySection .commonSmallTagArea a{
		font-size: 2.93vw;
	}

	}/* --- max-width:768px */

/* ############################### swiper */

.categorySection .accArea .swiper .swiper-wrapper{
	align-items: flex-start;
}

.categorySection .accArea .swiper .swiper-wrapper .swiper-slide{
	width: min(22.5vw,315px);
}

.categorySection .accArea .swiper-slide .tagex{
	background: #65353B;
}

.categorySection .accArea .swiper-slide .imgArea{
	border: 1px solid #EDEDED;
	border-bottom: none;
}

.categorySection .accArea .swiper-slide .infoBox{
	padding: var(--15px) var(--20px) var(--40px);
	height: min(15vw,210px);
	border: 1px solid #EDEDED;
	border-top: none;
}

.categorySection .accArea .swiper-slide .txtArea{
	margin-top: var(--10px);
	font-size: var(--16px);
	font-weight: bold;
	line-height: 1.5;
}

.categorySection .accArea .swiper-slide .bttn{
	margin-top: max(-1.79vw,-25px);
}

.categorySection .accArea .swiper-slide .bttn .btnArwDown span:before{
	rotate: -90deg;
}

.categorySection .accArea .bttn.toIndex{
	margin-top: var(--50px);
	text-align: center;
}

.categorySection .accArea .bttn.close{
	margin-top: var(--20px);
}

main .categorySection .accArea .btnClose{
	margin-top: 0;
}

	@media screen and (max-width:768px){

	.categorySection .accArea .swiper .swiper-wrapper{
		display: block;
	}

	.categorySection .accArea .swiper .swiper-wrapper .swiper-slide{
		width: 100%;
		margin-top: 8vw;
	}
	.categorySection .accArea .swiper .swiper-wrapper .swiper-slide:first-of-type{margin-top: 0;}

	.categorySection .accArea .swiper-slide .infoBox{
		padding: 4vw 5vw;
		height: 60vw;
	}

	.categorySection .accArea .swiper-slide .txtArea{
		margin-top: 2.67vw;
		font-size: 3.73vw;
	}

	.categorySection .accArea .swiper-slide .bttn{
		margin-top: -6.66vw;
	}

	.categorySection .accArea .bttn.toIndex{
		margin-top: 9.33vw;
		text-align: center;
	}

	.categorySection .accArea .bttn.toIndex .btnArwDown,
	.categorySection .accArea .bttn.toIndex .btnArwDown span{
		width: 100%;
	}

	.categorySection .accArea .bttn.close{
		margin-top: 5.33vw;
	}

	.categorySection .accArea .btnClose{
		margin-top: 0;
	}

	}/* --- max-width:768px */

/* ############################### accArea */

.categorySection .accArea.forPc{
	display: block;
}

.categorySection .accArea.forSp{
	display: none;
}

	@media screen and (max-width:768px){

	.categorySection .accArea.forPc{
		display: none;
	}

	.categorySection .accArea.forSp{
		display: block;
	}

	}/* --- max-width:768px */

/* ############################### arw */

.categorySection .example .arw{left: 16.5%;margin-left: -30px;}
.categorySection .oshiete .arw{left: 50%;margin-left: -30px;}
.categorySection .column .arw{right: 15%;margin-right: -30px;}

	@media screen and (max-width:768px){

	.categorySection .example .arw{left: 50%;margin-left: -30px;}
	.categorySection .oshiete .arw{left: 50%;margin-left: -30px;}
	.categorySection .column .arw{left: 50%;margin-left: -30px;right: auto;}

	}/* --- max-width:768px */

/* ############################### acc */

.categorySection.accBlock .accBody{
	left: 50%;
	margin-left: max(-40.5vw,-567px);
	width: min(81.07vw,1135px);
}

.categorySection.accBlock .accBody .areaWrap{
	padding-top: min(4.29vw,60px);
	padding-left: min(3.93vw,55px);
	padding-right: min(3.93vw,55px);
	display: block;
}

/* example */
.categorySection.is_opened_example .accBody.example{grid-template-rows: 1fr;}
.categorySection.is_opened_example .accBody.example .accWrap{z-index: 10;opacity: 1;}
.categorySection.is_opened_example .accBody.example .areaWrap{display: block;}
.categorySection.is_opened_example .accBody.oshiete .areaWrap{display: none;}
.categorySection.is_opened_example .accBody.column .areaWrap{display: none;}
.categorySection.is_opened_example li.example .img,
.categorySection.is_opened_example li.example .txtBox{opacity: 0.5;}
.categorySection.is_opened_example .example .arw{opacity: 1;}
.categorySection.is_opened_example .example .inner .btnArwDown > span{background: #65353B;}
.categorySection.is_opened_example .example .inner .btnArwDown:hover > span{background: #fff;}
.categorySection.is_opened_example .example .inner .btnArwDown > span:before{rotate: 180deg;}
/* oshiete */
.categorySection.is_opened_oshiete .accBody.oshiete{grid-template-rows: 1fr;}
.categorySection.is_opened_oshiete .accBody.oshiete .accWrap{z-index: 10;opacity: 1;}
.categorySection.is_opened_oshiete .accBody.example .areaWrap{display: none;}
.categorySection.is_opened_oshiete .accBody.oshiete .areaWrap{display: block;}
.categorySection.is_opened_oshiete .accBody.column .areaWrap{display: none;}
.categorySection.is_opened_oshiete li.oshiete .img,
.categorySection.is_opened_oshiete li.oshiete .txtBox{opacity: 0.5;}
.categorySection.is_opened_oshiete .oshiete .arw{opacity: 1;}
.categorySection.is_opened_oshiete .oshiete .inner .btnArwDown > span{background: #65353B;}
.categorySection.is_opened_oshiete .oshiete .inner .btnArwDown:hover > span{background: #fff;}
.categorySection.is_opened_oshiete .oshiete .inner .btnArwDown > span:before{rotate: 180deg;}
/* column */
.categorySection.is_opened_column .accBody.column{grid-template-rows: 1fr;}
.categorySection.is_opened_column .accBody.column .accWrap{z-index: 10;opacity: 1;}
.categorySection.is_opened_column .accBody.example .areaWrap{display: none;}
.categorySection.is_opened_column .accBody.oshiete .areaWrap{display: none;}
.categorySection.is_opened_column .accBody.column .areaWrap{display: block;}
.categorySection.is_opened_column li.column .img,
.categorySection.is_opened_column li.column .txtBox{opacity: 0.5;}
.categorySection.is_opened_column .column .arw{opacity: 1;}
.categorySection.is_opened_column .column .inner .btnArwDown > span{background: #65353B;}
.categorySection.is_opened_column .column .inner .btnArwDown:hover > span{background: #fff;}
.categorySection.is_opened_column .column .inner .btnArwDown > span:before{rotate: 180deg;}

	@media screen and (max-width:768px){

	.categorySection.accBlock .accBody{
		left: 0;
		margin-left: 0;
		width: 89.33vw;
	}

	.categorySection.accBlock .accBody .areaWrap{
		padding: 9.33vw 5.33vw !important;
		margin: 0 0 1vw;
	}

	.categorySection .accBody.example .areaWrap,
	.categorySection .accBody.oshiete .areaWrap,
	.categorySection .accBody.column .areaWrap{display: block;}

	.categorySection.is_opened_example .example .inner .btnArwDown:hover > span,
	.categorySection.is_opened_oshiete .oshiete .inner .btnArwDown:hover > span,
	.categorySection.is_opened_column .column .inner .btnArwDown:hover > span{background: #65353B;}

	}/* --- max-width:768px */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ faqSection */

.faqSection{
	padding: min(4.29vw,60px) 0 min(5.71vw,80px);
	background: #EDEDED;
}

.faqSection .secInner{
	padding: 0 0 0 var(--50px);
}

.faqSection .tabHead{
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: min(4.29vw,60px) auto 0;
	width: min(30vw,420px);
}

.faqSection .tabHead .btnTab{
	display: block;
	width: min(9.29vw,130px);
	cursor: pointer;
}

.faqSection .tabHead .btnTab .txt{
	display: flex;
	align-items: center;
	justify-content: center;
	background: #fff;
	width: 100%;
	height: var(--44px);
	border-radius: var(--10px) var(--10px) 0 0;
	font-weight: bold;
	font-size: var(--16px);
	transition: all 0.3s 0s ease;
}
.faqSection .tabHead .btnTab:hover .txt,
.faqSection .tabHead .btnTab.is_active .txt{background: #65353B;color: #fff;}

.faqSection .tabHead .btnTab .space{
	height: var(--6px);
	display: block;
	transition: all 0.3s 0s ease;
}
.faqSection .tabHead .btnTab:hover .space,
.faqSection .tabHead .btnTab.is_active .space{background: #65353B;}

	@media screen and (max-width:768px){

	.faqSection{
		padding: 8vw 0 16vw;
	}

	.faqSection .secInner{
		padding: 0 0 0 5.33vw
	}

	.faqSection .tabHead{
		margin: 8vw 5.33vw 0 auto;
		width: 81.33vw;
	}

	.faqSection .tabHead .btnTab{
		width: 25.33vw;
	}

	.faqSection .tabHead .btnTab .txt{
		height: 9.07vw;
		border-radius: 2.67vw 2.67vw 0 0;
		font-size: 3.2vw;
	}

	.faqSection .tabHead .btnTab .space{
		height: 1.6vw;
	}

	}/* --- max-width:768px */

/* ############################### faqList */

.faqSection .tabBody .inner{
	padding: var(--30px) 0 var(--50px) min(7.5vw,105px);
	background: #fff;
	border-radius: var(--50px) 0 0 var(--50px);
}

.faqSection .faqList .imgBox{
	display: table !important;
	width: min(77.5vw,1085px);
	padding: var(--20px) 0 var(--20px) var(--20px);
	border-bottom: 1px solid #EDEDED;
}

.faqSection .faqList .imgBox .img{
	display: table-cell;
	vertical-align: middle;
	width: var(--50px);
}

.faqSection .faqList .imgBox .ttl{
	display: table-cell;
	vertical-align: middle;
	font-size: var(--16px);
	font-weight: bold;
	line-height: 1.5;
	padding-left: var(--15px);
	padding-right: var(--50px);
	position: relative;
}

.faqSection .faqList .imgBox .ttl:before{
	content: '';
	position: absolute;
	display: block;
	background: url(../img/icon_down_dred.svg) no-repeat center;
	top: 50%;
	margin-top: max(-0.29vw,-4px);
	right: var(--30px);
	width: var(--12px);
	height: var(--13px);
	background-size: contain !important;
	rotate: -90deg;
}
.faqSection .faqList .item[data-membership="true"] .ttl:before{display: none;}

.faqSection .item{display: block;width: 100% !important;}
.faqSection.misawa .item.column{display: none;}
.faqSection.column .item.misawa{display: none;}

.faqSection .articlesArea .membershipBlock[data-membership="true"] .mb_link:before,
.faqSection .autocreatArea .membershipBlock[data-membership="true"] .mb_link:before{
	display: none;
}

.faqSection .articlesArea .membershipBlock[data-membership="true"] .imgBox:after,
.faqSection .autocreatArea .membershipBlock[data-membership="true"] .imgBox:after{
	width: var(--50px);
	height: var(--50px);
	left: auto;
	right: 0;
}

.faqSection .swiper--columnAndCarousel.swiper--noCarousel .swiper-slide+.swiper-slide{
	margin-top: 0;
}

	@media screen and (max-width:768px){

	.faqSection .tabBody .inner{
		padding: 5.33vw 2.33vw 10.67vw 2.33vw;
		border-radius: 8vw 0 0 8vw;
	}

	.faqSection .faqList .imgBox{
		width: 100%;
		padding: 5vw 0 5vw 3vw;
	}

	.faqSection .faqList .imgBox .img{
		width: 10.13vw;
	}

	.faqSection .faqList .imgBox .ttl{
		font-size: 4.27vw;
		padding-left: 2.67vw;
		padding-right: 5.33vw;
	}

	.faqSection .faqList .imgBox .ttl:before{
		margin-top: -1.2vw;
		right: 0;
		width: 2.4vw;
		height: 3.47vw;
	}

	.faqSection .articlesArea .membershipBlock[data-membership="true"] .imgBox:after,
	.faqSection .autocreatArea .membershipBlock[data-membership="true"] .imgBox:after{
		width: 10.13vw;
		height: 10.13vw;
	}

	}/* --- max-width:768px */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ recommendSection */

.recommendSection{
	padding: min(6.43vw,90px) 0 min(5.71vw,80px);
}

.recommendSection .ttlBar span{
	font-size: var(--24px);
	border-left: min(0.64vw,9px) solid #65353B;
	padding: min(0.14vw,2px) var(--15px);
	font-weight: bold;
}

.recommendSection .recomendBlock.tatekae,
.recommendSection .recomendBlock.souzoku{
	margin-top: min(5.71vw,80px);
}

.recommendSection .swiper{
	margin-top: var(--40px);
}

.recommendSection .recomendBlock .txtArea .ttl{
	font-weight: normal;
}

	@media screen and (max-width:768px){

	.recommendSection{
		padding: 16vw 0 10.67vw;
	}

	.recommendSection .ttlBar span{
		font-size: 5.33vw;
		border-left: 2.4vw solid #65353B;
		padding: 1px 2.67vw;
	}

	.recommendSection .recomendBlock.chintai{
		border-bottom: 1px solid #EDEDED;
	}

	.recommendSection .recomendBlock.souzoku{
		margin-top: 10.67vw;
		border-bottom: 1px solid #EDEDED;
	}

	.recommendSection .recomendBlock.tatekae{
		margin-top: 10.67vw;
	}

	.recommendSection .swiper{
		margin-top: 5.33vw;
	}

	.recommendSection .swiper-slide{
		margin-top: 0 !important;
		padding-bottom: 10.67vw;
	}

	}/* --- max-width:768px */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ xxxxx */
/* ############################### xxxxx */