@charset "utf-8";



/* ----------------

  Sustainability

---------------- */

.header_inner .main_navigation > li.nav-3 > a {

    color: rgb(208,18,27);

}



.header_inner .main_navigation > li.nav-3 > a::before {

    background-image: url(../../common/images/arrow_bottom_r.svg);

}





/* ----------------

  title

---------------- */

.gropu_page_title {

  position: relative;

  margin-top: 72px;

  padding-top: 8px;

}



.priority_issues #main_box .page_title {

  margin-top: 0;

}



@media screen and (max-width:767px) {

  .gropu_page_title {

    margin-top: 16px;

  }

}



.gropu_page_title::before {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 60px;

  content: '';

}



html[lang="en"] .gropu_page_title::before {

  height: 60px;

}



.health .gropu_page_title::before {

  background-color: rgb(253, 237, 233);

}



.innovation .gropu_page_title::before {

  background-color: rgb(229, 240, 250);

}



.society .gropu_page_title::before {

  background-color: rgb(229, 246, 238);

}



.people .gropu_page_title::before {

  background-color: rgb(255, 242, 235);

}



.gropu_page_title::after {

  position: absolute;

  top: calc(50% - 9px);

  line-height: 1.4;

  padding-left: 0;

  left: 0;

  font-weight: 700;

  font-size: 18px;

  color: rgb(88, 88, 88);

  transform: translate3d(0, -50%, 0);

}



html[lang="en"] .gropu_page_title::after {

  top: calc(50% - 7px);

  line-height: 1.1;

}



.health .gropu_page_title::after {

  left: 150px;

}



.innovation .gropu_page_title::after {

  left: 290px;

}



.society .gropu_page_title::after {

  left: 150px;

}



.people .gropu_page_title::after {

  left: 120px;

}



html[lang="en"] .health .gropu_page_title::after {

  left: 170px;

}



html[lang="en"] .innovation .gropu_page_title::after {

  left: 230px;

}



html[lang="en"] .society .gropu_page_title::after {

  left: 250px;

}



html[lang="en"] .people .gropu_page_title::after {

  left: 180px;

}



.gropu_page_title .ttls01 {

  line-height: 1.7;

}



@media screen and (max-width:767px) {

  .gropu_page_title::before {

    height: 52px;

  }



  html[lang="en"] .gropu_page_title::before {

    height: 52px;

  }



  .gropu_page_title::after {

    top: calc(50% - 5px);

    font-size: 14px;

    line-height: 1.2;

    text-align: right;

  }



  html[lang="en"] .gropu_page_title::after {

    top: calc(50% - 3px);

  }



  .health .gropu_page_title::after {

    left: 110px;

  }



  .innovation .gropu_page_title::after {

    left: 210px;

  }



  .society .gropu_page_title::after {

    left: 110px;

  }



  .people .gropu_page_title::after {

    left: 90px;

  }



  html[lang="en"] .health .gropu_page_title::after {

    left: 130px;

  }



  html[lang="en"] .innovation .gropu_page_title::after {

    left: 210px;

  }



  html[lang="en"] .society .gropu_page_title::after {

    left: 190px;

  }



  html[lang="en"] .people .gropu_page_title::after {

    left: 130px;

  }



  .sustainability_quality_control .gropu_page_title::after {

    /* top: 1px;

    width: 160px;

    padding-left: 0;*/

  }

}



/*

.sustainability_delights .gropu_page_title::after {

  content: 'お客様満足度向上への取り組み';

}

.sustainability_quality_control .gropu_page_title::after {

  content: '安全・安心への取り組み';

}

.sustainability_fair_trade .gropu_page_title::after {

  content: '公正なマーケティングと表示';

}

.sustainability_development .gropu_page_title::after {

  content: '社会的価値の高い新薬の開発';

}

*/

.sustainability_easy_to_work .gropu_page_title::after,

.sustainability_health_declaration .gropu_page_title::after,

