body {
	font-size      : 12px;
	letter-spacing : 0.3px;
}

.contents-side-full {
	width : 100%;
}

.contents-side-margin {
	margin : 0 18px;
}

.contents-side-margin-8 {
	margin : 0 8px;
}

.header {
	font-size      : 15px;
	font-weight    : 700;
	letter-spacing : 0.08em;
	margin-bottom  : 20px;
	height         : fit-content;
	z-index        : 40;
}

.sub-header {
	font-size   : 12px;
	font-weight : 700;
}

.banner {
	width           : 100%;
	display         : flex;
	align-items     : center;
	justify-content : center;
}

.grid {
	display  : grid;
	grid-gap : 0;
}

div.button {
	text-align : center;
}

.scroll-yoko {
	overflow-x  : auto;
	white-space : nowrap;
	font-size   : 0;
}

.scroll-yoko.overflow {
	margin-right : -18px;
}

.scroll-yoko div {
	display        : inline-block;
	margin-right   : 10px;
	vertical-align : top;
}

.scroll-yoko span {
	font-size : 10px;
}

.scroll-yoko .brand {
	font-size    : 10px;
	line-height  : 1.4;
	border       : 1px #cccccc solid;
	height       : 13px;
	display      : inline-block;
	padding      : 0 5px;
	margin-right : 4px;
}

.scroll-yoko .itemtype {
	font-size        : 9px;
	line-height      : 1.4;
	border           : 1px #B5AC9F solid;
	background-color : #B5AC9F;
	color            : #FFFFFF;
	display          : inline-block;
	padding          : 0 5px;
	margin-right     : 4px;
}

.kyuuka-annai {
	font-size   : 12px;
	text-align  : center;
	line-height : 20px;
	margin      : 10px 0;
}

.kyuuka-annai .title {
	font-size     : 12px;
	font-weight   : 700;
	margin-bottom : 5px;
}

.kyuuka-annai .grid {
	justify-content : space-between;
}

.kyuuka-annai a {
	text-decoration : underline;
}

.swiper-maincatch {
	margin-bottom : 10px;
}

.swiper-button-prev,
.swiper-button-next {
	position        : absolute;
	top             : 50%;
	z-index         : 1;
	font-size       : 20px;
	background-size : 14px auto;
	cursor          : pointer;
}

.swiper-button-prev {
	left            : 5px;
	background      : url("/wp-content/themes/hyacca/sp/assets/img/common/swiper-button-prev.svg") no-repeat left;
	background-size : 14px auto;
}

.swiper-button-prev::after, .swiper-rtl .swiper-button-next::after {
	content : "";
}

.swiper-button-next {
	right           : 5px;
	background      : url("/wp-content/themes/hyacca/sp/assets/img/common/swiper-button-next.svg") no-repeat right;
	background-size : 14px auto;
}

.swiper-button-next::after, .swiper-rtl .swiper-button-prev::after {
	content : "";
}

/* Swiper 12: addIcons:true により注入されるSVGアイコンを非表示 (カスタム背景画像を使用) */
.swiper-button-prev svg,
.swiper-button-next svg {
	display : none !important;
}

.swiper-pagination {
	text-align : center;
	width      : 100%;
	position   : absolute;
	bottom     : 15px;
}

.swiper-pagination-bullet {
	display       : inline-block;
	width         : 8px;
	height        : 8px;
	margin        : 0 5px;
	border-radius : 100%;
	background    : #989898;
	cursor        : pointer;
}

.swiper-pagination-bullet-active {
	background-color : #C9C9C9;
}

.swiper-maincatch-thumbnail .swiper-slide {
	border : 1px #FFFFFF solid;
}

.swiper-maincatch-thumbnail .swiper-slide.swiper-slide-thumb-active img,
.swiper-maincatch-thumbnail .swiper-slide.swiper-slide-thumb-active video {
	border : 1px #777777 solid;
}

.popup-swiper {
	height : 100%;
}

.tate-middle-wrapper {
	display : table;
	width   : 100%;
	height  : 100%;
}

.tate-middle {
	display        : table-cell;
	vertical-align : middle;
}

