﻿
/*-------------------------------------
** TOP AREA Worldwide (CSR)
-------------------------------------*/
.area-worldwide{
  position: relative;
  min-height: 190px;
}
.area-worldwide .inner{
  position: absolute;
  top: 0%;
}
@media only screen and (min-width: 769px) {
  .area-worldwide .inner{
    width: 100%;
    height: 100%;
  }
  .area-worldwide .nav-btn-01{
    width: 160px;
    height: 160px;
    border-radius: 80px;
    border: 1px solid;
    position: absolute;
  }
  .area-worldwide .nav-btn-01 a{
    height: 140px;
    max-width: 140px;
    margin: 10px auto;
    overflow: hidden;
    padding: 0 0 0 30px;
  }
  .area-worldwide .nav-btn-01.area-americas{
    background-color: #cedefb;
    border-color: #4f89f1;
    box-shadow: 0px 3px #4f89f1;
    top: 21%;
    left: 10%;
    width:140px;
    height:140px;
  }
  .area-worldwide .nav-btn-01.area-americas a{
    height: 120px;
    max-width: 120px;
    margin: 10px auto;
    overflow: hidden;
    padding: 0 0 0 20px;
  }

  .area-worldwide .nav-btn-01.area-emea{
    background-color: #98e0f7;
    border-color: #10a0ce;
    box-shadow: 0px 3px #10a0ce;
    top: 35%;
    left: 49%;
  }
  .area-worldwide .nav-btn-01.area-emea a{
    padding: 0 0 0 10px;
  }

  .area-worldwide .nav-btn-01.area-asia{
    background-color: #c1bcf9;
    border-color: #8f86f4;
    box-shadow: 0px 3px #8f86f4;
    top: 68%;
    left: 75%;
    width:140px;
    height:140px;
  }
  .area-worldwide .nav-btn-01.area-asia a{
    height: 120px;
    max-width: 120px;
    margin: 10px auto;
    overflow: hidden;
    padding: 0 0 0 10px;
  }

  .area-worldwide .nav-btn-01.area-china{
    background-color: #e4bcf9;
    border-color: #b775da;
    box-shadow: 0px 3px #b775da;
    top: 20%;
    left: 71%;
    width:120px;
    height:120px;
  }

  .area-worldwide .nav-btn-01.area-china a{
    height: 100px;
    max-width: 100px;
    margin: 10px auto;
    overflow: hidden;
    padding: 0 0 0 30px;
  }

  .area-worldwide .nav-btn-01.area-japan{
    background-color: #74a0f4;
    border-color: #395994;
    box-shadow: 0px 3px #395994;
    top: 23%;
    left: 86%;
    width:120px;
    height:120px;
  }

  .area-worldwide .nav-btn-01.area-japan a{
    height: 100px;
    max-width: 100px;
    margin: 10px auto;
    overflow: hidden;
    padding: 0 0 0 30px;
  }

  .area-worldwide .nav-btn-01.area-emea a>span,
  .area-worldwide .nav-btn-01.area-asia a>span{
    min-width: 110px;
    text-align:center;
  }

  /*safari fix size*/
  .safari .area-worldwide .nav-btn-01.area-emea a{
    margin: 10px;
  }
  .safari .area-worldwide .nav-btn-01.area-asia a{
    margin: 13px;
  }

  /* region line break */
  .region_br::before {
      content: "\A" ;
      white-space: pre ;
  }
}
/* Worldwide IE9-IE8以外*/
@media only screen and (max-width: 768px) {
  .csstransitions .area-worldwide .inner{
    position: absolute;
    display: table;
    vertical-align: middle;
    top:50%;
    transform: translateY(-50%);
  }
  .csstransitions .area-worldwide .img{
    padding-top: 1.2375em;
  }
  .csstransitions .area-worldwide .nav-btn-01{
    display: block;
  }
  .csstransitions .area-worldwide .nav-btn-01.area-japan{
    margin-bottom: 2.5em;
  }
}
/* Worldwide IE9-IE8 FIX*/
.no-csstransitions .area-worldwide .inner{
  width: 905px;
  height: 459px;
}
/* Worldwide IE8 FIX*/
.no-canvas .area-worldwide .nav-btn-01{
  position: absolute;
  padding-left: 15px;
  max-width: 160px;
}
.no-canvas .area-worlwide .nav-btn-01.area-americas{
  background-color: #cedefb;
  top: 21%;
  left: 10%;
}
.no-canvas .area-worldwide .nav-btn-01.area-emea{
  background-color: #98e0f7;
  top: 35%;
  left: 49%;
}
.no-canvas .area-worldwide .nav-btn-01.area-asia{
  background-color: #c1bcf9;
  top: 15%;
  left: 73%;
}
.no-canvas .area-worldwide .nav-btn-01.area-china{
    background-color: #e4bcf9;
    top: 13%;
    left: 67%;
}
.no-canvas .area-worldwide .nav-btn-01.area-japan{
    background-color: #74a0f4;
    top: 23%;
    left: 86%;
}