.sustainability_health_management .gropu_page_title::after {

  content: '健康経営の推進';

}



.sustainability_principle .gropu_page_title::after,

.sustainability_training .gropu_page_title::after {

  content: 'イノベーション人材の育成';

}



.sustainability_attempt_message .gropu_page_title::after{

  content: 'DX：メッセージとDXの必要性';

}

.sustainability_strategy_goal .gropu_page_title::after,

.sustainability_strategy_promotion_system .gropu_page_title::after{

  content: 'DX：ありたい姿への実現に向けたDX戦略';

}

.sustainability_transformation_education .gropu_page_title::after,

.sustainability_transformation_business_process .gropu_page_title::after,

.sustainability_transformation_it_infrastructure .gropu_page_title::after{

  content: 'DX：変革への取り組み';

}

@media screen and (max-width:400px) {

  .sustainability_principle .gropu_page_title::after,

  .sustainability_training .gropu_page_title::after {

    left: auto;

    right: 0;

    width: 100px;

  }

}



/*

.sustainability_smart_operation .gropu_page_title::after,

.sustainability_inside_sales .gropu_page_title::after {

  content: '新たな働き方への移行';

}

.sustainability_environmental_policy .gropu_page_title::after {

  content: '環境方針（グループ環境方針）';

}

.sustainability_eco_business .gropu_page_title::after,

.sustainability_eco_product .gropu_page_title::after,

.sustainability_eco_containers .gropu_page_title::after {

  content: '資源循環型社会への貢献';

}

.sustainability_eco_delivery .gropu_page_title::after,

.sustainability_eco_jihanki .gropu_page_title::after,

.sustainability_eco_activity .gropu_page_title::after {

  content: '気候変動緩和・適応への取り組み';

}

*/

.tcfd_report .gropu_page_title::after {

  content: 'TCFD提言に基づく開示';

}

.sustainability_eco_lifecycle .gropu_page_title::after,

.sustainability_eco_vending_machine .gropu_page_title::after,

.sustainability_eco_package .gropu_page_title::after,

.sustainability_eco_operation .gropu_page_title::after {

  content: '自販機ビジネスにおける環境配慮';

}





/*

.sustainability_eco_employees .gropu_page_title::after {

  content: '従業員による環境保全';

}

*/

.sustainability_growth .gropu_page_title::after,

.sustainability_customers .gropu_page_title::after,

.sustainability_communication .gropu_page_title::after,

.sustainability_association .gropu_page_title::after,

.sustainability_packer .gropu_page_title::after {

  content: 'ステークホルダーとの対話';

}



.sustainability_society_detail .gropu_page_title::after {

  content: '社会貢献活動';

}



/*

.sustainability_activity .gropu_page_title::after {

  content: '地域コミュニティへの貢献';

}

.sustainability_diversity .gropu_page_title::after {

  content: 'ダイバーシティ';

}

*/



/*

html[lang="en"] .sustainability_delights .gropu_page_title::after {

  content: 'Efforts toward greater customer satisfaction';

}

html[lang="en"] .sustainability_quality_control .gropu_page_title::after {

  content: 'Efforts toward higher safety and security';

}

html[lang="en"] .sustainability_fair_trade .gropu_page_title::after {

  content: 'Fair marketing and labeling';

}

html[lang="en"] .sustainability_development .gropu_page_title::after {

  content: 'Development of new drugs with high social values';

}

*/



html[lang="en"] .sustainability_easy_to_work .gropu_page_title::after,

html[lang="en"] .sustainability_health_declaration .gropu_page_title::after,html[lang="en"] .sustainability_health_management .gropu_page_title::after {

  content: 'Promotion of health management';

}



html[lang="en"] .sustainability_principle .gropu_page_title::after,

html[lang="en"] .sustainability_training .gropu_page_title::after {

  content: 'Development of innovation in human resources';

}