.image-yoko-hyouji-full {
	display      : inline-block;
	position     : relative;
	width        : 100%;
	aspect-ratio : 1 / 1;
	min-width    : 0;
}

.image-yoko-hyouji-full::before {
	content     : "";
	display     : block;
	padding-top : 100%;
}

.image-yoko-hyouji-full img {
	position        : absolute;
	width           : 100%;
	height          : 100%;
	top             : 0;
	left            : 0;
	object-fit      : cover;
	object-position : center center;
}

video {
	width          : 100%;
	height         : auto;
	line-height    : 0;
	vertical-align : bottom;
}

.image-yoko-hyouji-full video {
	position        : absolute;
	width           : 100%;
	height          : 100%;
	top             : 0;
	left            : 0;
	object-fit      : cover;
	object-position : center center;
}

.hidden-souryou-muryou {
	/*display : none !important;*/
}

#idCampaignBanner.hidden {
	display : none !important;
}

#idCampaignBanner2.hidden {
	display : none !important;
}

.top_news {
	/*margin     : 0 10px 20px 10px;*/
	text-align : center;
	font-size  : 10px;
}

.top_news a {
	text-decoration : underline;
}

.top_news span {
	font-weight : bold;
	display     : inline-block;
	padding     : 20px 0;
}

.link-popup {
	cursor          : pointer;
	text-decoration : underline;
}

.popup-wrapper {
	display    : none;
	margin     : 0;
	padding    : 0;
	width      : 100%;
	max-height : 93%;
	position   : fixed;
	overflow   : scroll;
	box-sizing : border-box;
	bottom     : 0;
	z-index    : 800;
}

.popup-tablecell {
	position : relative;
}

.popup {
	background-color : #FFFFFF;
	width            : 100%;
	padding          : 45px 30px 30px;
	box-sizing       : border-box;
}

.popup .popup-btn-close {
	position : absolute;
	top      : -6px;
	right    : 0;
	width    : 22px;
	height   : 15px;
	padding  : 24px 20px 23px;
	z-index  : 90;
	cursor   : pointer;
}

.popup-btn-close::before {
	position          : absolute;
	top               : 50%;
	left              : 50%;
	-webkit-transform : translate(-50%, -50%) rotate(45deg);
	-ms-transform     : translate(-50%, -50%) rotate(45deg);
	transform         : translate(-50%, -50%) rotate(45deg);
	width             : 22px;
	height            : 1px;
	content           : "";
	background-color  : #000000;
}

.popup-btn-close::after {
	position          : absolute;
	top               : 50%;
	left              : 50%;
	-webkit-transform : translate(-50%, -50%) rotate(-45deg);
	-ms-transform     : translate(-50%, -50%) rotate(-45deg);
	transform         : translate(-50%, -50%) rotate(-45deg);
	width             : 22px;
	height            : 1px;
	content           : "";
	background-color  : #000000;
}

.popup .popup-btn-close-circle {
	width    : 29px;
	height   : 29px;
	position : absolute;
	top      : 0;
	right    : 0;
	padding  : 9px 13px;
}

.popup .popup-btn-close-circle div {
	width            : 29px;
	height           : 29px;
	background-color : #F3F3F1;
	border-radius    : 15px;
	position         : absolute;
	z-index          : -1;
}

.popup .popup-btn-close-circle::before,
.popup .popup-btn-close-circle::after {
	width : 17px;
}

.popup-background {
	display          : none;
	position         : fixed;
	bottom           : 0;
	background-color : #000000;
	opacity          : 30%;
	width            : 100%;
	height           : 100%;
	z-index          : 70;
}

.slide-from-right {
	position           : absolute;
	top                : 0;
	left               : 100%;
	-webkit-transition : 0.5s;
	transition         : 0.5s;
	margin-bottom      : 75px;
	border-left        : 1px solid #D9D9D9;
	background-color   : #FFFFFF;
	z-index            : 90;
}

.slide-from-right-active {
	left : 0;
}

.slide-back-right {
	position        : absolute;
	top             : 0;
	left            : 0;
	padding         : 9px 39px;
	z-index         : 90;
	cursor          : pointer;
	font-family     : "Noto Sans JP", sans-serif;
	font-size       : 16px;
	font-weight     : 700;
	background      : url("/wp-content/themes/hyacca/sp/assets/img/common/swiper-button-prev.svg") no-repeat 19px 15px;
	background-size : 11px;
}