/* reports */

@media only screen and (min-width: 769px) {
  .report_count{
      text-align:center;
      margin:3rem 0 0 0;
      font-size:6rem;
      font-weight:bold;
      color:#666;
      line-height:1.1;
  }
  .report_count:before, .report_count:after {
      font-size:2.4rem;
      font-weight: 500;
      color:#666;
      position:relative;
      left:0;
      bottom:2px;
  }
/*  .report_count:before {
      content: "Total";
      padding: 0 1rem 0 0;
      letter-spacing: .05em;
  }
  .report_count:after {
      content: "events held";
      padding: 0 0 0 0.5rem;
      letter-spacing: .03em;
  }*/
  .report_count_note{
      text-align:center;
      margin:1rem 0 6rem 0;
      font-size:1.4rem;
      font-weight:500;
      color:#666;
      line-height:1.1;
      letter-spacing: .01em;
  }
}

@media only screen and (max-width: 768px) {
  .report_count{
      text-align:center;
      margin:1rem 0 0 0;
      font-size:6rem;
      font-weight:bold;
      color:#666;
      line-height:1;
  }
  .report_count:before, .report_count:after {
      font-size:2.4rem;
      font-weight: 500;
      color:#666;
      position:relative;
      left:0;
      bottom:3px;
  }
/*  .report_count:before {
      content: "Total";
      padding: 0 0.5rem 0 0;
      letter-spacing: .05em;
  }
  .report_count:after {
      content: "events held";
      padding: 0 0 0 0.5rem;
      letter-spacing: .03em;
  }*/
  .report_count_note{
      text-align:center;
      margin:0.5rem 0 7rem 0;
      font-size:1.4rem;
      font-weight:500;
      color:#666;
      line-height:1.1;
      letter-spacing: .01em;
  }
}

@media only screen and (max-width: 374px) {
  .report_count{
      font-size:4rem;
  }
  .report_count:before, .report_count:after {
      font-size:2rem;
  }
}

/*-------------------------------------
** images (CSR)
-------------------------------------*/
@media only screen and (min-width: 767px) {
  p.lyt-img-01.adjust img {width: 50%;}
  p.lyt-img-01.adjust70 img {width: 70%;}
  p.lyt-img-01.adjust75-r,p.lyt-img-01.adjust75-l img {width: 75%;}
  p.lyt-img-01.adjust100-r,p.lyt-img-01.adjust100-l img {width: 100%;}
  p.lyt-img-01.adjust75-r {text-align:left;}
  p.lyt-img-01.adjust75-l {text-align:right;}
  p.lyt-img-01.adjust100-r {text-align:left;}
  p.lyt-img-01.adjust100-l {text-align:right;}
  .lyt-img-04 .lyt-img-01.w25 {width:25%;}
  .lyt-img-04 .content.w70 {width:70%;margin-top:30px;}
}

.csr-interview .lyt-img-02>.lyt-img-01 {max-width: calc(50% - 120px);}

.lyt-img-03.img_w400 .lyt-img-01 {width:400px;}
.lyt-img-03.img_w400 {
  -webkit-align-items: start;
  align-items: start;
}


.lyt-col-02>.col.col3 {
  width: calc((100% / 5) * 3);
}

.lyt-col-02>.col.col4 {
  width: calc((100% / 5) * 2);
}

.ie .lyt-col-02>.col.col3, .edge .lyt-col-02>.col.col3, .wakuwaku .lyt-col-02>.col.col3 {
  width: 60%;
}

.ie .lyt-col-02>.col.col4, .edge .lyt-col-02>.col.col4, .wakuwaku .lyt-col-02>.col.col4 {
  width: 40%;
}


@media only screen and (max-width: 768px) {
  .lyt-col-02>.col.col3, .lyt-col-02>.col.col4 {
    width: auto;
  }
  .ie .lyt-col-02>.col.col3, .ie .lyt-col-02>.col.col4, .edge .lyt-col-02>.col.col3, .edge .lyt-col-02>.col.col4 {
    width: auto;
  }
}

/*-----------------------------------------------------------------------------
** .lyt-img-01 の拡張用（複数画像の下に、caption文を1つだけ入れる時に使用）
-----------------------------------------------------------------------------*/
.lyt-img-01-combining {
	margin-bottom: .71429em;
}

@media only screen and (max-width: 768px) {
.lyt-img-01-combining {
	margin-bottom: .57143em;
	width: auto !important;
}
}

/*-----------------------------------------------------------------------------
** .pgh-notice-01 の拡張用（複数画像の下に、caption文を1つだけ入れる時に使用）
-----------------------------------------------------------------------------*/
.combining-caption {
	text-align: center;
	color: #666;
	font-size: 1.4rem;
	margin-bottom: -.6075em;
	width: 100%;
}

@media only screen and (max-width: 768px) {
.combining-caption {
	line-height: 1.6;
	margin-bottom: -.51234em;
}
}