/*

html[lang="en"] .sustainability_smart_operation .gropu_page_title::after,

html[lang="en"] .sustainability_inside_sales .gropu_page_title::after {

  content: 'Transition to new ways of working';

}

html[lang="en"] .sustainability_environmental_policy .gropu_page_title::after {

  content: 'Environmental Policy';

}

html[lang="en"] .sustainability_eco_business .gropu_page_title::after,

html[lang="en"] .sustainability_eco_product .gropu_page_title::after,

html[lang="en"] .sustainability_eco_containers .gropu_page_title::after {

  content: 'Contribution to resource-recycling society';

}

html[lang="en"] .sustainability_eco_delivery .gropu_page_title::after,

html[lang="en"] .sustainability_eco_natural_energy .gropu_page_title::after,

html[lang="en"] .sustainability_eco_activity .gropu_page_title::after {

  content: 'Efforts for climate change mitigation and adaptation';

}

*/



/*

html[lang="en"] .sustainability_eco_employees .gropu_page_title::after {

  content: 'Environmental Activities by Our Employees';

}

*/

html[lang="en"] .tcfd_report .gropu_page_title::after {

  content: 'Disclosure based on the TCFD recommendations';

}

html[lang="en"] .sustainability_eco_lifecycle .gropu_page_title::after,

html[lang="en"] .sustainability_eco_vending_machine .gropu_page_title::after,

html[lang="en"] .sustainability_eco_package .gropu_page_title::after,

html[lang="en"] .sustainability_eco_operation .gropu_page_title::after {

  content: 'Environmental considerations in vending machine business';

}



html[lang="en"] .sustainability_growth .gropu_page_title::after,

html[lang="en"] .sustainability_customers .gropu_page_title::after,

html[lang="en"] .sustainability_communication .gropu_page_title::after,

html[lang="en"] .sustainability_association .gropu_page_title::after,

html[lang="en"] .sustainability_packer .gropu_page_title::after {

  content: 'Dialogues with stakeholders';

}



/*

html[lang="en"] .sustainability_society .gropu_page_title::after {

  content: 'Social contribution activities';

}

html[lang="en"] .sustainability_activity .gropu_page_title::after {

  content: 'Contribution to local community';

}

html[lang="en"] .sustainability_diversity .gropu_page_title::after {

  content: 'Diversity';

}

*/





.priority_issues .ttls01 {

  position: relative;

  height: 74px;

}



.priority_issues .ttls01::before,

.priority_issues .ttls01::after {

  position: absolute;

  background-repeat: no-repeat;

  background-size: contain;

  background-position: center center;

  content: '';

}



.priority_issues .ttls01::after {

  bottom: 36px;

  left: 66px;

}



.priority_issues.health .ttls01::before {

  top: 0;

  left: 1.5px;

  width: 44px;

  height: 44px;

  background-image: url(../images/icon_health.svg);

}



.priority_issues.health .ttls01::after {

  width: 58px;

  height: 27px;

  background-image: url(../images/txt_health.svg);

}



.priority_issues.innovation .ttls01::before {

  top: 2px;

  left: 4px;

  width: 37.3px;

  height: 45.3px;

  background-image: url(../images/icon_innovation.svg);

}



.priority_issues.innovation .ttls01::after {

  width: 194px;

  height: 25px;

  background-image: url(../images/txt_innovation.svg);

}



.priority_issues.society .ttls01::before {

  top: 3px;

  left: 1px;

  width: 44.2px;

  height: 34.8px;

  background-image: url(../images/icon_society.svg);

}



.priority_issues.society .ttls01::after {

  width: 58px;

  height: 27px;

  background-image: url(../images/txt_society.svg);

}



.priority_issues.people .ttls01::before {

  top: 8px;

  left: 1px;

  width: 49px;

  height: 35.5px;

  background-image: url(../images/icon_people.svg);

}



.priority_issues.people .ttls01::after {

  width: 26px;

  height: 26px;

  background-image: url(../images/txt_people.svg);

}



