/* CSS Document */

/* トップページの設定 */

/*---------------------------------------------------------------------
slideの設定
---------------------------------------------------------------------*/
div#slide{
	text-align:center;
}

ul.bxslider > li{
	width:100%;
}

div.bx-pager{
	margin-top:5px;
	display:-webkit-box;
	display:-webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-justify-content:center;
	-ms-flex-pack:center;
	justify-content:center;
}

div.bx-pager div.bx-pager-item:first-of-type ~ div.bx-pager-item{
	margin-left:10px;
}

a.bx-pager-link{
	display:inline-block;
	background:#CCCCCC;
	overflow:hidden;
	width:10px;
	height:10px;
	text-indent:999px;
	border-radius:20px;
	-webkit-transition:0.5s;
	-moz-transition:0.5s;
	transition:0.5s;
}

a.active,
a.bx-pager-link:hover{
	background:#4A4E9C;
}


/*---------------------------------------------------------------------
共通設定
---------------------------------------------------------------------*/
div#slide ~ div,
div#slide ~ section{
	margin-top:10%;
	padding:0 5%;
	box-sizing:border-box;
}


/*---------------------------------------------------------------------
contentsの設定
---------------------------------------------------------------------*/
#contents > p,
#contents ul li:first-of-type ~ li{
	margin-top:5%;
}

#contents ul li a:nth-of-type(2) img,
#contents ul li a:last-of-type img{
	margin-top:2%;
}

/* 3月5日追加
-------------------------------------------------*/
div.renewal{
	margin-top:5%;
}

div.renewal a{
	display:block;
	background:#FFFFFF;
}

div.renewal a img{
	display:block;
	animation:renewal 3s linear infinite;
}

@keyframes renewal {
	0%{opacity:1;}
	50%{opacity:0.3;}
	100%{opacity:1;}
}
/* 3月5日追加
-------------------------------------------------*/


/*---------------------------------------------------------------------
新着情報,イベントカレンダーの設定
---------------------------------------------------------------------*/
.list h2 img{
	width:auto !important;
	height:1.8rem;
}

.list > ul{
	margin-top:5%;
}

.list > ul li{
	border-bottom:1px solid #000000;
}

.list > ul li a{
	display:block;
	background:url(../../../common/img/parts/green_arrow.png) no-repeat 4% center;
	padding:4% 2% 4% 10%;
	text-decoration:none;
	font-size:80%;
}

.list > ul li:first-of-type a{
	padding:0 2% 4% 10%;
}

.list > ul li a p{
	font-weight:bold;
	color:#4A4E90;
}

.list > ul li a p span{
	display:inline-block;
	margin-left:5%;
	/*padding:4% 5%;*/
	padding:4% 4%;
	color:#FFFFFF;
	line-height:0;
}

.list > ul li a p span + span{
	margin-left:1%;
	/*font-size: 10px;*/
}

.list > ul li a h3{
	margin-top:3%;
	color:#000000;
	line-height:1.4em;
}

.list > p{
	margin-top:5%;
}

.list > p a{
	display:block;
	background:url(../../../common/img/parts/black_arrow.png) no-repeat 95% center, #FFC222;
	padding:5% 0;
	text-align:center;
	text-decoration:none;
	font-size:90%;
	color:#000000;
	line-height:0;
	border-radius:5px;
	box-sizing:border-box;
}

/* [ カテゴリークラス ] */
span.info,
span.events{
	background:#00A172 !important;
}

span.campaign{
	background:#E84653 !important;
}

span.report{
	background:#009BD3 !important;
}

span.recruiting{
	background:#D03A95 !important;
}

span.pressrelease,
span.experience{
	background:#FFC222 !important;
}

span.ad{
	background:#2B63AA !important;
}

span.other{
	background:#4A4E80 !important;
}

span.festival{
	background:#AAC100 !important;
}

span.parenting{
	background:#DBA5BD !important;
}

span.cooking_class{
	background:#D03A95 !important;
}

span.tour{
	background:#009BD3 !important;
}

span.lecture{
	background:#D90001 !important;
}

span.sdgs_cat,
span.sustainability{
  background:#8AC75A !important;
}



/*---------------------------------------------------------------------
cookingの設定
---------------------------------------------------------------------*/
#cooking{
	text-align:center;
}

