@charset "UTF-8";

/*setting start*/
.columnWrap * {
box-sizing: border-box;
word-wrap: break-word;
}
img {
max-width: 100%;
vertical-align: bottom;
}
a {
text-decoration: none;
color: #333;
}

li {
list-style-type: none;
}
.is-pc {
display: block !important;
}
.is-sp {
display: none !important;
}
img.is-pc {
margin: auto;
}
img.is-sp {
margin: auto;
}
/*setting end*/



.columnWrap{
padding: 0px 0 30px;
background: #E8F3E0;
background: linear-gradient(355deg, rgba(255,253,231,1) 6%, rgba(212,235,251,1) 32%, rgba(228,206,240,1) 68%, rgba(219,201,219,1) 100%);
margin-bottom: 50px;
}

.columnWrap .pageTtl{
background: #CE0500;
font-size: 26px;
color: #fff;
padding: 10px 15px;
}

.culumnList{
display: flex;
flex-wrap: wrap;
/*justify-content: flex-start;*/
padding: 50px 0px 0px;
margin: auto;
width: 940px;
}
.culumnList li{
width: 31%;
margin-right: 3.5%;
padding: 0px 0px 0px;
overflow: hidden;
margin-bottom: 40px;
background: #fff;
position: relative;
}
.culumnList li:nth-child(3n){
margin-right: 0;
}
.culumnList li .cat{
font-size: 14px;
background: #ACD591;
background: #d3a3c6;
color: #000;
text-align: center;
padding: 5px 0 3px;
}
.culumnList li .img{
padding-bottom: 68%;
background-color: #ddd;
background-position: center center;
background-size: cover;
}
.culumnList li .cont{
padding: 15px;
height: 130px;

/*font-weight: bold;
font-size: 16px;*/
/*方法１ 1行のみ
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;*/
/*方法２ IE以外*/
/*display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden; */
/*方法３ htmlのみ自分で手作業*/
/*方法４ JS*/
}
.culumnList li .cont .ttl{
font-weight: bold;
font-size: 18px;
margin-bottom: 10px;
line-height: 1.4;
}
.culumnList li .cont .date{
display: block;
text-align: right;
color: #666666;
font-size: 14px;
position: absolute;
bottom: 10px;
right: 10px;
}
.culumnList li a{
display: block;
color: #333;
transition:opacity 0.2s;
}
.culumnList a:hover{
opacity: 0.7;
}

/*page-detail*/
.detailWrap * {
box-sizing: border-box;
word-wrap: break-word;
}
#breadcrumb .container.detail{
padding-bottom: 15px;
}

.page-detail{
background: #eee;
}

.detailWrap {
padding: 0 0 50px;
background: #E8F3E0;
background: linear-gradient(355deg, rgba(255,253,231,1) 6%, rgba(212,235,251,1) 32%, rgba(228,206,240,1) 68%, rgba(219,201,219,1) 100%);
}
.detailWrap .detailIn{
padding: 40px 80px 40px;
margin: 18px auto auto;
width: 940px;
background: #fff;
}
.detailWrap .detailBox{
justify-content: space-between;
align-items: center;
display: flex;
padding:5px 0px;
}
.detailWrap .detailBox .cat{
padding: 0px 10px 0;
background: #ACD591;
background: #d3a3c6;
color: #000;
font-size: 16px;
}
.detailWrap .detailBox .date{
font-size: 14px;
color: #666;
}
.detailWrap .pageTtl{
padding:5px 0px;
font-size: 28px;
margin-bottom: 20px;
}
.detailWrap .pageImg{
margin-bottom: 30px;
}
.detailWrap .pageImg img{
width: 100%;
}
.detailWrap .detailSection{
padding: 0px 0;
margin-bottom: 60px;
}
.detailWrap .detailSection .inner{
padding: 15px 0px 0;
}
.detailWrap .detailSection .ttl01{
font-weight: bold;
color: #111;
padding: 10px 0 10px 15px;
border-top: 1px solid #ccc;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
border-left: 6px solid #d3a3c6;
font-size: 18px;
}
.detailWrap .detailSection .txt{
margin-bottom: 30px;
font-size: 18px;
}
.detailWrap .detailSection img{
width: 100%;
}
.btn01 {
    margin: 50px auto 0;
    width: 80%;
    max-width: 400px;
    background-color: #76B84A;
    background-color:#ac4f92;
    border-radius: 30px;
}
.btn01 a{
    display: block;
    height: 60px;
    line-height: 60px;
    font-size: 18px;
    font-weight: 200;
    text-align: center;
    color: white;
    position: relative;
}
.btn01 a::after{
    content: "＞";
    position: absolute;
    right: 5%;
    top: 50%;
    transform: translateY(-50%);
}