@media screen and (max-width:767px) {

  .priority_issues .ttls01 {

    height: 54px;

  }



  .priority_issues .ttls01::after {

    bottom: 26px;

    left: 50px;

  }



  .priority_issues.health .ttls01::before {

    width: 33px;

    height: 33px;

  }



  .priority_issues.health .ttls01::after {

    width: 43.5px;

    height: 20.25px;

  }



  .priority_issues.innovation .ttls01::before {

    top: 1.5px;

    left: 3px;

    width: 28px;

    height: 34px;

  }



  .priority_issues.innovation .ttls01::after {

    width: 145.5px;

    height: 18.8px;

  }



  .priority_issues.society .ttls01::before {

    top: 2px;

    width: 33.2px;

    height: 26px;

  }



  .priority_issues.society .ttls01::after {

    width: 43.5px;

    height: 20.3px;

  }



  .priority_issues.people .ttls01::before {

    top: 6px;

    width: 36.8px;

    height: 26.6px;

  }



  .priority_issues.people .ttls01::after {

    width: 19.5px;

    height: 19.5px;

  }

}





/* modal ------------------------------ */



.modal {

  display: none;

  color: #fff;

}



.modal_box {

  position: fixed;

  top: 50%;

  left: 50%;

  width: 90%;

  max-width: 980px;

  max-height: 560px;

  padding: 10px;

  background-color: #fff;

  z-index: 10000;

  transform: translate3d(-50%, -50%, 0);

}



.modal_area_box {

  position: relative;

  padding-top: calc(9 / 16 * 100%);

}

.modal_area_box .modal_area {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

}

.modal_area_box .modal_area iframe {

  width: 100%;

  height: 100%;

}



.modal_area_box .modal_close {

  position: absolute;

  top: -25px;

  right: -25px;

  width: 40px;

  height: 40px;

  background: url(/common/images/tag_306.png) no-repeat;

  cursor: pointer;

}



.modal_area_capition {

  display: none;

  padding-top: 10px;

  color: #333;

  font-size: 92%;

  font-weight: bold;

}



.modal_box p {

  padding-bottom: 2px;

  text-align: right;

}



.modalbg {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  z-index: 9998;

}



.modalbgi {

  position: fixed;

  width: 100%;

  height: 100%;

  background-color: #000;

  opacity: 0.8;

  filter: alpha(opacity=80);

  -moz-opacity: 0.80;

  z-index: 9999;

}



.modal_box .ryakureki_img {

  width: 646px;

  height: 600px;

  margin: 0 auto;

}



.movie_btn {

  cursor: pointer;

}



.movie_btn:hover {

  opacity: 0.7;

}











#main_box .ttl_s.label-2,

#main_box .ttl_s.label-3,

#main_box .ttl_s.label-ghd,

#main_box .ttl_s.label-domestic_beverage,

#main_box .ttl_s.label-overseas_beverage,

#main_box .ttl_s.label-oem,

#main_box .ttl_s.label-food_production {

  padding-top: 37px;

  padding-bottom: 7px;

  background-repeat: no-repeat;

  background-position: left top;

}



#main_box .ttl_s.label-2 {

  background-image: url(../images/label-2.png);

}



#main_box .ttl_s.label-3 {

  background-image: url(../images/label-3.png);

}



#main_box .ttl_s.label-ghd {

  background-image: url(../images/label-ghd.png);

}



#main_box .ttl_s.label-domestic_beverage {

  background-image: url(../images/label-domestic_beverage.png);

}



#main_box .ttl_s.label-overseas_beverage {

  background-image: url(../images/label-overseas_beverage.png);

}



#main_box .ttl_s.label-oem {

  background-image: url(../images/label-oem.png);

}



#main_box .ttl_s.label-food_production {

  background-image: url(../images/label-food_production.png);

}



