.contents img { vertical-align: bottom; width: 100%;  height: auto;}
.contents a:hover img { opacity: 0.8;}

#kanreki,#koki,#sanju,#hakuju{ margin-top: -60px; padding-top: 60px;}

/* 
header
------------------------------ */

.h1_ttl {background: #efb3b9;padding: 10px 15px;line-height: 1.3;margin-bottom: 25px;font-size: 14px;}
.gaju_info {display: flex;margin-bottom: 10px;justify-content: center;}
.gaju_names dt, dl.gaju_names dd {text-align: center;}
.gaju_names dt {background: #8e8e8e;border-radius: 30px;color: #fff;font-size: 17px;font-weight: bold;padding: 6px 17px 4px;letter-spacing: 2px;}
.gaju_names {margin: 0 3px;}
.gaju_names dt.red {background: #c54250;text-decoration: underline;font-size: 18px;}
.gaju_names dt.purple {background: #7341bd;text-decoration: underline;font-size: 18px;}
.gaju_names dt.yellow {background: #cba12e;text-decoration: underline;font-size: 18px;}
.gaju_names dt.white {background: #6bb3e0;text-decoration: underline;}
.gaju_names dd {font-size: 16px;font-weight: bold;}
.gaju_names dd.kana {margin: 5px 3px;font-size: 13px;}
p.gaju_attention {text-align: right;color: #91283b;}
.gaju_info a:hover {text-decoration: none!important;}


/* gaju_ttl
------------------------------ */
.gaju_ttl {margin-top: 40px;}
.gaju_ttl_h2 span {font-size: 30px;font-weight: 700;}
.gaju_ttl_h2 {font-family: 'Shippori Mincho', serif;font-size: 22px;font-weight: 700;margin-left: 100px;border-bottom: 5px solid #c54250;padding: 5px;position: relative;}
.gaju_ttl_h2:before {content: "";width: 100px;height: 60px;position: absolute;background-repeat: no-repeat;left: -100px;top: -18px;}
.gaju_ttl_txt {margin: 10px 0 10px 110px;font-size: 14px;line-height: 1.4;}
#kanreki .gaju_ttl_h2:before{background: url(//img.e87.com/selection/agedday/2021images/gaju_ttl_icon1.png);background-repeat: no-repeat;}
#koki .gaju_ttl_h2:before{background: url(//img.e87.com/selection/agedday/2021images/gaju_ttl_icon2.png);background-repeat: no-repeat;}
#sanju .gaju_ttl_h2:before{background: url(//img.e87.com/selection/agedday/2021images/gaju_ttl_icon3.png);background-repeat: no-repeat;}
#hakuju .gaju_ttl_h2:before{background: url(//img.e87.com/selection/agedday/2021images/gaju_ttl_icon4.png);background-repeat: no-repeat;}
#koki .gaju_ttl_h2 {border-bottom: 5px solid #7341bd;}
#sanju .gaju_ttl_h2 {border-bottom: 5px solid #cba12e;}
#hakuju .gaju_ttl_h2 {border-bottom: 5px solid #6bb3e0;}

/* box
------------------------------ */
.red {background: #e6c9cc;padding: 20px;}
.itembox_pic3 {display: flex;width: 605px;}
.itembox_pic3_sub {width: 195px;}
.itembox_pic3_main {width: 400px;margin-right: 10px;}
.itembox_pic3_sub1 {margin-bottom: 10px;}
.right {padding: 10px;}
.box_01 h3 {font-family: 'Shippori Mincho', serif;font-size: 22px;font-weight: 700;text-align: center;line-height: 1.3;border-bottom: 2px solid #fff;margin-bottom: 15px;padding-bottom: 5px;}
.box_01 {display: flex;}
.box_01.second_row { margin-top: 15px; padding-top: 15px; border-top: 1px #614a46 dotted;}
.box_03_outer.second_row { margin-top: 15px; padding-top: 13px; border-top: 1px #614a46 dotted;}
.box_01 .right {padding: 10px 0 0 15px;}
.item_txt {font-size: 15px;line-height: 1.4;padding: 5px;}
.itembox_info {padding: 10px;margin-top: 15px;}
.itembox_info a:hover {text-decoration: none!important;}
.itembox_info .item_name:hover {color: #ffffffc4;}
.itembox_info .btn:hover {background: #6b5c59;}
.itembox_info .item_name {color: #fff;font-size: 16px;font-weight: bold;line-height: 1.3;margin-bottom: 5px;}
.itembox_info .price {color: #614a46;font-size: 14px;}
.itembox_info .btn { background: #614a46;color: #fff;text-align: center;padding: 8px;font-size: 16px;font-weight: bold;margin-top: 10px;border-radius: 3px;}
.box_03_outer {display: flex;margin-top: 20px;justify-content: center;}
.box_03_outer .box_03 {width: 270px;margin: 0 18px;}
.box_03 h3 {font-family: 'Shippori Mincho', serif;font-size: 17px;font-weight: 700;line-height: 1.3;text-align: center;padding-bottom: 3px;}
.box_03 .itembox_info {background: #b98b90;padding: 10px;margin-top: 0;}
#kanreki .itembox_info { background: #b98b90;}
#koki .itembox_info { background: #9d8db7;}
#sanju .itembox_info { background: #a99869;}
#hakuju .itembox_info { background: #6ea2c1;}
.purple{background: #d5cbe5;padding: 20px;}
.yellow{background: #ecddb1;padding: 20px;}
.white{background: #c1dcec;padding: 20px;}
.box_03 .itembox_info .item_name {color: #fff;font-size: 15px;font-weight: bold;line-height: 1.2;margin-bottom: 5px;}
.box_02_outer {display: flex;justify-content: center;}
.box_02_outer .box_03 {width: 290px;margin: 0 50px;}

/* osusume */
.osusume_ttl_outer {padding: 25px 0 15px;}
h2.osusume_more {color: #614a46;font-size: 22px;display: inline-block;background: linear-gradient(transparent 50%, #fec2c9 0%);padding: 3px 10px;}
.osusume_box_outer {display: flex;}
.osusume_box {display: flex;width: 470px;}
.osusume_box:first-child {margin-right: 19px;}
.osusume_box .box_pic {width: 239px;border: 1px solid #b98b90;}
#kanreki .osusume_box .itembox_info {width: 209px;margin: 0;}
.osusume_box .item_comment {font-family: 'Shippori Mincho', serif;font-size: 18px;font-weight: 700;line-height: 1.2;margin-bottom: 18px;}
.font_small {font-size: 80%;}
.osusume_box .item_name {
font-size: 15px;
line-height: 1.3;

}



/*?@new_columnArea
-----------------------------*/
div#osusume_bnr ul {
clear: both;
overflow: hidden;
padding: 0 10px;
}
div#osusume_bnr ul li {
float: left;
padding: 10px 15px;
}
div#osusume_bnr ul li:hover{opacity:0.7;}
#n_columnArea>h4.summer:before {content: "\025cf";font-size: 38px;top: 5px;left: -15px;position: absolute;color: #cfdbfd;z-index: -1;}
#n_columnArea>h4.summer {font-weight: bold;color: #333333;font-size: 15px;position: relative;margin-left: 15px;border-bottom: 2px solid #cfdbfd;display: inline-block;padding: 3px 2px 1px!important;margin-top: 10px;background: rgba(255, 255, 255, 0);border-top: none;border-left: none;border-right: none;z-index: 1;}

#n_columnArea .columnArea {margin: 10px 0 20px;}
#n_columnArea .c_box {display: flex; width: 236px; float: left;min-height: 90px;}
#n_columnArea .c_box p {padding: 5px 8px 5px 5px;}
#n_columnArea .c_box p img {width: 65px;height: auto;}
#n_columnArea .c_box dt span {font-weight: bold;background: linear-gradient(transparent 40%, #fdc4bb 0%);color: #333333;font-size: 13.5px;padding: 0 2px;}
#n_columnArea .c_box dd {font-size: 11px;color: #565656;padding-top: 5px;line-height: 1.4;display: -webkit-box;
-webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;}
#n_columnArea .columnArea dl {padding: 0 5px 0 0;width: 157px;}
#n_columnArea a:hover {text-decoration: none!important;opacity: 0.8;color: #707070;}
#n_columnArea .c_box dt {line-height: 1.4;}
p.n_column_btn:hover {background: #af5071;}
p.n_column_btn a {color: #fff!important;}
p.n_column_btn { background: #761238;padding: 13px;margin: 50px auto 35px;width: 60%;text-align: center;font-weight: bold;font-size: 140%;border-radius: 3px;}
.contents div.pagetop { clear:both; color:#CA417D; font-size:85%; margin:15px 2px 20px 0; text-align:right; }
.sort_area_ { padding: 3px 0!important;}
.clearfix::after{content: "";display: block;clear: both;}
#n_columnArea h3 {background: #fff;color: #877903;border-bottom: 3px double #877903;border-top: 3px double #877903;padding: 8px 0!important;text-align: center;font-size: 16px!important;font-weight: bold!important;margin: 30px auto 20px!important;line-height: 1.2;border-left: none;border-right: none;border-radius: 0;}




/* long_ttl */
.long_ttl {margin: 20px 0;}
.long_ttl .long_ttl_txt:before {background: url(//img.e87.com/selection/agedday/2021images/rindou_icon2.png) no-repeat center top;height: 73px;width: 73px;content: "";position: absolute;top: 0;left: 50%;transform: translateX(-50%);}
.long_ttl .long_ttl_txt {padding-top: 90px;text-align: center;position: relative;font-family: 'Shippori Mincho', serif;font-size: 26px;color: #d94647;font-weight: 500;}
.box_4 {display: flex;padding: 10px 0 40px;align-items: baseline;}
.box_4 .item_info {position: unset;background: none;border: none;width: 220px;padding: 10px;}
.box_4 .item_info .pic {text-align: center;}
.box_4 .item_info .pic img {border: 1px solid #d5c784;}
.item_info dt {font-size: 15px;padding: 7px 0 3px;line-height: 1.2;}
.item_info dt a {font-weight: bold;}
.box_4 {display: flex;justify-content: center;align-items: center;padding: 10px 0 40px;}
.price span {font-size: 110%;}
.item_outer {padding-top: 70px;margin-top: -70px;}


/* other
------------------------------ */
.contents { text-align:left; width:960px; margin:0 auto; padding-bottom:60px; }

div.pagetop { clear:both; color:#CA417D; font-size:85%; margin:13px 2px 30px 0; text-align:right; }
div.pagetop p{ float:right;}

/* FAQ
------------------------------ */
#n_columnArea h2.h2_ttl,#faq h2.h2_ttl {color:#877903;border-top: 1px solid #877903;border-bottom: 1px solid #877903;text-align: center;padding: 8px 0 6px;font-size: 16px;font-weight: bold;margin: 30px 0 20px;}
.e87-lower-layout {margin-top:40px;margin-bottom:60px;}
.e87-lower-section {margin-top:80px;}
.e87-lower-text {margin:0;line-height:1.8;font-size:1.1em;}
.e87-lower-text + .e87-lower-text {margin-top:2em;}
.e87-lower-anchor__item .e87-link-box--anchor {height:100%;display:flex;align-items:center;}
.e87-lower-anchor__item .e87-link-box--anchor::after {right:9px;top:calc(50% - 13px);transform:rotate(90deg) translateY(-50%);}
.e87-faq-lists {margin-top:60px;}
.e87-faq-accordion {border:1px solid #877903;border-radius:5px;margin-bottom:10px;overflow:hidden;}
.e87-faq-accordion:last-of-type {margin-bottom:0;}
.e87-faq-accordion__head {padding:20px 60px 20px 63px;background-image:url("https://img.e87.com/corp/faq/img/icon_q.png");background-repeat:no-repeat;background-position:left 18px top 15px;background-size:30px;cursor:pointer;transition:background-color .2s;will-change: contents;}
.e87-faq-accordion__head:hover {opacity:0.6;}
.e87-js-toggle-accordion__trigger--active:hover {background-color:transparent;}
.e87-faq-accordion__body__inner {background-image:url(https://img.e87.com/corp/faq/img/icon_a.png);background-repeat:no-repeat;background-size:30px;padding:8px 60px 30px 63px;background-position:left 18px top 7px;}
.e87-faq-accordion__body[data-status="closed"] {display:none;}
.e87-js-toggle-accordion__trigger {position:relative;}
.e87-js-toggle-accordion__trigger::before, .e87-js-toggle-accordion__trigger::after {content:"";position:absolute;width:16px;height:1px;background:#000;right:20px;top:0;bottom:0;margin:auto;transition:transform .3s;will-change: contents;}
.e87-js-toggle-accordion__trigger::after {transform:rotate(90deg);}
.e87-js-toggle-accordion__trigger--active::after {transform:rotate(0);}
.e87-faq-accordion__head__text {font-weight:bold;margin:0;font-size:1.3em;color: #443f37;}
.e87-faq-accordion__text {margin:0;}
.e87-faq-accordion__btn__wrap {margin:30px auto 0;width:85%;}
@media all and (min-width:769px) {.e87-faq-accordion__btn__wrap {width:344px;} }

/* ???TOP */

#to-top {
position: fixed;
bottom: 50px;
right: 24px;
width: 55px;
text-decoration: none;
background-color: #a40000;
display: block;
text-align: center;
opacity: 0;
transition: 0.2s;
color: #fff;
line-height: 48px;
font-size: 16px;
z-index: 10;
}

#to-top.fade {
opacity: 1;
transition:0.2s;
}

.wrap-top{
position:relative;
text-align: center;
font-weight: bold;
padding-top: 4px;
}

.wrap-top::before {
content:  '';
width: 8px;
height: 8px;
display:  block;
border-top: solid 2px;
border-right: solid 2px;
transform: rotate(-45deg);
position:  absolute;
top: 8px;
left:  0;
right:  0;
margin:  auto;
}

/* ranking
------------------------------ */
.area_rank{margin-bottom: 56px;position:relative;margin-bottom: 32px;}
section#ranking {clear:both;position:relative;}
.rank_box { display: flex; padding-top: 16px;justify-content: center;}
.rank_box dl {width:160px;font-family: "????", Meiryo, "?????? Pro W6", "Hiragino Kaku Gothic Pro", Osaka, "?? ?????", "MS PGothic", sans-serif;}
.rank_box dl div {font-size: 18px;color: #401f1f;line-height: 42px;z-index: 1;position:static;margin-bottom: 1px;background:none;width:unset;height:unset;text-align: left;}
.rank_box dl div._gold::before {
content: '';
background: url(//img.e87.com/img/icon/icon_rank_no1.gif) no-repeat;
width: 26px;
height: 24px;
background-size: 100%;
position: absolute;
left: 0;
top: -6px;
}
.rank_box dl div._silver::before {
content: '';
background: url(//img.e87.com/img/icon/icon_rank_no2.gif) no-repeat;
width: 26px;
height: 24px;
background-size: 100%;
position: absolute;
left: 0;
top: -6px;
}
.rank_box dl div._bronze::before {
content: '';
background: url(//img.e87.com/img/icon/icon_rank_no3.gif) no-repeat;
width: 26px;
height: 24px;
background-size: 100%;
position: absolute;
left: 0;
top: -6px;
}
.rank_box dl div._gold {padding-left:1.55em;background:none;padding-left: 1.55em;
background: none;
width: unset;
height: unset;
border-radius: unset;
text-align: left;}
.rank_box dl div._gold span{color:#401f1f;font-size:21px;}
.rank_box dl div._silver {padding-left:1.55em;padding-left: 1.55em;
background: none;
width: unset;
height: unset;
border-radius: unset;
text-align: left;
}
.rank_box dl div._silver span{color:#401f1f;font-size:21px;}
.rank_box dl div._bronze {padding-left:1.55em;padding-left: 1.55em;
background: none;
width: unset;
height: unset;
border-radius: unset;
text-align: left;}
.rank_box dl div._bronze span{color:#401f1f;font-size:21px;}
.rank_box._bottom dl {padding:0 17px;}
.rank_box._bottom dl div {font-size:28px;background: none;width: unset;height: unset;text-align: left;}
.rank_box dl div span{font-family: 'Noto Serif JP', serif;line-height: 1;font-size: 21px;color:#3c3c3c;position: static;}
.rank_box .item_img{position:relative;}
.rank_box .item_img img{box-sizing: border-box;width: 100%;height: auto;}
.rank_box._bottom{padding-top:0;}
.rank_box._bottom dl dd.item_img {margin: 24px 0 0;}
.rank_box dl dd.item_name {color: #3c3c3c;margin-top: 8px;margin-bottom: 6px;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;font-size: 13px;line-height: 1.3;}
.rank_box dl dd.price {color: #3c3c3c;font-size: 11px;text-decoration: line-through;}
dl dd.price._hide {text-decoration: line-through;}
.rank_box dl dd:hover {color:#797979;}
.rank_box a:hover {text-decoration:none;}
.rank_box a img:hover {opacity:0.8;}










/* ■■■■■■■■■■■ */
/* mixin-variable mixin・変数 */
/* ■■■■■■■■■■■ */
/*-----------------変数------------------*/
/*メディアクエリ*/
/*---------------カラー----------------*/
/*画像ズーム*/
/*---------------------------------------------------------------- ここからは旧式 ----------------------------------------------------------------*/
.main-c-back {
background-color: #609ed1;
}

.sub-c1-back {
background-color: #877903;
}

.sub-c2-back {
background-color: #c2e0ec;
}

.sub-c2-bor {
border: 2px solid #ea8f02;
}

.sub-c3-back {
background-color: #ddf1f9;
}

/*カラーリスト*/
/*white*/
/*black9*/
/*$black3*/
/*$black3*/
/*$black3*/
/*$black3*/
/*$black3*/
/*$black3*/
/*$black3*/
/*black3*/
/*black3*/
/*black3*/
/*black3*/
/*black3*/
/*black3*/
/*black3*/
/*black3*/
/*black3*/
/*gray1*/
/*gray3*/
/*black3*/
/*black3*/
/*black3*/
/*black3*/
/*black3*/
/*black3*/
/*black3*/
/*black3*/
.color-border10 {
border-color: #444444; /*black3*/
border: solid 1px;
}

.color-bg11 {
background-color: #f2f2f2;
}

.color-bg12 {
background-color: #e3e3e3;
}

/*旧カラー*/
/*カラー*/
.bg-sub-color1 {
background-color: #cccccc;
}

.bg-sub-color2 {
background-color: #000000;
}

/*テキストカラー*/
/*テキストカラー*/
.text-maincolor {
color: #333333;
}

.text-white {
color: #ffffff;
}

/*ボーダーカラー*/
/*ボックスフレームカラー*/
.bg-black {
background-color: #333333;
}

.border-black {
border: solid 3px #333333;
}

.txt-black {
color: #333333;
}

.bg-red {
background-color: #ea0202;
}

.border-red {
border: solid 3px #ea0202;
}

.txt-red {
color: #ea0202;
}

.bg-light-gray {
background-color: #f2f2f2;
}

.border-light-gray {
border: solid 3px #f2f2f2;
}

.txt-light-gray {
color: #f2f2f2;
}

.bg-main-color {
background-color: #f08437;
}

.border-main-color {
border: solid 3px #f08437;
}

.txt-main-color {
color: #f08437;
}

/*ツートbg*/
.twotone-white-gray {
background: linear-gradient(90deg, #f8f8f8 0%, #f8f8f8 50%, #f1f1f1 50%, #f1f1f1 100%);
}

/*-----------------mixin------------------*/
/*アニメーション*/
/*見出し*/
/*-----------------mixin------------------*/
/*コンテンツ背景*/
/*コンテンツ大枠*/
/*ボタンのマージンや大きさ*/
/*画像のマージンや大きさ*/
/*--------------------------ボタン--------------------------------*/
/*小ボタン*/
/*大ボタン*/
/*WEB作品集バッジ*/
body {
margin: 0px;
}

.renewal-page {
font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
/*--------テキスト---------*/
}
.renewal-page figure {
margin: 0 0 0 0;
}
.renewal-page p {
display: block;
margin-block-start: 0px;
margin-block-end: 0px;
margin-inline-start: 0px;
margin-inline-end: 0px;
line-height: 2.2941176471;
}
.renewal-page html {
height: 100%;
}
.renewal-page h3::after {
border-bottom: 0px solid;
}
.renewal-page html {
overflow: auto;
}
.renewal-page * {
box-sizing: border-box;
}
.renewal-page a {
cursor: pointer;
text-decoration: none;
}
.renewal-page a:hover {
overflow: hidden;
text-decoration: none;
transition: 0.5s;
opacity: 0.8;
}
.renewal-page a:hover img {
transition: 0.5s;
opacity: 0.8;
}
.renewal-page p, .renewal-page li, .renewal-page h2, .renewal-page h3, .renewal-page h4, .renewal-page h5, .renewal-page h6 {
color: #444444;
font-size: 18px;
line-height: 200%;
}
.renewal-page ul {
padding-inline-start: 20px;
}
.renewal-page li {
font-size: 16px;
}
.renewal-page img {
width: 100%;
}

.renewal-page {
/*----------Cpmpornentscss---------*/
/*-------見出し------*/
}
.renewal-page .c-fullwidth-pd {
padding: 0 2%;
}
.renewal-page .c-fullwidth-cont {
max-width: 960px;
width: 100%;
margin: 0 auto;
}
.renewal-page h2 {
text-align: center;
font-weight: bold;
margin-bottom: 8px;
line-height: 1.5em;
font-size: 32px;
margin-bottom: 32px;
}
.renewal-page h2::before {
content: "";
background-image: url(//img.e87.com/longlife/2024images/h2-icon.png);
height: 22px;
width: 118px;
display: block;
margin: 0 auto 20px auto;
}
.renewal-page h3 {
flex-grow: 0;
line-height: 1em;
font-weight: bold;
color: #444444;
font-size: 28px;
padding: 8px 16px 10px 16px;
}
.renewal-page h4 {
font-weight: bold;
margin-bottom: 24px;
line-height: 0.1 0.6em;
text-align: center;
font-size: 24px;
}
.renewal-page h4::after {
content: "";
display: block;
width: 50px;
margin: 24px auto 0 auto;
border-bottom: 1px solid;
-o-border-image: linear-gradient(to right, #c21500 0%, #ffc500 100%);
border-image: linear-gradient(to right, #b48401 40%, #fff961 69%, #b48401 100%);
border-image-slice: 1;
}

.renewal-page {
/*----------project-scss---------*/
}
.renewal-page .l-mv-kotei, .renewal-page .l-mv-kotei img {
width: 960px;
height: 320px;
margin: 0 auto;
display: block;
}
.renewal-page .txt-sub-c1 {
color: #877903;
}
.renewal-page .txt-white {
color: #ffffff !important;
}
.renewal-page .txt-black {
color: #000000 !important;
}
.renewal-page .itembox_info {
border: 1px solid #b48401;
-o-border-image: #b48401;
border-image: #b48401;
border-image: -webkit-linear-gradient(left, #b48401 40%, #fff961 69%, #b48401 100%) 1;
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#609ed1", endColorstr="#18b4e6",GradientType=1 ) 1;
background-color: #ffffff;
-o-border-image: linear-gradient(to right, #b48401 40%, #fff961 69%, #b48401 100%) 1;
border-image: linear-gradient(to right, #b48401 40%, #fff961 69%, #b48401 100%) 1;
}
.renewal-page .itembox_info .btn {
padding: 10px;
margin: 10px auto 0px auto;
}
.renewal-page .itembox_info .price {
margin: 0 auto;
width: fit-content;
}
.renewal-page .box_01 h3 {
font-size: 18px;
padding: 10px 4px;
}
.renewal-page .item_txt {
font-size: 15px !important;
line-height: 1.6 !important;
padding: 5px;
}
.renewal-page .itembox_pic3_sub1 {
margin-bottom: 10px !important;
}
.renewal-page h2, .renewal-page h3, .renewal-page h4, .renewal-page .title {
font-family: "Noto Serif JP", serif;
}
.renewal-page .title {
font-size: 22px;
line-height: 1.5em;
}
.renewal-page .p-product .category, .renewal-page .p-product .name, .renewal-page .p-product .price {
line-height: 1em;
width: fit-content;
margin: 0 auto;
margin-bottom: 8px;
}
.renewal-page .p-product .category {
line-height: 1em;
font-size: 14px;
}
.renewal-page .p-product .name {
width: fit-content;
font-weight: bold;
line-height: 1.5em;
font-size: 16px;
}
.renewal-page .bg-red {
background-color: #bd0000;
}
.renewal-page .sec-intro {
position: relative;
background-image: url(//img.e87.com/longlife/2024images/back-intro.jpg);
background-size: cover;
background-position: center;
width: 960px;
margin: 0 auto;
}
.renewal-page .sec-intro .box {
border: 1px solid #b48401;
border-image: #b48401; /* Old browsers */
border-image: -moz-linear-gradient(left, #b48401 40%, #fff961 69%, #b48401 100%) 1; /* FF3.6-15 */
border-image: -webkit-linear-gradient(left, #b48401 40%, #fff961 69%, #b48401 100%) 1; /* Chrome10-25,Safari5.1-6 */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#609ed1", endColorstr="#18b4e6",GradientType=1 ) 1;
background-color: #ffffff;
border-image: linear-gradient(to right, #b48401 40%, #fff961 69%, #b48401 100%) 1;
}
.renewal-page .sec-intro .box p {
line-height: 1em;
font-weight: bold;
font-size: 14px;
}
.renewal-page .sec-intro .box img {
box-shadow: 2px 3px 12px rgba(100, 100, 100, 0.8);
}
.renewal-page .sec-intro .box .bdg {
background-color: #ffffff;
position: absolute;
height: 52px;
bottom: 0px;
opacity: 0.9;
padding: 8px 8px;
z-index: 10;
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
}
.renewal-page .sec-intro .box a:hover {
transition: 0s;
opacity: 1;
}
.renewal-page .sec-intro .u-flxwrp-nw-spb{
justify-content: space-between;
}
.renewal-page .sec-itiran {
position: relative;
background-image: url(//img.e87.com/longlife/2024images/back-itiran.jpg);
background-size: cover;
width: 960px;
margin: 0 auto;
}
.renewal-page .chart {
position: relative;
z-index: 10;
}
.renewal-page .chart .title1 p, .renewal-page .chart .data p {
text-align: center;
padding: 8px 0px;
font-size: 16px;
}
.renewal-page .chart .title1 {
border-radius: 10px 10px 0 0;
}
.renewal-page .chart .title1 p {
font-weight: bold;
color: #ffffff;
}
.renewal-page .chart .b-bottom {
border-bottom: 1px solid #e6e6e6;
}
.renewal-page .chart .end {
border-radius: 0px 0px 10px 10px;
}
.renewal-page .chart .b-black {
border-right: 1px solid #e6e6e6 !important;
}
.renewal-page .chart .b-white {
border-right: 1px solid #ffffff !important;
}
.renewal-page .chart .bg-lightred {
background-color: #fff3f3 !important;
}
.renewal-page .chart .bg-green {
background-color: #299731 !important;
}
.renewal-page .chart .bg-lightgreen {
background-color: #e8ffea !important;
}
.renewal-page .chart .bg-purple1 {
background-color: #82219e !important;
}
.renewal-page .chart .bg-lightpurple1 {
background-color: #f9e4ff !important;
}
.renewal-page .chart .bg-lightpurple2 {
background-color: #f0d0fa !important;
}
.renewal-page .chart .bg-yellow1 {
background-color: #f8ff00 !important;
}
.renewal-page .chart .bg-lightyellow1 {
background-color: #fbffdd !important;
}
.renewal-page .chart .bg-lightyellow2 {
background-color: #f9ffc8 !important;
}
.renewal-page .sec-rank {
position: relative;
background-image: url(//img.e87.com/longlife/2024images/back-rank.jpg);
background-size: cover;
width: 960px;
margin: 0 auto;
}
.renewal-page .sec-rank .bdg p {
font-size: 24px;
font-weight: bold;
}
.renewal-page .sec-product01 {
position: relative;
background-image: url(//img.e87.com/longlife/2024images/back-product01---1.jpg);
background-size: contain;
width: 960px;
margin: 0 auto;
background-repeat: repeat-y;
}
.renewal-page .sec-product02 {
position: relative;
background-image: url(//img.e87.com/longlife/2024images/back-product01---2.jpg);
background-size: contain;
width: 960px;
margin: 0 auto;
background-repeat: repeat-y;
}
.renewal-page .sec-iwaikata {
position: relative;
background-image: url(//img.e87.com/longlife/2024images/back-itiran.jpg);
width: 960px;
margin: 0 auto;
}
.renewal-page .sec-iwaikata .box {
background: rgba(255, 255, 255, 0.6);
border-top: 3px solid #b48401;
border-image: #b48401; /* Old browsers */
border-image: -moz-linear-gradient(left, #b48401 40%, #fff961 69%, #b48401 100%) 1; /* FF3.6-15 */
border-image: -webkit-linear-gradient(left, #b48401 40%, #fff961 69%, #b48401 100%) 1; /* Chrome10-25,Safari5.1-6 */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#609ed1", endColorstr="#18b4e6",GradientType=1 ) 1;
}
.renewal-page .square-big-might, .renewal-page .square-mid-might, .renewal-page .square-small-might {
position: absolute;
opacity: 50%;
display: block;
}
.renewal-page .square-big-might {
right: -10%;
/* max-width: 200px; */
/* min-width: 100px; */
top: -10%;
width: 18vw;
}
.renewal-page .square-mid-might {
right: -8%;
/* max-width: 200px; */
/* min-width: 100px; */
top: 0%;
width: 15vw;
}
.renewal-page .square-small-might {
left: -3%;
/* max-width: 200px; */
min-width: 150px;
top: 0%;
width: 10vw;
}

/*【背景色】*/
.bg-main-c {
background-color: #609ed1;
}

.bg-sub-c1 {
background-color: #877903;
}

.bg-sub-c2 {
background-color: #c2e0ec;
}

.bg-sub-c3 {
background-color: #ddf1f9;
}

.bg-sub-c4 {
background-color: #ea6100;
}

.bg-accent-c1 {
background-color: #ed8207;
}

.bg-accent-c2 {
background-color: #ead800;
}

.bg-trueblack {
background-color: #000000;
}

.bg-white {
background-color: #ffffff !important;
}

.bg-gray {
background-color: #cccccc;
}

.bg-lightgray {
background-color: #f8f8f8;
}

.bg-lightgray2 {
background-color: #efefef;
}

.bg-black {
background-color: #444444;
}

.bg-navy {
background-color: #003e92;
}

.bg-darkgray {
background-color: #666666;
}

.bg-stripe1 {
background-image: linear-gradient(-45deg, #ccc 25%, #efefef 25%, #efefef 50%, #ccc 50%, #ccc 75%, #efefef 75%, #efefef);
background-size: 4px 4px;
}

/*グラデーション*/
.bg-grad-c1 {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#1486aa+0,136ba5+100 */
background: #609ed1; /* Old browsers */
background: -moz-linear-gradient(left, #b48401 40%, #fff961 69%, #b48401 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #b48401 40%, #fff961 69%, #b48401 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #b48401 40%, #fff961 69%, #b48401 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#609ed1", endColorstr="#18b4e6",GradientType=1 ); /* IE6-9 */
}

* .bg_dot01 {
background-color: #fff;
background-image: radial-gradient(#c1c1c1 20%, transparent 50%);
background-size: 3px 3px;
}

.rgba09-white {
background-color: rgba(255, 255, 255, 0.9);
}

.opcity8 {
opacity: 0.8;
}

/*【テキスト色】*/
.txt-main-c {
color: #609ed1;
}

.txt-sub-c4 {
color: #ea6100;
}

.txt-white {
color: #ffffff !important;
}

.txt-red {
color: #bd0000;
}

.txt-gray {
color: #cccccc;
}

.txt-sub-c1 {
color: #877903;
}

.txt-a-main-c a {
color: #609ed1;
}

.txt-a-white a {
color: #ffffff;
}

/*【罫線色】*/
.frame-mein-c-solid {
border: 2px solid;
border-color: #609ed1;
}

.frame-main-c {
border: 2px solid;
border-color: #609ed1;
}

.frame-main-c-dash {
border: 2px dashed;
border-color: #609ed1;
}
@media (min-width: 769px) {
.frame-main-c-dash {
padding: 40px;
}
}
@media (max-width: 768px) {
.frame-main-c-dash {
padding: 24px 16px;
}
}

.frame-sub-c2 {
border: solid 8px;
border-color: #c2e0ec;
}

.frame-gray-c {
border: 1px solid;
border-color: #cccccc;
}

@media (min-width: 769px) {
.frame-r-lightgray-c {
border-right: 1px solid #cccccc;
}
}
@media (max-width: 768px) {
.frame-r-lightgray-c {
border-bottom: 1px solid #cccccc;
}
}

.frame-lightgray-c {
border: 1px solid;
border-color: #f8f8f8;
}

.frame-black {
border: solid 2px;
border-color: #212529;
}

.frame-white {
border: solid 3px;
border-color: #ffffff;
}

.border-white {
border: solid 3px #ffffff;
}

.u-pdtb40 {
padding-top: 20px;
padding-bottom: 20px;
}

.u-font-sm {
font-size: 14px !important;
}

.u-mb16 {
margin-bottom: 16px !important;
}

.u-pdbpc80 {
padding-bottom: 80px !important;
}

.u-pdtpc80 {
padding-top: 80px !important;
}

.u-mb40 {
margin-bottom: 40px !important;
}

.u-txt-cent {
text-align: center !important;
}

.u-flxwrp-nw-spb {
display: flex;
flex-wrap: nowrap;
/* justify-content: space-between; */
}

.u-gap05 {
gap: 0.5em !important;
}

.u-flx19 {
flex-basis: 19%;
}

.u-flx20 {
flex-basis: 18%;
}

.u-pos-relative {position: relative;}

.u-d-shadow01 {filter: drop-shadow(6px 6px 10px rgba(190, 190, 190, 0.8));}
.u-align-cent-clm .wp-block-columns {align-items: center !important;}
.u-mb32 {margin-bottom: 32px !important;}
.u-flx-auto {flex-basis: auto;}
.u-auto-pcglow1 {flex-basis: auto !important;flex-grow: 1 !important;}
.u-rignt-line {width: 100%;height: 1px;flex-grow: 1;}
.u-mb24 {margin-bottom: 24px !important;}
.u-flx25 {flex-basis: 25%;}
.u-mbpc80 {margin-bottom: 80px;}
.u-align-cent {display: flex;align-items: center;flex-flow: wrap;}
.u-pd40 {padding: 40px;}
.u-border-b-eee {border-bottom: 1px solid #eeeeee;padding-bottom: 16px;}
.u-border-b-ddd {border-bottom: 1px solid #dddddd;padding-bottom: 16px;}


#agedday{margin: 5em 3em 0;padding: 1em;background: #fff;border: 2px solid #eee;}

#agedday h2._heading_agedday::before {content: none;}

#agedday p.eyecatch_agedday{width:840px;margin: 16px auto 104px;}

/*---------------------------------
agedday rank
-----------------------------------*/
section#ranking {clear: both;position: relative;}
#agedday .rank_box_aged {display: flex;padding: 32px 16px 0;justify-content: center;}
#agedday .rank_box_aged dl {width: 175px;font-family: "????", Meiryo, "?????? Pro W6", "Hiragino Kaku Gothic Pro", Osaka, "?? ?????", "MS PGothic", sans-serif;transition:0.2s;margin: 8px 4px;}
#agedday .rank_box_aged._top dl {width: 230px;padding: 0 12px;}
#agedday .rank_box_aged dl div {font-size: 18px;color: #401f1f;line-height: 42px;z-index: 1;position: static;margin-bottom: 4px;background: none;width: unset;height: unset;text-align: left;}
#agedday .rank_box_aged dl div._gold::before {content: '';background: url(//img.e87.com/img/icon/icon_rank_no1.gif) no-repeat;width: 26px;height: 24px;background-size: 100%;position: absolute;left: 0;top: -4px;}
#agedday .rank_box_aged dl div._silver::before {content: '';background: url(//img.e87.com/img/icon/icon_rank_no2.gif) no-repeat;width: 26px;height: 24px;background-size: 100%;position: absolute;left: 0;top: -4px;}
#agedday .rank_box_aged dl div._bronze::before {content: '';background: url(//img.e87.com/img/icon/icon_rank_no3.gif) no-repeat;width: 26px;height: 24px;background-size: 100%;position: absolute;left: 0;top: -4px;}
#agedday .rank_box_aged dl div._gold {padding-left: 1.55em;background: none;padding-left: 1.55em;background: none;width: unset;height: unset;border-radius: unset;text-align: left;}
#agedday .rank_box_aged dl div._gold span {color: #401f1f;font-size: 21px;}
#agedday .rank_box_aged dl div._silver {padding-left: 1.55em;padding-left: 1.55em;background: none;width: unset;height: unset;border-radius: unset;text-align: left;}
#agedday .rank_box_aged dl div._silver span {color: #401f1f;font-size: 21px;}
#agedday .rank_box_aged dl div._bronze {padding-left: 1.55em;padding-left: 1.55em;background: none;width: unset;height: unset;border-radius: unset;text-align: left;}
#agedday .rank_box_aged dl div._bronze span {color: #401f1f;font-size: 21px;}
#agedday .rank_box_aged._bottom dl {padding: 0 17px;}
#agedday .rank_box_aged._bottom dl div {font-size: 28px;background: none;width: unset;height: unset;text-align: left;}
#agedday .rank_box_aged dl div span {font-family: 'Noto Serif JP', serif;line-height: 1;font-size: 21px;color: #252525;position: static;}
#agedday .rank_box_aged .item_img {position: relative;}
#agedday .rank_box_aged._bottom {padding-top: 0;}
#agedday .rank_box_aged._bottom dl dd.item_img {margin: 24px 0 0;}
#agedday .rank_box_aged dl dd.item_name {color: #333;margin-top: 8px;margin-bottom: 6px;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;font-size: 13px;line-height: 1.3;}
#agedday .rank_box_aged dl dd.price {color: #252525;text-decoration: none;}
#agedday .rank_box_aged a:hover {text-decoration: none;}
#agedday .rank_box_aged dl:hover{opacity:0.8;}
#agedday .rank_box_aged img{width:100%;height:auto;}

/*---------------------------------
agedday heading
-----------------------------------*/
.wrap_heading{text-align: center;}
h2._heading_agedday{text-align: center;font-size: 30px;border-bottom: 2px solid #eee;margin: 1em auto;padding-bottom: 0.5em;width: 840px;font-weight: bold;    font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;}
h3._heading_agedday{font-size:24px;color:#007A88;position:relative;text-align: center;z-index:0;font-weight: 600;margin: 80px 0 56px;line-height: 1.2;    font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}
h3._heading_agedday::after{    content: '';background: url(https://img.e87.com/selection/agedday/2025images/heading-bg.png) no-repeat;background-size: 100%;width: 435px;height: 125px;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);z-index: -1;}
h3._heading_agedday .adjust_heading{font-size:16px;font-weight: 600;}
h3.heading_other_feature{font-size: 22px;color: #007A88;position: relative;text-align: center;font-weight: 600;margin-bottom: 1.25em;display:inline-block;}
h3.heading_other_feature::before{    content: '';width: 30px;height: 30px;background: #4c1b67;position: absolute;left: -40px;top: 50%;transform: translateY(-50%);}

.common_txt {line-height: 2;font-size: 16px;color: #252525;text-align: center;margin-bottom: 16px;}

/*---------------------------------
????? btn
-----------------------------------*/
.common_btn{margin:32px 0 120px;}
.area_btn {text-align: center;margin:40px 0;}
.area_btn p.btn_text {width: 540px;position: relative;font-size: 18px;padding: 19px 20px 14px;display: inline-block;color: #fff;font-weight: bold;border-radius: 5px;line-height: 1.3;transition: .2s;box-sizing: border-box;text-align: center;border: 1px solid #007A88;background:#007A88}
.area_btn._recommend p.btn_text::before {background: url(https://img.e87.com/selection/father/2023images/submit_icon.png) no-repeat;width: 58px;height: 64px;left: 23px;top: 50%;transform: translate(0 , -50%);background-size: contain;}
.area_btn p.btn_text::after {content: "";position: absolute;margin: auto;top: 50%;right: 2em;width: 8px;height: 8px;border-top: 2px solid #fff;border-right: 2px solid #fff;transform: rotate(45deg) translateY(-50%);transition: 0.2s;}
.area_btn p.btn_text:hover {background: #fff;color: #007A88;}
.area_btn p.btn_text:hover:after {right: 1.5em;border-top: 2px solid #007A88;border-right: 2px solid #007A88;}
.area_btn p.btn_text::before {position: absolute;background: url(https://img.e87.com/selection/father/2023images/submit_style_icon.png) no-repeat;width: 58px;height: 64px;left: 20px;top: 50%;transform: translate(0 , -50%);background-size: contain;}
#rank .area_btn {text-align: center;}   

.common_txt {font-size: min(4.1vw, 16px);line-height: 1.8;text-align: left;color: #333;margin: 1em 0;padding: 0 3%;text-align: center;}