.profile{
    width: 780px;
    margin: 60px auto;
    border: 1px solid #CCCCCC;
}
.profile-data {
    padding: 20px;
    width: 100%;
    box-sizing: border-box;
}
.profile-data__head{
    margin-bottom: 10px;
    font-size: 12px;
    color: #ACD591;
    color: #ac4f92;
}
.profile-data__head span {
    display: block;
    color: #000000;
}
.profile-data__body {
    font-size: 14px;
}
#txt__research {
    font-size: 14px;
}
.e-health {
    text-decoration: underline;
}

.top-under-text {
    margin-bottom: 50px;
    padding-top: 15px;
    font-size: 18px;
}
.figu-genmai {
    margin-bottom: 30px;
}
.idea-img {
    margin: -20px 0 10px;
}
.ingred-img {
    margin: 40px 0 40px;
}
.-pagebot {
    margin-bottom: 15px!important;
}
.profile {
    display: flex;
    width: 780px;
}
.doc-pro-div {
    width: 42.85%;
    box-sizing: border-box;
    padding: 20px;
    display: flex;
    align-items: center;
}
.doc-pro {
    width: 200px;
}
.doc-pro img {
    width: 200px;
}
.ingred-txt {
    margin-bottom: 50px!important;
}
.senitxt {
    margin-bottom: 10px!important;
}

/* パンくずカスタマイズ */
#breadcrumb ul li:first-child:before{
    content: none;
}
#breadcrumb .container{
    margin: auto;
    width: 940px;
}
#breadcrumb ul li {
    font-size: 18px !important;
}
#breadcrumb ul li a {
    font-size: 18px !important;
}

/* フッターカスタマイズ */
.pagetop img{
    display: none !important;
}
.pagetop{
    width: 80px;
    height: 80px;
    line-height: 80px;
    text-align: center;
    background-color: #76B84A;
    background-color: #ac4f92;
    border-radius: 50%;
    padding: 0 !important;
    opacity: 1 !important;
}
.pagetop::after{
    content: "↑";
    font-size: 40px;
    position: relative;
    top: -8px;
}

/* ページャー */
.pager{
    display: flex;
    justify-content: center;
}
.pager_btn{
    display: block;
    width: 36px;
    text-align: center;
    height: 36px;
    line-height: 36px;
    font-size: 20px;
    margin-right: 15px;
    background-color: #76B84A;
    background-color: #ac4f92;
}

.pager_btn.notActive{
    background-color: #CCCCCC;
}
.pager_btn.notActive:hover{
    opacity: 1 !important;
}
.pager_btn_nums{
    color: #CCCCCC;
    display: flex;
}
.pager_btn_nums .pager_btn{
    background-color: white;
    border: 1px solid #CCCCCC;
    color: #444444;
    position: relative;
}
.pager_btn_nums .pager_btn::after{
    content:"";
    display: block;
    width: 15px;
    height: 1px;
    background-color: #444444;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 5px;
}
.pager_btn_nums .pager_btn.active{
    background-color: white;
    border: 1px solid #CCCCCC;
    font-weight: bold;
    text-decoration: none;
}
.pager_btn_nums .pager_btn.active::after{
    content: none;
}
.pager_btn_pre{
    color: white;
}
.pager_btn_next{
    color: white;
    margin-right: 0;
}