#cooking > div{
	width:80%;
	background:#FFFFFF;
	margin:5% auto 0;
	padding:10px;
	box-shadow:0px 0px 6px rgba(0, 0, 0, 0.38);
	box-sizing:border-box;
	line-height:0;
}

#cooking > section h3{
	margin:6% 0 5%;
	font-weight:bold;
	font-size:90%;
}

#cooking > section p{
	width:70%;
	margin:0 auto;
}

#cooking > section p a{
	display:block;
	background:url(../../../common/img/parts/white_arrow.png) no-repeat 95% center, #4A4E90;
	padding:20px 0;
	text-decoration:none;
	font-size:90%;
	color:#FFFFFF;
	line-height:0;
	border-radius:20px;
	box-sizing:border-box;
}

#cooking > p{
	margin-top:5%;
}

#cooking > p a{
	display:block;
	background:url(../../../common/img/parts/black_arrow.png) no-repeat 95% center, #FFC222;
	padding:5% 0;
	text-decoration:none;
	font-size:90%;
	color:#000000;
	line-height:0;
	border-radius:5px;
	box-sizing:border-box;
}

#cooking > ul{
	margin-top:5%;
	display:-webkit-box;
	display:-webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-justify-content:space-between;
	-ms-flex-pack:space-between;
	justify-content:space-between;
}

#cooking > ul li{
	width:48%;
}


/* 2019年12月21日　クッキング改修
------------------------------------*/

#cookingbx{
	text-align:center;
}

#cookingbx > div{
	width:100%;
	margin:5% auto 0;
	box-sizing:border-box;
	line-height:0;
}

/*#cookingbx > div > a:first-of-type{
	display:block;
	margin-bottom:10px;
}*/

#cookingbx > div > a + a{
	display:block;
	margin-top:10px;
}

#cookingbx > div > a img{
  width: 100%;
}


/*---------------------------------------------------------------------
pickupの設定
---------------------------------------------------------------------*/
#pickup > ul{
	margin-top:6%;
	display:-webkit-box;
	display:-webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-flex-wrap:wrap;
	-ms-flex-wrap:wrap;
	flex-wrap:wrap;
	-webkit-justify-content:space-between;
	-ms-flex-pack:space-between;
	justify-content:space-between;
}

#pickup > ul li{
	width:48%;
}

#pickup > ul li:nth-of-type(2) ~ li{
	margin-top:6%;
}

#pickup > ul li a{
	text-align:center;
	text-decoration:none;
	font-size:110%;
	color:#4A4E90;
}

#pickup > ul li a p{
	margin-top:5px;
}

#pickup > div{
	margin-top:6%;
	padding-top:6%;
	border-top:1px solid #A8987C;
}

#pickup > div ul{
	padding:0 6%;
	display:-webkit-box;
	display:-webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-flex-wrap:wrap;
	-ms-flex-wrap:wrap;
	flex-wrap:wrap;
	-webkit-justify-content:space-between;
	-ms-flex-pack:space-between;
	justify-content:space-between;
}

#pickup > div ul li{
	width:48%;
}

#pickup > div ul li:nth-of-type(2) ~ li{
	margin-top:2%;
}



/*---------------------------------------------------------------------
bnr_setの設定
---------------------------------------------------------------------*/

.bnr_set{
	
}

.bnr_set a{
	display:block;
	width:80%;
	margin:0 auto;
}

.bnr_set a:first-of-type{
	margin-bottom:15px;
}

.bnr_set a img{
	display:block;
	width:100%;
	height:auto;
}



/* コロナ対策 */

section.info_link{
    margin-top:40px;
}

section.info_link a{
    display:flex;
    justify-content: flex-start;
    align-items: center;
    background:#ffc268;
    border-radius: 5px;
    padding:10px 25px 10px 10px;
    font-size:16px;
    text-decoration: none;
    font-weight: normal;
    color:#444;
    position:relative;
    line-height:1.4;
}

section.info_link a::after {
    position: absolute;
    content: '';
    display: block;
    right: 15px;
    top: calc(50% - 5px);
    width: 10px;
    height: 10px;
    border-top: 1px solid #444;
    border-right: 1px solid #444;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}