@media screen and (max-width:409px) {

  #main_box .ttl_s.label-3 {

    padding-top: 73px;

    background-image: url(../images/label-3-sp.png);

  }

}





#main_box .border_title_box {

  border: 3px solid #dbdbdb;

}



#main_box .border_title_box .ttl_d {

  clear: both;

  border-bottom: 1px #dbdbdb solid;

  padding: 17px 17px 10px;

  font-weight: 700;

  font-size: 17px;

  line-height: 1;

}



#main_box .border_title_box .text {

  padding: 12px 17px 16px;

}



#main_box .box_3col {

  display: flex;

  justify-content: space-between;

}



#main_box .box_3col li {

  display: block;

  width: calc(195 / 620 * 100%);

  font-size: 12px;

  line-height: 1.44;

}



#main_box .box_3col li:nth-child(3n) {}





@media screen and (max-width:767px) {

  #main_box .border_title_box .ttl_d {

    padding: 10px;

    font-size: 15px;

  }



  .border_title_box .text {

    padding: 10px;

  }

}







.pickup_tag::after {

  position: absolute;

  top: 0;

  right: 0;

  border: 1px transparent solid;

  padding-right: .5em;

  padding-left: .5em;

  font-size: 12px;

  line-height: 18.6px;

  background-color: rgb(255, 255, 255);

}



.pickup_tag.tag_dydo::after {

  color: rgb(225, 90, 36);

  border-color: rgb(225, 90, 36);

  content: 'ダイドードリンコ';

}





#main_box .anchor_navi_box {

  display: flex;

  justify-content: space-between;

}



#main_box .anchor_navi_box > li {

  display: block;

  width: calc(33.33% - 16px);

}



#main_box .anchor_navi_box._col2 > li {

  width: calc(50% - 16px);

}



#main_box .anchor_navi_box > li > a {

  position: relative;

  display: flex;

  height: 100%;

  padding-right: 24px;

  padding-left: 4px;

  background-color: rgb(218, 218, 218);

  border: 2px rgb(218, 218, 218) solid;

}



#main_box .anchor_navi_box > li > a > span {

  display: flex;

  justify-content: center;

  align-items: center;

  width: 100%;

  min-height: 58px;

}



#main_box .anchor_navi_box > li > a > span > span {

  display: block;

  font-size: 112.5%;

  font-weight: 700;

  line-height: 1.4;

}



#main_box .anchor_navi_box > li > a::before,

#main_box .anchor_navi_box > li > a::after {

  position: absolute;

  display: block;

  top: calc(50% + 2px);

  right: 12px;

  width: 1px;

  height: 12px;

  background-color: rgb(0, 0, 0);

  content: '';

}



#main_box .anchor_navi_box > li > a::before {

  transform: rotate(-30deg) translate3d(0, -50%, 0);

}



#main_box .anchor_navi_box > li > a::after {

  transform: rotate(30deg) translate3d(0, -50%, 0);

}



#main_box .anchor_navi_box > li > a:hover {

  background-color: rgb(255, 255, 255);

}



#main_box .anchor_navi_box > li > a.c_d:hover {

  border-color: rgb(247, 175, 13);

  color: rgb(247, 175, 13);

}



#main_box .anchor_navi_box > li > a.c_d:hover::before,

#main_box .anchor_navi_box > li > a.c_d:hover::after {

  background-color: rgb(247, 175, 13);

}



#main_box .anchor_navi_box > li > a.c_p:hover {

  border-color: rgb(121, 209, 217);

  color: rgb(121, 209, 217);

}



#main_box .anchor_navi_box > li > a.c_p:hover::before,

#main_box .anchor_navi_box > li > a.c_p:hover::after {

  background-color: rgb(121, 209, 217);

}



#main_box .anchor_navi_box > li > a.c_f:hover {

  border-color: rgb(229, 118, 99);

  color: rgb(229, 118, 99);

}



#main_box .anchor_navi_box > li > a.c_f:hover::before,

