@charset "utf-8";


/* ----------------
  Top
---------------- */
body {
  padding-top: 100px;
}
@media screen and (max-width: 767px){
  body {
    padding-top: 48px;
  }
}

#main_box {
  width: 100%;
  margin-top: 0;
}
@media screen and (max-width:767px) {
  #main_box {
    padding-right: 0;
    padding-left: 0;
  }
}

/* ---- top_main_visual ---- */
.top_main_visual {
  position: relative;
  width: 100%;
  padding-top: calc(700 / 1550 * 100%);
  background-image: url(../images/bg_main_visual.jpg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  overflow: hidden;
}
.top_main_visual > .main_visual_cover,
.top_main_visual > ul {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
}
.top_main_visual > .main_visual_cover {
  width: calc(990 / 1550 * 100%);
  padding-top: calc(121 / 1550 * 100%);
  background-image: url(../images/main_visual_slogan.svg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  opacity: 0;
}
html[lang="en"] .top_main_visual > .main_visual_cover {
  width: calc(818 / 1550 * 100%);
  padding-top: calc(199 / 1550 * 100%);
  background-image: url(../images/en_main_visual_slogan.svg);
}
.top_main_visual._set_a > .main_visual_cover {
  transition: opacity 1.5s .5s cubic-bezier(.165, .84, .44, 1);
}
._csstrans .top_main_visual._set_a._start > .main_visual_cover {
  opacity: 1;
}
._csstrans .top_main_visual._ready > .main_visual_cover {
}
.top_main_visual > ul {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
}
.top_main_visual > .bg_visual_link {
  width: calc(1380 / 1550 * 100%);
}
.top_main_visual._ready > .bg_visual_link {
}
.top_main_visual > .bg_visual_link > li {
  opacity: 0;
  margin-top: calc(-121 / 1550 * 100%);
}
.top_main_visual._set_a > .bg_visual_link > li.link01 {
  transition: opacity 1.2s 2s cubic-bezier(.165, .84, .44, 1),
              margin 1.2s  2s cubic-bezier(.165, .84, .44, 1);
}
.top_main_visual._set_a > .bg_visual_link > li.link02 {
  transition: opacity 1.2s 2.3s cubic-bezier(.165, .84, .44, 1),
              margin 1.2s 2.3s cubic-bezier(.165, .84, .44, 1);
}
.top_main_visual._set_a > .bg_visual_link > li.link03 {
  transition: opacity 1.2s 2.6s cubic-bezier(.165, .84, .44, 1),
              margin 1.2s 2.6s cubic-bezier(.165, .84, .44, 1);
}

/* animation 1 */
.top_main_visual._set_a._start > .bg_visual_link > li {
  opacity: 1;
  margin-top: 0;
}
.top_main_visual._set_f > .bg_visual_link > li {
  opacity: 1;
  margin-top: 0;
}

.top_main_visual > .bg_visual_link > li.link02 > .text01 {
  position: absolute;
  left: 45.5%;
  top: 55%;
  transform: translate3d(-50%, 0, 0);
  width: calc(458 / 634 * 100%);
  padding-top: calc(179 / 634 * 100%);
  background-image: url(../images/text01.svg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}
html[lang="en"] .top_main_visual > .bg_visual_link > li.link02 > .text01 {
  left: 47.5%;
  top: 45%;
  background-image: url(../images/en_text01.svg);
  width: calc(464 / 634 * 100%);
  padding-top: calc(176 / 634 * 100%);
}



.top_main_visual > .visual_link {
  width: calc(1243 / 1550 * 100%);
  visibility: hidden;
}

.top_main_visual._ready > .visual_link {
}
._csstrans .top_main_visual > .visual_link {
  visibility: visible;
}

.top_main_visual > ul > li {
  position: relative;
}
.top_main_visual > .bg_visual_link > li {
  width: calc(503 / 1380 * 100%);
  padding-top: calc(634 / 1380 * 100%);
  margin-left: calc(-135 / 1380 * 100%);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}
.top_main_visual > .bg_visual_link > .link01 {
  margin-left: 0;
  background-image: url(../images/main_visual_1.png);
}
.top_main_visual > .bg_visual_link > .link02 {
  width: calc(645 / 1380 * 100%);
  background-image: url(../images/main_visual_2.png);
}
/* .top_main_visual > .bg_visual_link > .link03 {
  background-image: url(../images/main_visual_3.png?ud=240610);
} */

.top_main_visual > .bg_visual_link > .link03 {
  background-image: url(../images/main_visual_50sp.png?ud=250127c);
}

html[lang="en"] .top_main_visual > .bg_visual_link > .link03 {
  background-image: url(../images/main_visual_3.png?ud=240610);
}

.top_main_visual > .visual_link > li {
  width: calc(362 / 1243 * 100%);
  padding-top: calc(634 / 1243 * 100%);
  transform: matrix(1, 0, -0.218, 1, 0, 0);
}
._csstrans .top_main_visual > .visual_link > li {
  transition: background-color .2s cubic-bezier(.165, .84, .44, 1);
}
.top_main_visual > .visual_link:hover > li {
}
.top_main_visual > .visual_link:hover > li:hover {
  /* background-color: rgba(255,255,255,.1);*/
}

.top_main_visual > .visual_link > .link02 {
  width: calc(502 / 1243 * 100%);
}
.top_main_visual > .visual_link > li > a {
  display: block;
  position: absolute;
  top: 0;
  left: 50%;
  width: 100%;
  height: 100%;
  transform: translate3d(-50%, 0, 0);
}
.top_main_visual > .visual_link > li > a > span {
  display: block;
  position: absolute;
  bottom: calc(40 / 634 * 100%);
  left: 50%;
  border: 1px rgb(255,255,255) solid;
  background-color: rgba(255,255,255,0);
  color: rgb(255,255,255);
  font-size: 20.9px;
  line-height: 41px;
  font-weight: 700;
  word-break:keep-all;
  transform: translate3d(-50%, 0, 0) matrix(1, 0, 0.218, 1, 0, 0);
}

.top_main_visual > .visual_link > li > a:hover > span {
  border-color: rgb(0,0,0);
  color: rgb(0,0,0);
  background-color: rgba(255,255,255,.7);
}

/*2025.1.27- 50周年公開のみ--*/
html[lang="ja"] .top_main_visual > .visual_link > .link03 > a > span {
  border-color: rgb(255,255,255);
  color: rgb(255,255,255);
  background-color: rgba(33,33,33,.7);
}
html[lang="ja"] .top_main_visual > .visual_link > .link03 > a:hover > span {
  border-color: rgb(0,0,0);
  color: rgb(0,0,0);
  background-color: rgba(255,255,255,.7);
}

.top_main_visual > .visual_link > .link01 > a > span {
  padding-right: 40px;
  padding-left: 40px;
}
.top_main_visual > .visual_link > .link02 > a > span {
  padding-right: 24px;
  padding-left: 24px;
}
.top_main_visual > .visual_link > .link03 > a > span {
  padding-right: 32px;
  padding-left: 32px;
}

.top_main_visual > .visual_link > li > a > span {
  opacity: 0;
  bottom: 0;
}
.top_main_visual._set_a > .visual_link > li.link01 > a > span {
  transition: opacity .4s 4s cubic-bezier(.165, .84, .44, 1),
    bottom .4s 4s cubic-bezier(.165, .84, .44, 1),
    color .4s cubic-bezier(.165, .84, .44, 1),
    background-color .4s cubic-bezier(.165, .84, .44, 1),
    border-color .4s cubic-bezier(.165, .84, .44, 1);
}
.top_main_visual._set_a > .visual_link > li.link02 > a > span {
  transition: opacity .4s 4.1s cubic-bezier(.165, .84, .44, 1),
    bottom .4s 4.1s cubic-bezier(.165, .84, .44, 1),
    color .4s cubic-bezier(.165, .84, .44, 1),
    background-color .4s cubic-bezier(.165, .84, .44, 1),
    border-color .4s cubic-bezier(.165, .84, .44, 1);
}
.top_main_visual._set_a > .visual_link > li.link03 > a > span {
  transition: opacity .4s 4.2s cubic-bezier(.165, .84, .44, 1),
    bottom .4s 4.2s cubic-bezier(.165, .84, .44, 1),
    color .4s cubic-bezier(.165, .84, .44, 1),
    background-color .4s cubic-bezier(.165, .84, .44, 1),
    border-color .4s cubic-bezier(.165, .84, .44, 1);
}
/* animation 2 */
._csstrans .top_main_visual._set_a._start > .visual_link > li > a > span {
  opacity: 1;
  bottom: calc(40 / 634 * 100%);
}
.top_main_visual._set_f > .visual_link > li > a > span {
  opacity: 1;
  bottom: calc(40 / 634 * 100%);
}

@media screen and (max-width:980px) {
  .top_main_visual > .visual_link > li > a > span {
    font-size: calc(2.783vw - 6.3736px); /* 20.9 -> 15 */
  }
  .top_main_visual > .visual_link > .link01 > a > span {
    padding-right: calc(4.717vw - 6.2264px); /* 40 -> 30 */
    padding-left: calc(4.717vw - 6.2264px);
  }
  .top_main_visual > .visual_link > .link02 > a > span {
    padding-right: calc(2.8302vw - 3.7358px); /* 24 -> 18 */
    padding-left: calc(2.8302vw - 3.7358px);
  }
  .top_main_visual > .visual_link > .link03 > a > span {
    padding-right: calc(3.7736vw - 4.9811px); /* 32 -> 24 */
    padding-left: calc(3.7736vw - 4.9811px);
  }
}

@media screen and (max-width:767px) {
  .top_main_visual > .bg_visual_link > li.link02 > .text01 {
    left: 48%;
    top: 42%;
  }
  .top_main_visual {
    padding-top: calc(360 / 750 * 100%);
    background-size: cover;
  }
  .top_main_visual > .main_visual_cover {
    width: calc(700 / 750 * 100%);
  }
  .top_main_visual > .bg_visual_link {
    width: 96%;
  }
  .top_main_visual > .visual_link {
    width: 86.47%;
  }
  .top_main_visual > .visual_link > li > a > span {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    line-height: 1.2;
    text-align: center;
    height: 36px;
  }
  .top_main_visual > .visual_link > li > a > span ._ls1 {
    letter-spacing: -1.5px;
  }
  .top_main_visual > .visual_link > .link01 > a > span {
    padding-right: 8px;
    padding-left: 8px;
  }
  .top_main_visual > .visual_link > .link02 > a > span {
    padding-right: 4px;
    padding-left: 4px;
  }
  .top_main_visual > .visual_link > .link03 > a > span {
    padding-right: 6px;
    padding-left: 6px;
  }

  .top_main_visual._set_f > .visual_link > li > a > span {
    bottom: 3px;
  }
  
}

/* ---- info_box ---- */
.info_box {
  background-color: rgb(218,218,218);
  color: rgb(224,29,24);
  min-height: 47px;
  padding-top: 8px;
  padding-bottom: 7px;
}
.info_box .info_list {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  font-size: 17.6px;
  height: 32px;
  overflow: hidden;
}
.info_box .info_list._open {
  height: auto;
  padding-top: 32px;
}
.info_box .info_list > li {
  position: relative;
  width: 100%;
  padding-right: 46px;
  padding-left: 36px;
  line-height: 32px;
}
.info_box .info_list > li:first-child::before {
  position: absolute;
  top: 4px;
  left: 0;
  width: 23px;
  height: 23px;
  border-radius: 12px;
  background-color: rgb(224,29,24);
  text-align: center;
  color: rgb(255,255,255);
  line-height: 23px;
  content: '!';
}
.info_box .info_list._open > li:first-child::before {
  top: -28px;
  width: calc(23px + 5em);
  content: '! お知らせ';
}
.info_box .info_list._open > li {
  padding-left: 2em;
}
.info_box .info_list._open > li::after {
  position: absolute;
  top: 0;
  left: 1em;
  content: '・';
}

.info_box .info_list > li > .btn_toggle_info {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 32px;
  height: 32px;
  cursor: pointer;
}
.info_box .info_list._open > li > .btn_toggle_info {
  top: -32px;
}
.info_box .info_list > li > .btn_toggle_info::before {
  display: block;
  position: absolute;
  top: 15px;
  right: 10px;
  width: 11px;
  height: 1.56px;
  padding: 0;
  background-color: rgb(0,0,0);
  content: '';
}
.info_box .info_list._close > li > .btn_toggle_info::after {
  display: block;
  position: absolute;
  top: 15px;
  right: 10px;
  width: 11px;
  height: 1.56px;
  padding: 0;
  background-color: rgb(0,0,0);
  transform: rotate(90deg);
  content: '';
}
.info_box .info_list._open > li > .btn_toggle_info::after {
  transform: rotate(0deg);
}

@media screen and (max-width:767px) {
  .info_box .info_list {
    font-size: 12px;
  }
  .info_box .info_list > li {
    line-height: 18px;
  }
}


/* ---- box01 ---- */
.box01 {
  padding-top: calc(86 / 1550 * 100%);
  padding-bottom: calc(74 / 1550 * 100%);
  background-image: url(../images/bg_box01.jpg);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
}

/* ---- box01 - contents_navi_box ---- */
.box01 .contents_navi_box {
  display: flex;
  flex-direction: row;
  justify-content: center;
  position: relative;
}
.box01 .contents_navi_box._start  {
  top: 0;
  opacity: 1;
}
.box01 .contents_navi_box > li {
  width: calc(278 / 1190 * 100%);
  margin-right: calc(30 / 1190 * 100%);
  margin-left: calc(30 / 1190 * 100%);
  position: relative;
  top: 100px;
  opacity: 0;
}
._csstrans .box01 .contents_navi_box > li.corporate {
  transition: opacity .8s cubic-bezier(.165, .84, .44, 1),
                  top .8s cubic-bezier(.165, .84, .44, 1);  
}
._csstrans .box01 .contents_navi_box > li.ir {
  transition: opacity .8s .2s cubic-bezier(.165, .84, .44, 1),
                  top .8s .2s cubic-bezier(.165, .84, .44, 1);  
}
._csstrans .box01 .contents_navi_box > li.sustainability {
  transition: opacity .8s .4s cubic-bezier(.165, .84, .44, 1),
                  top .8s .4s cubic-bezier(.165, .84, .44, 1);  
}
.box01 .contents_navi_box._start > li {
  top: 0;
  opacity: 1;
}
.box01 .contents_navi_box > li > a {
  display: block;
  position: relative;
  top: 0;
  left: 0;
  border-radius: 50%;
  padding-top: 100%;
  background-color: rgb(255,255,255);
  box-shadow: 4px 4px rgb(226,226,226);
  text-align: center;
  font-weight: 700;
  font-size: 23.1px;
  line-height: 1;
}
._csstrans .box01 .contents_navi_box > li > a {
  transition: background-color .2s cubic-bezier(.165, .84, .44, 1),
    top .2s cubic-bezier(.165, .84, .44, 1),
    left .2s cubic-bezier(.165, .84, .44, 1);
}
.box01 .contents_navi_box._start > li > a {
}
.box01 .contents_navi_box > li > a:hover {
  background-color: rgb(255, 245, 221);
  top: 3px;
  left: 3px;
  box-shadow: 1px 1px rgb(226,226,226);
}
.box01 .contents_navi_box > li > a::before {
  position: absolute;
  bottom: calc(126 / 278 * 100%);
  right: 50%;
  background-repeat: no-repeat;
  background-position: center top;
  background-size: contain;
  transform: translate3d(50%, 0, 0);
  content: '';
}
.box01 .contents_navi_box > li.corporate > a::before {
  width: calc(83 / 278 * 100%);
  height: calc(84 / 278 * 100%);
  background-image: url(../images/icon_corporate.svg);
}
.box01 .contents_navi_box > li.ir > a::before {
  width: calc(79 / 278 * 100%);
  height: calc(90 / 278 * 100%);
  background-image: url(../images/icon_ir.svg);
}
.box01 .contents_navi_box > li.sustainability > a::before {
  width: calc(95 / 278 * 100%);
  height: calc(92 / 278 * 100%);
  background-image: url(../images/icon_sustaina.svg);
}
.box01 .contents_navi_box > li > a::after {
  position: absolute;
  bottom: calc(26 / 278 * 100%);
  right: 50%;
  width: 20.4px;
  height: 15.9px;
  background-image: url(../../common/images/arrow_bottom.svg);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: contain;
  transform: translate3d(50%, 0, 0);
  content: '';
}
.box01 .contents_navi_box > li > a > span {
  display: block;
  margin-top: calc(-90 / 278 * 100%);
}
._csstrans .box01 .contents_navi_box > li > a > span {
  transition: opacity .4s .4s cubic-bezier(.165, .84, .44, 1);
}
.box01 .contents_navi_box._start > li > a > span {
}

@media screen and (max-width:980px) {
  .box01 .contents_navi_box > li {
    width: 217px;
  }
}

@media screen and (max-width:767px) {
  .box01 .contents_navi_box {
    justify-content: space-between;
  }
  .box01 .contents_navi_box > li {
    width: calc(113 / 355 * 100%);
    margin-right: 0;
    margin-left: 0;
  }
  .box01 .contents_navi_box > li > a {
    font-size: 14px;
    font-weight: 400;
    box-shadow: 2px 2px rgb(226,226,226);
  }
  .box01 .contents_navi_box > li > a::before {
    bottom: calc(104 / 220 * 100%);
  }
  .box01 .contents_navi_box > li.corporate > a::before {
  width: calc(83 / 220 * 100%);
  height: calc(84 / 220 * 100%);
  }
  .box01 .contents_navi_box > li.ir > a::before {
    width: calc(79 / 220 * 100%);
    height: calc(90 / 220 * 100%);
  }
  .box01 .contents_navi_box > li.sustainability > a::before {
    width: calc(95 / 220 * 100%);
    height: calc(92 / 220 * 100%);
  }
  .box01 .contents_navi_box > li > a::after {
    width: 12px;
    height: 10px;
  }
  .box01 .contents_navi_box > li > a > span {
    margin-top: calc(-90 / 220 * 100%);
    font-weight: 700;
  }
  .box01 .contents_navi_box > li.sustainability > a > span {
    letter-spacing: -1.5px;
  }
}


/* ---- box01 - banner_box ---- */
.box01 .banner_box {
  position: relative;
  margin-top: calc(99 / 1550 * 100%);
  /* opacity: 0;
  top: 200px; */
}
._csstrans .box01 .banner_box {
  transition: opacity .4s cubic-bezier(.165, .84, .44, 1),
    top .4s cubic-bezier(.165, .84, .44, 1);
}
._csstrans .box01 .banner_box._start {
  /* top: 0;
  opacity: 1; */
}
.box01 .banner_box > .banner_covid-19 {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  position: relative;
  top: 0;
  left: 0;
  width: 557px;
  height: 107px;
  margin-right: auto;
  margin-left: auto;
  border-radius: 6px;
  padding-right: 64px;
  background-color: rgb(255,255,255);
  box-shadow: 2px 2px rgb(226,226,226);
  font-size: 25.3px;
  line-height: 34.375px;
}
.box01 .banner_box > .banner_covid-19::before {
  display: block;
  position: absolute;
  top: 24px;
  left: 57px;
  width: 68px;
  height: 62px;
  background-image: url(../images/icon_heart_orange.svg);
  background-repeat: no-repeat;
  background-position: left center;
  background-size: contain;
  content: '';
}
._csstrans .box01 .banner_box > .banner_covid-19 {
  transition: background-color .2s cubic-bezier(.165, .84, .44, 1),
    top .2s cubic-bezier(.165, .84, .44, 1),
    left .2s cubic-bezier(.165, .84, .44, 1),
    box-shadow .2s cubic-bezier(.165, .84, .44, 1);
}
.box01 .banner_box > .banner_covid-19:hover {
  background-color: rgb(255, 245, 221);
  top: 2px;
  left: 2px;
  box-shadow: 1px 1px rgb(226,226,226);
}
.box01 .banner_box > .banner_covid-19::after {
  display: block;
  position: absolute;
  bottom: 16px;
  right: 16px;
  width: 16px;
  height: 20px;
  background-image: url(../../common/images/arrow_right.svg);
  background-repeat: no-repeat;
  background-position: left center;
  background-size: contain;
  content: '';
}

@media screen and (max-width:767px) {
  .box01 .banner_box > .banner_covid-19 {
    width: 316px;
    height: 64px;
    padding-right: 36px;
    font-size: 15px;
    line-height: 22px;
  }
  .box01 .banner_box > .banner_covid-19::before {
    top: 8px;
    left: 24px;
    width: 40px;
    height: 47px;
  }
  .box01 .banner_box > .banner_covid-19::after {
    width: 10px;
    bottom: 10px;
  }
}



/* ---- box01 - business_box ---- */
.box01 .business_box {
  position: relative;
  margin-top: calc(134 / 1550 * 100%);
}
.box01 .business_box .segment_box {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  padding-top: 12px;
  position: relative;
}
.box01 .business_box .segment_box > a {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  position: relative;
  width: calc(589 / 1190 * 100%);
  margin-top: 12px;
  background-color: rgb(255,255,255);
  top: 100px;
  opacity: 0;
}

.box01 .business_box .segment_box > .seg_area {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  position: relative;
  width: calc(589 / 1190 * 100%);
  margin-top: 12px;
  background-color: rgb(255,255,255);
  top: 100px;
  opacity: 0;
}

._csstrans .box01 .business_box .segment_box > a:nth-child(1) {
  transition: top .6s cubic-bezier(.165, .84, .44, 1),
          opacity .6s cubic-bezier(.165, .84, .44, 1),
    background-color .2s cubic-bezier(.165, .84, .44, 1); 
}
._csstrans .box01 .business_box .segment_box > .seg_area {
  transition: top .6s .2s cubic-bezier(.165, .84, .44, 1),
          opacity .6s .2s cubic-bezier(.165, .84, .44, 1),
     background-color .2s cubic-bezier(.165, .84, .44, 1); 
}
._csstrans .box01 .business_box .segment_box > a:nth-child(3) {
  transition: top .6s .4s cubic-bezier(.165, .84, .44, 1),
          opacity .6s .4s cubic-bezier(.165, .84, .44, 1),
     background-color .2s cubic-bezier(.165, .84, .44, 1); 
}
._csstrans .box01 .business_box .segment_box > a:nth-child(4) {
  transition: top .6s .6s cubic-bezier(.165, .84, .44, 1),
          opacity .6s .6s cubic-bezier(.165, .84, .44, 1),
     background-color .2s cubic-bezier(.165, .84, .44, 1);  
}
.box01 .business_box._start .segment_box > a {
  top: 0;
  opacity: 1;
}

.box01 .business_box._start .segment_box > .seg_area {
  top: 0;
  opacity: 1;
}

.box01 .business_box .segment_box > a::after {
  display: block;
  position: absolute;
  bottom: 17px;
  right: 17px;
  width: 16px;
  height: 20.6px;
  background-image: url(../../common/images/arrow_right.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center top;
  content: '';
}
.box01 .business_box .segment_box a.domestic_beverage::after {
  bottom: 42px;
}

.box01 .business_box .segment_box > a > .text {
  width: calc(300 / 589 * 100%);
  height: calc(100% - 55px);
  padding-top: calc(32 / 589 * 100%);
  padding-right: calc(20 / 589 * 100%);
  padding-left: calc(30 / 589 * 100%);
  font-size: 17.3px;
}


.box01 .business_box .segment_box > a:nth-child(1) > .text {
  width: calc(300 / 589 * 100%);
  height: calc(100% - 120px);
  padding-top: calc(32 / 589 * 100%);
  padding-right: calc(20 / 589 * 100%);
  padding-left: calc(30 / 589 * 100%);
  font-size: 17.3px;
}

.box01 .business_box .segment_box > .seg_area > .text {
  width: calc(300 / 589 * 100%);
  height: calc(100% - 120px);
  padding-top: calc(32 / 589 * 100%);
  padding-right: calc(20 / 589 * 100%);
  padding-left: calc(30 / 589 * 100%);
  font-size: 17.3px;
}

.box01 .business_box .segment_box > a:hover > .text {
  /* background-color: rgb(255, 245, 221); */
}
.box01 .business_box .segment_box > a .title_text {
  margin-bottom: calc(32 / 300 * 100%);
  text-align: center;
  font-size: 23.3px;
  line-height: 1;
}

.box01 .business_box .segment_box .seg_area .title_text {
  margin-bottom: calc(32 / 300 * 100%);
  text-align: center;
  font-size: 23.3px;
  line-height: 1;
}

.box01 .business_box .segment_box > a > .image {
  position: relative;
  width: calc(289 / 589 * 100%);
  background-color: rgb(246, 246, 246);
}

.box01 .business_box .segment_box .seg_area > .image {
  position: relative;
  width: calc(289 / 589 * 100%);
  background-color: rgb(246, 246, 246);
}

.box01 .business_box .segment_box > a:hover > .image {
  opacity: .7;
}
.box01 .business_box .segment_box > a > .image::after {
  display: block;
  position: absolute;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center top;
  content: '';
}

.box01 .business_box .segment_box .seg_area .image::after {
  display: block;
  position: absolute;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center top;
  content: '';
}
.box01 .business_box .segment_box > a.domestic_beverage > .image::after {
  top: calc(20 / 275 * 100%);
  right: calc(18 / 289 * 100%);
  width: calc(98.03 / 289 * 100%);
  height: calc(36.57 / 275 * 100%);
  background-image: url(../../common/images/logo_dydo.svg);
}

.box01 .business_box .segment_box .seg_area .image::after {
  top: calc(20 / 275 * 100%);
  right: calc(18 / 289 * 100%);
  width: calc(98.03 / 289 * 100%);
  height: calc(36.57 / 275 * 100%);
  background-image: url(../../common/images/logo_dydo.svg);
}

.box01 .business_box .segment_box > a.oem > .image::after {
  top: calc(19 / 275 * 100%);
  right: calc(19 / 289 * 100%);
  width: calc(97.21 / 289 * 100%);
  height: calc(30.83 / 275 * 100%);
  background-image: url(../../common/images/logo_daido.svg);
}
.box01 .business_box .segment_box > a.food_production > .image::after {
  top: calc(11 / 275 * 100%);
  right: calc(17 / 289 * 100%);
  width: calc(104.43 / 289 * 100%);
  height: calc(52.92 / 275 * 100%);
  background-image: url(../../common/images/logo_tarami.svg);
}
.box01 .business_box .segment_box > a > .image > img {
  width: 100%;
  height: auto;
}
.box01 .business_box .segment_box > a > .link {
  display: flex;
  width: 100%;
  height: 55px;
  padding-right: 60px;
  padding-left: 60px;
}
.box01 .business_box .segment_box > a.domestic_beverage > .link {
  background-color: rgb(253,237,233);
    padding-top: 40px;
    height: 120px;
}
.box01 .business_box .segment_box .seg_area a {
    width: 100%;
}

.box01 .business_box .segment_box .seg_area a.overseas_beverage .link {
  background-color: rgb(225,253,221);
  display: flex;
  position: relative;
  width: 100%;
  height: 40px;
  padding-right: 60px;
  padding-left: 60px;
}

.box01 .business_box .segment_box .seg_area .link::after {
  display: block;
  position: absolute;
  bottom: 12px;
  right: 17px;
  width: 16px;
  height: 20.6px;
  background-image: url(../../common/images/arrow_right.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center top;
  content: '';
}

.box01 .business_box .segment_box > a.oem > .link {
  background-color: rgb(206,238,250);
}
.box01 .business_box .segment_box > a.food_production > .link {
  background-color: rgb(255,242,235);
}
.box01 .business_box .segment_box > a > .link > span {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 55px;
}

.box01 .business_box .segment_box .seg_area .link > span {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 40px;
}
.box01 .business_box .segment_box > a > .link > span > span {
  display: block;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
}

.box01 .business_box .segment_box .seg_area .link > span > span {
  display: block;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
}

.box01 .business_box .segment_box > a:hover > .link > span > span {
  text-decoration: underline;
}
.box01 .business_box .segment_box .seg_area > a:hover > .link > span > span {
  text-decoration: underline;
}
.box01 .business_box .segment_box > a > .link > span > span ._small {
  font-size: 14px;
}

.box01 .business_box .segment_box .seg_area .link > span > span ._small {
  font-size: 14px;
}


@media screen and (max-width:980px) {
  .box01 .business_box .segment_box > a > .text {
    font-size: calc(1.5566vw + 2.0453px); /* 17.3 -> 14*/
  }
  .box01 .business_box .segment_box > a .title_text {
    font-size: calc(2.5vw - 1.2px); /* 23.3 -> 18 */
  }
    
  .box01 .business_box .segment_box .seg_area .text {
    font-size: calc(1.5566vw + 2.0453px); /* 17.3 -> 14*/
  }
  .box01 .business_box .segment_box .seg_area .title_text {
    font-size: calc(2.5vw - 1.2px); /* 23.3 -> 18 */
  }
}

@media screen and (max-width:767px) {
  #main_box .box01 .business_box .ttl_m_underbox {
    margin-top: 0;
  }
  .box01 .business_box .segment_box {
    padding-top: 0;
  }
  .box01 .business_box .segment_box > a {
    width: 100%;
  }
.box01 .business_box .segment_box .seg_area {
    width: 100%;
  }

.box01 .business_box .segment_box .seg_area .link::after {
  height: 13px;
}

    .box01 .business_box .segment_box > a:nth-child(1) > .text {
  height: calc(100% - 55px);
        font-size: 13px;
}
  .box01 .business_box .segment_box > a > .text {
    padding-top: 10px;
    padding-right: 8px;
    padding-left: 8px;
    font-size: 13px;
    line-height: 1.4;
  }
  .box01 .business_box .segment_box > a .title_text {
    font-size: 16px;
  }
  .box01 .business_box .segment_box > a::after {
    bottom: 19px;
    right: 14px;
    width: 10px;
    height: 13px;
  }
    
.box01 .business_box .segment_box a.domestic_beverage::after {
  bottom: 19px;
}
    
.box01 .business_box .segment_box > a.domestic_beverage > .link {
    padding-top: 0;
    height: 55px;
}
    .box01 .business_box .segment_box .seg_area .text {
    padding-top: 10px;
    padding-right: 8px;
    padding-left: 8px;
    font-size: 13px;
    line-height: 1.4;
  }
  .box01 .business_box .segment_box .seg_area .title_text {
    font-size: 16px;
  }
}

/* ---- box01 - update_box ---- */
.box01 .update_box {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin-top: calc(151 / 1550 * 100%);
}
.box01 .update_box .update_news_box {
  width: calc(827 / 1190 * 100%);
}
.box01 .update_box .update_news_box .date_list_box_i {
  padding-top: 9px;
}

.box01 .update_box .update_pickup {
  display: block;
  width: calc(336 / 1190 * 100%);
  margin-top: 40px;
  border-radius: 6px;
  background-color: rgb(255,255,255);
}
.box01 .update_box .update_pickup .info {
  position: relative;
  height: 100%;
  border-radius: 6px;
  /* background-color: rgb(163,163,163); */
  background-image: url(../images/sdgs_movie.jpg);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: contain;
}

.box01 .update_box .update_pickup_en_d .info {
  position: relative;
  height: 100%;
  border-radius: 6px;
  /* background-color: rgb(163,163,163); */
  background-image: url(../images/sdgs_movie.jpg);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: contain;
}

.box01 .update_box .update_pickup .info.result_p {
  position: relative;
  height: 100%;
  border-radius: 6px;
  /* background-color: rgb(163,163,163); */
  background-image: url(../images/result_2023_movie.jpg?ud=230829);/*決算動画*/
  /*background-image: url(../../ir/images/top/img01_06_3.jpg);オンライン説明会動画*/
  background-repeat: no-repeat;
  background-position: center -10px;/*決算動画*/
  /*background-position: center top;/*オンライン説明会動画*/
  background-size: contain;/*決算動画*/
  /*background-size: contain;/*オンライン説明会動画*/
}

.box01 .update_box .update_pickup .info .text {
  position: absolute;
  bottom: 0;
  width: 100%;
  text-align: center;
  color: rgb(255,255,255);
  border-radius: 0 0 6px 6px;
  background-color: rgb(163,163,163);
}
.box01 .update_box .update_pickup .info .text .title_text {
  font-size: 20.7px;
}
.box01 .update_box .update_pickup .info .text .lede {
  padding: 16px;
}

@media screen and (max-width:767px) {
  .box01 .update_box {
    flex-direction: column-reverse;
    justify-content: flex-start;
    margin-top: 60px;
  }
  .box01 .update_box .update_news_box {
    width: 100%;
    margin-top: 40px;
  }
  .box01 .update_box .update_pickup {
    position: relative;
    width: 100%;
    /*padding-top: calc(103px + 80%); 一つ表示用　*/
    padding-top: 0;　/*二つ表示用*/
    margin-top: 0;
    overflow: hidden;
  }
    
    
  .box01 .update_box .update_pickup .info {
    position: absolute;
    top: 0;
    height: auto;
    width: 100%;
    background-position: center bottom;
    padding-bottom: calc(546 / 672 * 100%);
    background-size: contain;
  }
.box01 .update_box .update_pickup .info.result_p {
   position: absolute;
    top: 0;
    height: auto;
    width: 100%;
    background-position: center 90px;/*決算*/
    /*background-position: center bottom;/*決算以外*/
    padding-bottom: calc(546 / 672 * 100%);/*決算*/
    /*padding-bottom: calc(450 / 672 * 100%);/*決算以外*/
    background-size: contain;
}
  .box01 .update_box .update_pickup .info .text {
    position: relative;
    bottom: auto;
    top: 0;
    padding-top: 10px;
    border-radius: 6px 6px 0 0;
  }
  .box01 .update_box .update_pickup .info .text .title_text {
    font-size: 18px;
  }
  .box01 .update_box .update_pickup .info .text .lede {
    padding: 4px 16px 10px;
  }
}

/* ---- box01 - update_box - update_pickup_d ---- */
.box01 .update_box .update_pickup {
  background-color: inherit;
}

.box01 .update_box .update_pickup_d {
  display: block;
  width: 100%;
  height: 25%;
}
.box01 .update_box .update_pickup_d:nth-child(1) {
    height: 70%;
    border-radius: 6px;
    margin-bottom: 5%;
}

.box01 .update_box .update_pickup_d .info {
  position: relative;
  height: 100%;
    border-radius:unset;
  /* background-color: rgb(163,163,163); */
/*  background-image: url(../images/sdgs_movie.jpg);*/
  background-image: url(../images/sharedresearch.jpg?ud=231011);
  background-repeat: no-repeat;
  background-position: center;
  background-size:contain;
}

.box01 .update_box .update_pickup_d .info.result_p {
  position: relative;
  border-radius: 6px;
  /* background-color: rgb(163,163,163); */
  /*background-image: url(../images/result_2024_08_movie.jpg?ud=240829);決算動画*/
  background-image: url(../../ir/images/top/img01_06_3.jpg);/*オンライン説明会動画*/
  background-repeat: no-repeat;
  background-position: center top;
 /*background-size: cover;決算動画*/
  background-size: contain;/*オンライン説明会動画*/
}

@media screen and (max-width:1280px) {
.box01 .update_box .update_pickup_d .info.result_p {
  background-size: cover;/*オンライン説明会動画*/
}
}

.box01 .update_box .update_pickup_d .info .text {
  position: absolute;
  bottom: 0;
  width: 100%;
  text-align: center;
  color: rgb(255,255,255);
  border-radius: 0 0 6px 6px;
  background-color: rgb(163,163,163);
}
.box01 .update_box .update_pickup_d .info .text .title_text {
  font-size: 20.7px;
}
.box01 .update_box .update_pickup_d .info .text .lede {
  padding: 2px;
}

@media screen and (max-width:767px) {
    
  .box01 .update_box .update_pickup_d {
    position: relative;
    width: 100%;
    padding-top: calc(103px + 80%);
    margin-top: 0;
    overflow: hidden;
  }
  .box01 .update_box .update_pickup_d .info {
    position: absolute;
    top: 0;
    height: auto;
    width: 100%;
    background-image: url(../images/sharedresearch_sp.jpg?ud=231011);
    background-position: center bottom;
    padding-bottom: calc(546 / 672 * 100%);
    background-size: contain;
  }
.box01 .update_box .update_pickup_d .info.result_p {
   position: absolute;
    top: 0;
    height: auto;
    width: 100%;
    /*background-image: url(../images/result_2024_08_movie.jpg?ud=240829);決算動画*/
    background-position: center 20px;
    padding-bottom: calc(546 / 672 * 100%);
    background-size: cover;
}
  .box01 .update_box .update_pickup_d .info .text {
    position: relative;
    bottom: auto;
    top: 0;
    padding-top: 10px;
    padding-bottom: 10px;
    border-radius: 6px 6px 0 0;
  }
  .box01 .update_box .update_pickup_d .info .text .title_text {
    font-size: 18px;
  }
  .box01 .update_box .update_pickup_d .info .text .lede {
    padding: 4px 16px 10px;
  }
}


/* ---- box01 - update_box - update_pickup_en_d ---- */

.box01 .update_box .update_pickup_en_d {
  display: block;
  width: 100%;
  height: 25%;
}
.box01 .update_box .update_pickup_en_d:nth-child(1) {
    height: 65%;
    border-radius: 6px;
    margin-bottom: 12%;
}

.box01 .update_box .update_pickup_en_d .info.en_banner {
  position: relative;
  height: 100%;
  border-radius:unset;
  background-image: url(../images/sharedresearch_en.jpg?ud=231011);
  background-repeat: no-repeat;
  background-position: center;
  background-size:contain;
}


@media screen and (max-width:767px) {
    
  .box01 .update_box .update_pickup_en_d {
    position: relative;
    width: 100%;
    padding-top: calc(103px + 80%);
    margin-top: 0;
    overflow: hidden;
  }
  .box01 .update_box .update_pickup_en_d .info.en_banner {
    position: absolute;
    top: 0;
    height: auto;
    width: 100%;
    background-image: url(../images/sharedresearch_en_sp.jpg?ud=231011);
    background-position: center bottom;
    padding-bottom: calc(546 / 672 * 100%);
    background-size: contain;
  }
}



/* ---- box02 ---- */
.box02 {
  padding-top: calc(80 / 1550 * 100%);
  padding-bottom: calc(135 / 1550 * 100%);
  background-color: rgb(226,226,226);
}
.news_box .date_list_box_i .ttl_news_box.dydo_ghd,
.news_box .date_list_box_i .ttl_news_box.dydo,
.news_box .date_list_box_i .ttl_news_box.tarami {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: relative;
  padding-left: 125px;
}
.news_box .date_list_box_i .ttl_news_box.dydo_ghd,
.news_box .date_list_box_i .ttl_news_box.dydo {
  height: 39px;
}
.news_box .date_list_box_i .ttl_news_box.tarami {
  height: 54px;
}
.news_box .date_list_box_i .ttl_news_box.dydo_ghd::before,
.news_box .date_list_box_i .ttl_news_box.dydo::before,
.news_box .date_list_box_i .ttl_news_box.tarami::before {
  position: absolute;
  top: 0;
  left: 0;
  background-repeat: no-repeat;
  background-size: contain;
  content: '';
}
.news_box .date_list_box_i .ttl_news_box.dydo_ghd::before,
.news_box .date_list_box_i .ttl_news_box.dydo::before {
  width: 104px;
  height: 39px;
  background-image: url(../../common/images/logo_dydo.svg);
}
.news_box .date_list_box_i .ttl_news_box.tarami::before {
  width: 106px;
  height: 54px;
  background-image: url(../../common/images/logo_tarami.svg);
}
.news_box .date_list_box_i .ttl_news_box > span {
  display: block;
  line-height: 1;
}
.news_box .date_list_box_i .ttl_news_box.dydo_ghd > span,
.news_box .date_list_box_i .ttl_news_box.dydo > span {
  padding-bottom: 8px;
}
.news_box .date_list_box_i .ttl_news_box.tarami > span {
  padding-top: 12px;
}


@media screen and (max-width:767px) {
  .news_box .date_list_box_i .ttl_news_box.dydo_ghd,
  .news_box .date_list_box_i .ttl_news_box.dydo,
  .news_box .date_list_box_i .ttl_news_box.tarami {
    padding-left: 104px;
  }
  .news_box .date_list_box_i .ttl_news_box.dydo_ghd::before,
  .news_box .date_list_box_i .ttl_news_box.dydo::before,
  .news_box .date_list_box_i .ttl_news_box.tarami::before {
    top: 4px;
    left: 14px;
  }
  .news_box .date_list_box_i .ttl_news_box.dydo_ghd::before,
  .news_box .date_list_box_i .ttl_news_box.dydo::before {
    width: 70px;
    height: 26px;
  }
  .news_box .date_list_box_i .ttl_news_box.dydo_ghd,
  .news_box .date_list_box_i .ttl_news_box.dydo {
    height: 32px;
  }
  .news_box .date_list_box_i .ttl_news_box.tarami {
    height: 39px;
  }
  .news_box .date_list_box_i .ttl_news_box.tarami::before {
    width: 68px;
    height: 35px;
  }
  .news_box .date_list_box_i .ttl_news_box.dydo_ghd > span,
  .news_box .date_list_box_i .ttl_news_box.dydo > span {
    padding-bottom: 0;
  }
}