.btn-wrapper-fixed-bottom {
	position         : fixed;
	bottom           : 0;
	background-color : #FFFFFF;
}

.popuup-wrapper-fullheight {
	height : 90%;
}

.popuup-wrapper-fullheight .popup-table {
	height : 100%;
}

.popuup-wrapper-fullheight .popup-tablecell {
	height : 100%;
}

.popuup-wrapper-fullheight .popup {
	height : 100%;
}

#idAuthorSupervision.author-supervision {
	font-family      : 'Noto Sans JP', serif;
	overflow-wrap    : break-word;
	word-break       : break-all;
	background-color : #F7F7F7;
	padding          : 17px 26px 19px;
	margin-top       : 50px;
}

#idAuthorSupervision.author-supervision h2 {
	font-size        : 20px;
	font-weight      : 700;
	line-height      : 1.45;
	letter-spacing   : 0.004em;
	text-align       : center;
	margin           : 0 0 10px;
	position         : unset;
	display          : block;
	padding          : 0;
	border           : 0;
	background-color : none;
}

#idAuthorSupervision.author-supervision h2:after {
	all : unset;
}

#idAuthorSupervision.author-supervision .img-wrapper {
	width      : 100%;
	text-align : center;
	margin     : 0;
}

#idAuthorSupervision.author-supervision img {
	width  : 102px;
	height : 102px;
	margin : 0 auto;
}

#idAuthorSupervision.author-supervision .supervisor-name {
	font-size      : 14px;
	font-weight    : 700;
	line-height    : 1.64;
	letter-spacing : 0.004em;
	text-align     : center;
	margin         : 8px 0 10px;
}

#idAuthorSupervision.author-supervision .supervisor-text {
	font-size   : 11px;
	text-align  : left;
	line-height : 2;
	margin      : 0;
}

.id-ranking-tabs {
	padding        : 23px 0;
	font-family    : 'Noto Sans JP', serif;
	letter-spacing : 0.3px;
	overflow-wrap  : break-word;
	word-break     : break-all;
}

.id-ranking-tabs a {
	text-decoration : none;
}

.id-ranking-tabs .tab-button-wrapper {
	display       : flex;
	border-bottom : 1px solid #888888;
}

.id-ranking-tabs .tab-button-wrapper .tab-button {
	flex                    : 1;
	font-size               : 12px;
	line-height             : 119.8%;
	letter-spacing          : 3%;
	color                   : #fff;
	background-color        : #BBB;
	padding                 : 6px 2px 6px 2px;
	border                  : 1px solid #BBB;
	cursor                  : pointer;
	border-top-left-radius  : 6px;
	border-top-right-radius : 6px;
	margin-bottom           : -1px;
	transition              : background-color 0.3s, color 0.3s, border-color 0.3s;
}

.id-ranking-tabs .tab-button-wrapper .tab-button + .tab-button {
	margin-left : 3px;
}

.id-ranking-tabs .tab-button-wrapper .tab-button.active {
	background-color    : #fff;
	color               : #000;
	border-color        : #888;
	z-index             : 2;
	border-bottom-color : transparent;
}

.id-ranking-tabs .tab-content {
	display    : none;
	background : #fff;
	padding    : 12px 15px;
	border     : 1px solid #888;
	border-top : none;
	text-align : center;
	overflow   : hidden;
	width      : revert;
}

.id-ranking-tabs .tab-content.active {
	display : block;
}

.id-ranking-tabs .tab-content .tab-header {
	font-size      : 15px;
	font-weight    : 700;
	letter-spacing : 8%;
	margin-bottom  : 13px;
}

.id-ranking-tabs .tab-content .grid {
	grid-template-columns : repeat( 3, 1fr );
	grid-column-gap       : 15px;
}

.id-ranking-tabs .scroll-yoko {
	display : flex;
}

.id-ranking-tabs .scroll-yoko .ranking {
	display       : inline-block;
	width         : 125px;
	margin-right  : 20px;
	margin-bottom : 15px;
	position      : relative;
	flex-shrink   : 0;
}