#main_box .anchor_navi_box > li > a.c_f:hover::after {

  background-color: rgb(229, 118, 99);

}



@media screen and (max-width:767px) {

  html[lang="en"] #main_box .anchor_navi_box > li {

    display: block;

    width: auto;

    margin-right: 8px;

  }



  html[lang="en"] #main_box .anchor_navi_box > li:last-child {

    margin-right: 0;

  }



  html[lang="en"] #main_box .anchor_navi_box > li > a > span > span {

    font-size: 13px;

  }

}









/* co2target_box ------- */

.co2target_box {

  display: flex;

  justify-content: space-between;

}

.co2target_box > li {

  width: calc(260 / 794 * 100%);

  border: 2px rgb(137,200,16) solid;

  border-radius: 16px;

}

.co2target_box > li > .title {

  width: 126px;

  height: 57px;

  margin: -33px auto 0;

  background-image: url(../images/ttl_goal.svg);

  background-repeat: no-repeat;

  background-position: center center;

  background-size: contain;

}

html[lang="en"] .co2target_box > li > .title {

  background-image: url(../../en/sustainability/images/ttl_goal.svg);

}

.co2target_box > li > .image {

  width: 100%;

  height: 1px;

  background-repeat: no-repeat;

  background-position: center center;

  background-size: contain;

}

.co2target_box > .goal01 > .image {

  background-image: url(../images/img_goal01.svg);

  padding-top: calc(222 / 255 * 100%);

}

.co2target_box > .goal02 > .image {

  background-image: url(../images/img_goal02.svg);

  padding-top: calc(222 / 255 * 100%);

}

.co2target_box > .goal03 > .image {

  background-image: url(../images/img_goal03.svg);

  padding-top: calc(204 / 255 * 100%);

}



html[lang="en"] .co2target_box > .goal01 > .image {

  background-image: url(../../en/sustainability/images/img_goal01.svg);

  padding-top: calc(255 / 255 * 100%);

}

html[lang="en"] .co2target_box > .goal02 > .image {

  background-image: url(../../en/sustainability/images/img_goal02.svg);

  padding-top: calc(255 / 255 * 100%);

}

html[lang="en"] .co2target_box > .goal03 > .image {

  background-image: url(../../en/sustainability/images/img_goal03.svg);

  padding-top: calc(250 / 255 * 100%);

}



.co2target_box > li > .note {

  font-size: 10px;

  padding: 8px;

}

.co2target_box > li > .note > li {

  padding-left: 1em;

  text-indent: -1em;

  line-height: 1.2;

  margin-top: 4px;

}

.co2target_box > li > .note > li._idt2 {

  padding-left: 2em;

  text-indent: -2em;

}

@media screen and (max-width: 767px) {

  .co2target_box {

    flex-wrap: wrap;

  }

  .co2target_box > li {

    width: 100%;

    margin-bottom: 40px;

  }

  .co2target_box > li:last-child {

    margin-bottom: 24px;

  }

}



.esg_ranking_box {

  display: flex;

  justify-content: center;

  flex-wrap: wrap;

}

.esg_ranking_box > li {

  width: 80%;

  max-width: 220px;

}

#main_box .esg_ranking_box > li {

  margin-right: 32px;

}

#main_box .esg_ranking_box > li:last-child {

  margin-right: 0;

}

#side_box .esg_ranking_box > li {

  margin-bottom: 32px;

}

#side_box .esg_ranking_box > li > a {

  display: block;

  border-bottom-style: none;

  padding: 0;

}

#side_box .esg_ranking_box > li > a::after {

  display: none;

}



@media screen and (max-width: 920px){

  #side_box .esg_ranking_box {

    display: none;

  }

}



@media screen and (max-width: 767px){

  .esg_ranking_box {

  }

  #main_box .esg_ranking_box > li {

    max-width: 110px;

    margin-right: 0;

  }

}