@charset "utf-8";

/*======================================================
　このCSSはビーノで作成したTOPページを調整しているCSSです。
　適用順番は最後（ビーノのCSSが反映されたあと）になります。
　場合によっては、ビーノCSSの打ち消し等を行っています。
　------------------------------------------------------
　メディアクエリ（画面幅）でデバイス毎に適用しており
　適用順番は先にスマホでの調整をしたあとタブレットとPCの順番で適用しています。
======================================================*/



/*********************************
　SP（560px以下）
*********************************/
/*---------　表示非表示切り替え　----------*/
.sp_block{display: block;}
.pc_block{display: none;}

/*---------　全体ブロック設定　----------*/
.l-main section{margin-bottom: 0;}
img{border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;}
.c-itemlist--square .c-itemlist__item{padding-right: 0;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;}
.p-header__kanban img{border-radius:unset;}

/*---------　ヘッダー　----------*/
.l-header .p-header__kanban{width: 95%; max-width: 1500px;}
.p-header__kanban .p-header__kanban__logo{width: 62%;margin: 0 auto;}
header .c-bnr{width: 98%;max-width: 1500px; margin: 0 auto;text-align: center;}
header .c-bnr.p-bnr--col1 a{font-size: 4.5vw;font-weight: bold;color: #bf0000;}
header .c-bnr li:not(:last-child){margin-bottom: 1.5rem;}
header .Timer iframe{display: block; margin: 0 auto 10vw;}
.c-searchbox .c-balloon--top{background-color: #ddddd7;}
.c-searchbox .c-balloon--top::before {border-bottom: 15px solid #ddddd7;}
.c-searchbox__popular .c-container{justify-content: center;}
.c-header__searchbox .c-searchbox__keyword{margin-right: 0;border: 1px solid #847c74;}
.fa-search{background: #847c74;}
.l-header .c-header__menu{top: 2vw;background-color: #847c74;}

/*---------　メインブロック　----------*/
main .pb-lg{padding-bottom: 20vw;}
main h2.title_01{position: relative;font-size: 5.4vw;margin-bottom: 5rem;padding: 0 0 1.8rem;line-height: 1;}
main h2.title_01:after {position: absolute;bottom: 0;left: 0;width: 100%;height: 6px;content: '';border-radius: 3px;
	background-image: -webkit-gradient(linear, right top, left top, from(#fdf900), to(#f57b2a));
	background-image: -webkit-linear-gradient(right, #fdf900 0%, #f57b2a 100%);
	background-image: linear-gradient(to left, #fdf900 0%, #f57b2a 100%);
}
main h2.title_01#Health:after{
	background-image: -webkit-gradient(linear, right top, left top, from(#2af598), to(#009efd));
	background-image: -webkit-linear-gradient(right, #2af598 0%, #009efd 100%);
	background-image: linear-gradient(to left, #2af598 0%, #009efd 100%);
}
main h2.title_01#Diet:after{
	background-image: -webkit-gradient(linear, right top, left top, from(#f52a4c), to(#fdad00));
	background-image: -webkit-linear-gradient(right, #f52a4c 0%, #fdad00 100%);
	background-image: linear-gradient(to left, #f52a4c 0%, #fdad00 100%);
}
main h2.title_01#Beauty:after{
	background-image: -webkit-gradient(linear, right top, left top, from(#7a12cf), to(#fdd700));
	background-image: -webkit-linear-gradient(right, #7a12cf 0%, #fdd700 100%);
	background-image: linear-gradient(to left, #7a12cf 0%, #fdd700 100%);
}
main h2.title_01 span{display: block;width: 70%;margin: 0 auto 1.3rem;padding: 1rem 0;background-color: #847c74;color: #fff;font-size: 0.8em;border-radius: 3px;-webkit-border-radius: 3px;-moz-border-radius: 3px;}
main .c-itemlist h2,main h2.title_01 + h2{font-size: 4.4vw;line-height: 1;margin-bottom: 1.5rem;}
/*:not(.preview-body) .l-main .c-itemlist--square--col3 .c-itemlist__item{flex-basis: calc(90.0% - 8px);padding-right: 0;}*/
.c-sidenav__list li:not(.down),.c-sidenav__list dd:not(.down){position: relative;overflow: hidden;}
.c-sidenav__list li:not(.down):before,.c-sidenav__list dd:not(.down):before{content: '';position: absolute;top: 0;right: 0;bottom: 0;left: 0;background-color: #fff;transform: translateX(-100%);box-sizing: border-box;transition: 0.5s ease-in-out;z-index: -1;}
.c-sidenav__list li:not(.down):hover,.c-sidenav__list dd:not(.down):hover{color: #333;background-color: unset;}
.c-sidenav__list li:not(.down):hover:before,.c-sidenav__list dd:not(.down):hover:before{transform: translateX(0);}
.fujii_03{overflow: hidden; width:100%;margin:0 auto; color:#888; text-align:center; background-color: #ffffff;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;}
.fujii_03,.Vaccine{margin-bottom: 3.5rem;}
.Vaccine img{width: 100%;}
#Manga{width:60%;margin:0 auto;}
#Manga img{width:100%;}
#Manga .Contributor{
	position: relative;
	margin-bottom:6%;
	padding: 4% 6%;
	background-color:#fff;
	border-radius: 5px;
	text-align:center;
	list-style: none!important;
}
#Manga .Contributor:after {
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: "";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(255, 255, 255, 0);
	border-top-color: #ffffff;
	border-width: 10px;
	margin-left: -10px;
}
#Manga .Contributor li:first-child{margin-bottom: 2%;font-size:0.8em;text-align:right;}
#Manga .Contributor li:last-child{margin-top:2%;}
#Manga .Contributor li strong{font-size:1.2em;}
#Manga .Item span{display:block;}
#Manga .Item span.Writer{text-align: right;padding-right: 3%;}
#Manga .Item span.BT{background-color: #fe5511;color: #fff;padding: 5% 0;text-align: center;border-radius: 100px;margin-top: 5%;}
#Manga .Item span.BT:hover{background-color: #fead11;}

/*---------　リストパターン1_共通　----------*/
.ListPt_1 ul{display: flex;flex-wrap: wrap;justify-content: space-between; list-style: none!important;}
.ListPt_1 ul li{width: 48%;margin-bottom: 1.3rem;font-size: 2.3vw;}
.ListPt_1 ul li a{display: block;padding: 8% 0 6%; background-color: #fff;color: #333;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;}
.ListPt_1 ul li a img{width: 35%;vertical-align: middle;}
.ListPt_1 ul li a span{display: inline-block;margin-top: 2%;vertical-align: middle;}
/*---------　リストパターン1_TOPカテゴリーボタン　----------*/
.ListPt_1.category ul li{font-size: 3.5vw;}
.ListPt_1.category ul li a{padding: 8% 0; text-align: center;background-color: #847c74;color: #fff;border: solid 1px #847c74;}

/*---------　フッター　----------*/
.l-footer__guide{background: #edede8;}
.l-footer__shopping-guide.mb-3{display: none;}
.l-footer__guide__container .l-footer__box{width: 92%;background-color: #fff;}
.l-footer__box--shipping__free.mt-1{display: none;}





/*********************************
　TB以上（560px以上）
*********************************/
@media screen and (min-width: 35.000em) {
	/*---------　表示非表示切り替え　----------*/
	.sp_block{display: block;}
	.pc_block{display: none;}
	
	/*---------　ヘッダー　----------*/
	.p-header__kanban .p-header__kanban__logo{max-width: 300px;}
	header .Timer iframe{margin: 0 auto 46px;}
	header .c-bnr.p-bnr--col1 a{font-size: 26px;}

	/*---------　メインブロック　----------*/
	main h2.title_01{font-size: 24px;}
	main .c-itemlist h2,main h2.title_01 + h2{font-size: 18px;}
	/*:not(.preview-body) .l-main .c-itemlist--square--col3 .c-itemlist__item{flex-basis: calc(33.3% - 8px);}*/
	main h2.title_01#oga_info span{display: inline-block;width: unset;margin: 0 1rem 0 0;padding: 1rem 1.5rem;font-size: 0.8em;}
	#Manga{max-width:240px;width:100%;}
	.ListPt_1 ul {list-style: none!important;}
	#Manga .Contributor {list-style: none!important;}

	/*---------　リストパターン　----------*/
	.ListPt_1 ul li{width: 23.6%;font-size: 12px;}
	/*---------　リストパターン1_TOPカテゴリーボタン　----------*/
	.ListPt_1.category ul li{font-size: 16px;}

	/*---------　フッター　----------*/
}





/*********************************
　PC（960px以上）
*********************************/
@media screen and (min-width: 60.000em) {
	/*---------　表示非表示切り替え　----------*/
	.sp_block{display: none;}
	.pc_block{display: block;}
	
	/*---------　ヘッダー　----------*/
	.p-header__kanban .p-header__kanban__logo{margin: 1% 0 0 2%;}
	.l-header__shopmenu{display: none;}
	.l-header .c-header__menu{width: 100%;background-color: #847c74;margin-top: 0; padding: 2rem 0;}
	.l-header .c-header__menu ul.c-container{width: 90%;max-width: 1500px;margin: 0 auto;}
	.c-header__menu--basic li:not(:last-child){border-color: #fff;}
	.c-header__menu li > a{color: #fff;}
	.c-header__menu li > a:hover{background-color: #edede8;color: #49423b;}

	/*---------　メインブロック　----------*/
	main .pb-lg{padding-bottom: 100px;}
	.ListPt_1.category ul li a:hover{background-color: #edede8;color: #49423b;}
	.ListPt_1 ul {list-style: none!important;}
	#Manga .Contributor {list-style: none!important;}

	/*---------　フッター　----------*/
	.l-footer__guide .l-footer__wrapper > div{width: 96%; margin: 0 auto 1.5rem;}
	.l-footer__guide__container .l-footer__box{width: calc(33.3% - 10px);}
}



/*TOPスライダーバナーテキスト中央よせ*/
.slick-slider .slick-track,.slick-slider .slick-list{
  text-align:center;
}