.id-ranking-tabs .tab-content .ranking::before {
	display  : inline-block;
	width    : 17px;
	height   : 17px;
	content  : "";
	position : absolute;
	top      : 0;
	left     : 0;
}

.id-ranking-tabs .tab-content .ranking.rank1::before {
	background : url("/wp-content/themes/hyacca/sp/assets/img/common/ranking1.svg") no-repeat center top;
}

.id-ranking-tabs .tab-content .ranking.rank2::before {
	background : url("/wp-content/themes/hyacca/sp/assets/img/common/ranking2.svg") no-repeat center top;
}

.id-ranking-tabs .tab-content .ranking.rank3::before {
	background : url("/wp-content/themes/hyacca/sp/assets/img/common/ranking3.svg") no-repeat center top;
}

.id-ranking-tabs .tab-content .ranking.rank4::before {
	background : url("/wp-content/themes/hyacca/sp/assets/img/common/ranking4.svg") no-repeat center top;
}

.id-ranking-tabs .tab-content .ranking.rank5::before {
	background : url("/wp-content/themes/hyacca/sp/assets/img/common/ranking5.svg") no-repeat center top;
}

.id-ranking-tabs .tab-content .ranking.rank6::before {
	background : url("/wp-content/themes/hyacca/sp/assets/img/common/ranking6.svg") no-repeat center top;
}

.id-ranking-tabs .tab-content .ranking.rank7::before {
	background : url("/wp-content/themes/hyacca/sp/assets/img/common/ranking7.svg") no-repeat center top;
}

.id-ranking-tabs .tab-content .ranking.rank8::before {
	background : url("/wp-content/themes/hyacca/sp/assets/img/common/ranking8.svg") no-repeat center top;
}

.id-ranking-tabs .tab-content .ranking.rank9::before {
	background : url("/wp-content/themes/hyacca/sp/assets/img/common/ranking9.svg") no-repeat center top;
}

.id-ranking-tabs .tab-content .ranking.rank10::before {
	background : url("/wp-content/themes/hyacca/sp/assets/img/common/ranking10.svg") no-repeat center top;
}

.id-ranking-tabs .tab-content .ranking.rank11::before {
	background : url("/wp-content/themes/hyacca/sp/assets/img/common/ranking11.svg") no-repeat center top;
}

.id-ranking-tabs .tab-content .ranking.rank12::before {
	background : url("/wp-content/themes/hyacca/sp/assets/img/common/ranking12.svg") no-repeat center top;
}

.id-ranking-tabs .tab-content .ranking.rank13::before {
	background : url("/wp-content/themes/hyacca/sp/assets/img/common/ranking13.svg") no-repeat center top;
}

.id-ranking-tabs .tab-content .ranking.rank14::before {
	background : url("/wp-content/themes/hyacca/sp/assets/img/common/ranking14.svg") no-repeat center top;
}

.id-ranking-tabs .tab-content .ranking.rank15::before {
	background : url("/wp-content/themes/hyacca/sp/assets/img/common/ranking15.svg") no-repeat center top;
}

.id-ranking-tabs .tab-content .ranking a {
	color : #000000;
}

.id-ranking-tabs .tab-content .ranking a img {
	margin-bottom : 9px;
}

.id-ranking-tabs .tab-content .ranking .product-name {
	font-size          : 12px;
	position           : relative;
	height             : 35px;
	line-height        : 1.5;
	letter-spacing     : 0;
	text-overflow      : ellipsis;
	overflow           : hidden;
	white-space        : normal;
	display            : -webkit-box;
	-webkit-box-orient : vertical;
	-webkit-line-clamp : 2;
	display            : revert;
	margin-right       : revert;
	margin-bottom      : 10px;
}

.id-ranking-tabs .tab-content .ranking .product-kakaku {
	font-size      : 14px;
	font-weight    : 400;
	letter-spacing : 0;
	display        : revert;
	margin-right   : revert;
}

.id-ranking-tabs .tab-content .ranking .product-kakaku .tax {
	font-size      : 8px;
	font-weight    : 400;
	letter-spacing : 0;
}

.id-ranking-tabs .btn-next {
	margin : 10px auto 7px !important;
}

