@charset 'UTF-8';
/*===========================================
original.css INDEX
===========================================*/
[lang="pt"] body,
[lang="pt"] select,
[lang="pt"] input,
[lang="pt"] textarea{
   font-family: 'Helvetica', 'Arial', 'Tahoma', sans-serif;
}

h1 {font-size: 2.8rem;}
header #logo .siteLogo img,
body.popup header .siteLogo a img{width:87.4px;}
  @media screen and (max-width:767px) {
    header #logo .siteLogo a img {width:43.7px;}
  }

.color02{color:#014099;}

/*--------------------------------------------------
TOP
--------------------------------------------------*/
.kvRandom section .slogan {font-size:2.4rem;}
.kvRandom section .advLink {position: absolute;bottom: 30px;right: 30px;border: #fff 1px solid;padding:8px 15px;color: #fff;font-weight: bold;}
.kvRandom section .advLink:hover {text-decoration: none;opacity: 0.7;}
.kvRandom section .advLink::before {content: '';display: inline-block;width: 7px;height: 7px;border-top: 2px solid #fff;border-right: 2px solid #fff;-ms-transform: rotate(45deg);-webkit-transform: rotate(45deg);transform: rotate(45deg);margin:-3px 12px 0 0;vertical-align: middle;}

.groupMap {margin-bottom: 50px;}
.groupMap h2 {font-size: 2.4rem;line-height: 1;font-weight: bold;margin-bottom:20px;}
.groupMap .map {margin-bottom:30px;}
.groupMap .btn a {display: block;position: relative;background-color:#eef4f9;padding:25px;text-align: center;font-weight: bold;}
.groupMap .btn a:hover {text-decoration: none;opacity:0.8;}
.groupMap .btn a::after {content: '';display: block;position: absolute;top:45%; right: 7%;width: 6px;height: 6px;border-top: #014099 2px solid;border-right: #014099 2px solid;-ms-transform: rotate(45deg);-webkit-transform: rotate(45deg);transform: rotate(45deg);vertical-align: middle;}
.groupMap .mapBlock {position: relative; margin-bottom: 30px; background: url(../../images/index_map_bg.jpg) 0 0 no-repeat; min-height: 540px;}
.groupMap .mapBlock .earth {position: absolute; top:135px; left:87px;}
.groupMap table {position:absolute; top:390px; left:101px; width:210px; font-size:15px;}
.groupMap table th,.groupMap table td {padding:5px; line-height: 1.2;}
.groupMap table th {width:80%; font-weight: bold;}
.groupMap table td {width:20%; font-weight: bold; color:#014099;}

  @media screen and (max-width:767px) {
    .kvRandom section .advLink {display: inline-block;position: relative;bottom: inherit; right: inherit;margin-top:10px;padding:5px 10px;font-size: 1.4rem;}
    .kvRandom section .advLink::before {width:5px; height: 5px; margin:-3px 8px 0 0;}

    .groupMap {margin-bottom: 40px;}
    .groupMap h2 {font-size: 1.8rem;}
    .groupMap .map {margin:0 -10px 30px;}
    .groupMap .mapBlock {display: table; width:auto; min-height: 0; background-size: 140%; background-position: -130px 0; padding-top:72%; margin: 0 -10px 30px;}
    .groupMap .mapBlock .earth {display: table-cell; width:40%; position: relative; top:inherit; left: inherit; text-align: center;}
    .groupMap .mapBlock .earth img {width:60%;}
    .groupMap .mapBlock table {display: table-cell; vertical-align: middle; width: 60%; position: relative; top:inherit; left: inherit;}
    .groupMap table th, .groupMap table td {width:auto;}
  }
/*--------------------------------------------------
About Us
--------------------------------------------------*/

  @media screen and (max-width:767px) {
    #philosophySlogan {padding:20px; font-size:1.8rem;}
    #philosophySlogan br {display: none;}
  }

/*--------------------------------------------------
philosophy
--------------------------------------------------*/
#philosophySlogan {
  font-size: 3.2rem;
  font-weight: bold;
  padding: 60px 30px;
  line-height: 1.3;
}
.philosophyHead {
  font-size: 3.2rem;
  font-weight: bold;
  text-align: center;
}
.philosophyHead02 {
  font-size: 2.8rem;
  font-weight: bold;
  text-align: center;
}


.BoxWrap {background-color: #FFFFFF; margin-bottom: 50px;}
.BoxWrap.bgc01 {background-color: #fff; margin-bottom: 80px;}
.fs01 {font-size: 1.8rem;}

.BoxWrap .heading {color: #fff; font-weight: bold; padding: 15px 20px; font-size: 2.0rem;}
.BoxWrap .heading.philo01 {background-color: #043583;}
.BoxWrap .heading.philo02 {background-color: #56689e;}
.BoxWrap .heading.philo03 {background-color: #7c8fbc;}
.BoxWrap .heading.philo04 {background-color: #51a4d2;}
.BoxWrap .heading.philo05 {background-color: #4fb190;}
.BoxWrap .heading.philo06 {background-color: #7bbeef;}

.BoxWrap .row {margin: auto; padding: 5px 0px;}
.BoxWrap .container {padding: 30px 30px;}

.BoxWrap .row .colHead {font-weight: bold; font-size: 1.8rem;}

.BoxWrap .LinkBox a {color: #000; text-decoration: none; border: 1px solid #aaa; padding: 20px; font-weight: bold; display: block; width: 520px; text-align: center; margin: auto; transition: all .3s;}
.BoxWrap .LinkBox a:hover {color: #fff; background-color: rgb(1, 64, 153);; border: 1px solid #004eb6; transition: all .3s;}


  @media screen and (max-width:767px){
    #philosophySlogan{padding:20px; font-size:1.8rem;}
    #philosophySlogan br{display: none;}
    
  .philosophyHead {font-size: 2.0rem;}
  .philosophyHead02 {font-size: 1.8rem;}


.BoxWrap {margin-bottom: 40px;}
.BoxWrap.bgc01 {margin-bottom: 60px;}

.BoxWrap .heading {padding: 10px 15px; font-size: 1.8rem;}

.BoxWrap .row { padding: 10px 0px;}
.BoxWrap .row>[class*=col-]{ padding-top: 10px;}
.BoxWrap .container {padding: 20px 25px;}

.BoxWrap .LinkBox a { width: 70%;}

.BoxWrap.bgc01 .row {padding: 0;}
.BoxWrap.bgc01 .col {padding-top: 25px;}
.BoxWrap .heading.philo06 {margin: 0!important;}
    
    
  }



  @media screen and (max-width:767px){
    #philosophySlogan{padding:20px; font-size:1.8rem;}
    #philosophySlogan br{display: none;}
  }
/*--------------------------------------------------
Products
--------------------------------------------------*/
#kvProd001 {background:url(../../products/images/kv_prod_001.jpg) 0 0 no-repeat; position:relative; zoom:1;}
#kvProd002 {background:url(../../products/images/kv_prod_002.jpg) 0 0 no-repeat; position:relative; zoom:1;}
/*#kvProd003{background:url(../../products/images/kv_prod_003.jpg) 0 0 no-repeat; position:relative; zoom:1;}*/
#kvProd004 {background:url(../../products/images/kv_prod_004.jpg) 0 0 no-repeat; position:relative; zoom:1;}
#kvProd005 {background:url(../../products/images/kv_prod_005.jpg) 0 0 no-repeat; position:relative; zoom:1;}
#kvProd006 {background:url(../../products/images/kv_prod_006.jpg) 0 0 no-repeat; position:relative; zoom:1;}

.prodLower {padding-top:260px;}
.prodLower .intro {padding: 30px 30px 0; background-color: #fff;}
.prodLower .intro h2 {color: #000;font-size: 1.8rem;margin-bottom:20px;font-weight: bold;line-height: 1;}
.prodLower .intro p {color: #000;}

.bPattern01.insideLinks {padding-top: 30px}

.tPattern00_pad3 th, .tPattern00_pad3 td {font-weight: normal;border: none;}

.row .elem-col [class*="icon-products"] {position:relative;padding-left:30px;font-family: Helvetica, Arial, Tahoma, sans-serif !important;}
.row .elem-col [class*="icon-products"]::before {margin:0 17px 0 0;color:#83979d;font-size: 3.2rem;font-weight: normal;font-family: 'svgicon' !important;vertical-align: middle;position: absolute;left:0;top:-8px;}
.row .elem-col .icon-products1 {padding-left:36px;}
.row .elem-col .icon-products2 {padding-left:56px;}
.row .elem-col .icon-products3 {padding-left:48px;}
.row .elem-col .icon-products4 {padding-left:44px;}
.row .elem-col .icon-products5 {padding-left:39px;}
.row .elem-col .icon-products2::before {font-size:2.8rem;}

  @media screen and (max-width:767px) {
    .prodLower {padding-top:200px;margin:0 -10px;background-size:230% auto;-moz-background-size:230% auto;-webkit-background-size:230% auto;background-position: 50% 0!important;}
    .prodLower .intro {padding:15px;}
    .prodLower .intro h2 {margin-bottom:10px;}
    .row .elem-col [class*="icon-products"] {font-size: 1.6rem;}
    .row .elem-col [class*="icon-products"]::before {font-size: 2.5rem; top:-5px;}
    .row .elem-col .icon-products1 {padding-left:26px;}
    .row .elem-col .icon-products2 {padding-left:36px;}
    .row .elem-col .icon-products3 {padding-left:38px;}
    .row .elem-col .icon-products4 {padding-left:34px;}
    .row .elem-col .icon-products5 {padding-left:29px;}
    .row .elem-col .icon-products2::before {font-size:2rem; top:-3px;}
  }

/*--------------------------------------------------
Brazil
--------------------------------------------------*/
#kvBRmes {background: url(../../brazil/greeting/images/kv_bg_01.jpg) 0 0 no-repeat;position: relative; zoom: 1;min-height: 300px;}
#kvBRmes .sectionKV {padding: 120px 0 0 35px;width: 450px;color: #fff;}
#kvBRmes .sectionKV h1 {font-size: 26px;margin-bottom: 10px;padding: 0;border: none;font-size: 26px;font-weight: bold;line-height: 1.2;color: #fff;}
.keyvisual-brazil {position: relative;}
.keyvisual-brazil h1 {position: absolute;top: 70px;left: 170px;border: none;font-size: 40px;font-weight: bold;line-height: 1.2;color: #014099;}
.mgnT-130 {margin-top: -250px !important;}

  @media screen and (max-width:767px) {
    #kvBRmes {background: url(../../brazil/greeting/images/kv_bg_01_sp.jpg) 0 0 no-repeat;}
    #kvBRmes {margin: 10px -10px 0;padding: 0 10px;background-size: 100% auto;-moz-background-size: 100% auto;-webkit-background-size: 100% auto;height: 160px;min-height: inherit;}
    #kvBRmes .sectionKV {padding: 50px 0 0;width: auto;}
    #kvBRmes .sectionKV h1 {width: 60%; font-size: 1.8rem}
    #kvBRmes .sectionKV p {display: block; font-size: 14px;}
    .keyvisual {margin: 0 -10px 0px;}
    .keyvisual-brazil h1 {top: 10%;left: 3%;font-size: 30px;}
    .mgnT-130 {margin-top: -40px !important;}
  }

/*--------------------------------------------------
notes iframe Height
--------------------------------------------------*/
.iframeSubTop {height:280px;}
.iframeTop {height:500px;}
.iframeIRyear {height:600px;}
.iframeSegment {height:700px;}
.iframePress {height:3400px;}
.iframeProducts {height:300px;}
.iframeCsrNews {/*height:2000px;*/ min-height: 600px;}
.iframeCsrtop {height:450px;}

  @media screen and (max-width:767px) {
    .iframePress {height:1500px;}
  }

/*--------------------------------------------------
Custom for Global Navigation, Footer Toray.com.br
--------------------------------------------------*/
#footerNav > ul.parentNav > li {width:30%!important;}
#footerNav > ul.parentNav > li:nth-of-type(1){width:25%!important;}
#footerNav > ul.parentNav > li:nth-of-type(2){width:27%!important;}
#footerNav > ul.parentNav > li:nth-of-type(3){width:23%!important;}
#footerNav > ul.parentNav > li:nth-of-type(4){width:25%!important;}


/*--------------------------------------------------
TOP KV ver.TORAY NOW
--------------------------------------------------*/
@keyframes kvTextColor{
  0%{color:#014099; text-shadow: 0px 0px 2px rgba(255,255,255,.8);}
  100%{color:#fff; text-shadow:none;}
}
@keyframes kvFilterColor{
  0%{background:rgba(255,255,255,1); opacity:0;}
  100%{background:rgba(1,63,153,.4); opacity:1;}
}

#kvTorayNow{
  position: relative;
  width:1280px;
  height: 520px;
  margin:0 0 0 -100px;
  text-align: center;
  opacity:0;
  overflow:hidden;
}

#kvTorayNow .kvOverlay{
  content:'';
  display:block;
  position: absolute;
  top:0; left:0;
  width:100%;
  height:100%;
  z-index: 2;
  opacity:0;
  background:rgba(1,63,153,.4);
}
#kvTorayNow h1{
  margin-top: 20px;
  padding:0;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 3;
  font-size: 3.4rem;
  font-weight: 600;
  color: #014099;
  text-align: center;
  text-shadow: 0px 0px 2px rgba(255,255,255,.8);
  transform: translate(-50%,-50%);
}
@media screen and (min-width:768px){
  #kvTorayNow h1{animation: kvTextColor 1s 2s ease forwards;}
#kvTorayNow h1 br{display: none;}
  #kvTorayNow .kvOverlay{animation: kvFilterColor 1s 2s ease forwards;}
  #kvTorayNow .loadspinner{padding-top:100px;}
}

#kvTorayNow h1::after{
  content: attr(data-opt);
  display: block;
  font-size: 1.6rem;
  padding-top: 8px;
}
#kvTorayNow .kvVideoWrap{
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%,0);
  height: 520px;
  width: 1280px;
  z-index: 1;
  overflow:hidden;
}
#kvTorayNow .kvVideoWrap video{
  width:100%;
  margin-top:-50px;
  background-color:#fff;
}
#kvTorayNow .kvSP{display:none;}

@media screen and (max-width:767px){
  .bgswitcher{z-index: 0!important;}
  #kvTorayNow{
    box-sizing: border-box;
    width:auto;
    margin: 0 -10px;
    height:62.5vw;
    background-size: cover;
    opacity: 1;
  }
  #kvTorayNow .loadspinner span{
    width: 5em;
    height: 5em;
  }
  #kvTorayNow .kvOverlay{display: none;}
  #kvTorayNow h1{
    width:100%;
    color:#fff;
    text-shadow: none;
    letter-spacing: .2em;
    top:50%;
    font-size:1.7rem;
    margin:0 0 0 10px;
  }
  #kvTorayNow h1::after{
    font-size:1.2rem;
    margin-left:-10px;
  }
  #kvTorayNow .kvSP{
    display:block;
    position: absolute;
    top:0;
    height:62.5vw;
    overflow:hidden;
  }
}

/* 新型コロナ対策予防 */
#kvTorayNow + .kvInfo{
  position: relative;
  display: block;
  width:1280px;
  margin:0 0 50px -100px;
  text-align: center;
  color:#000;
  background-color: #eef4f9;
  padding: 10px;
  font-weight: bold;
  transition:opacity .3s cubic-bezier(.21,.66,.54,.94);
  box-sizing: border-box;
}
#kvTorayNow + .kvInfo:hover{
  opacity: 0.7;
  text-decoration: none;
}

  @media screen and (max-width:767px){
    #kvTorayNow + .kvInfo{
      width:auto;
      margin:0 -10px 40px;
    }
  }

/* loader
-------------------------*/
.loadspinner {
  position:absolute;
  z-index: 10;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  left: 0;
  margin: auto;
  background: #fff;
  overflow: hidden;
}
.loadspinner > span {
  font-size: 10px;
  display: block;
  margin: 100px auto;
  text-indent: -9999em;
  width: 8em;
  height: 8em;
  border-radius: 50%;
  background: #ccc;
  background: -moz-linear-gradient(left, #ccc 10%, rgba(225, 225, 225, 0) 42%);
  background: -webkit-linear-gradient(left, #ccc 10%, rgba(225, 225, 225, 0) 42%);
  background: linear-gradient(to right, #ccc 10%, rgba(225, 225, 225, 0) 42%);
  position: relative;
  -webkit-animation: loader 1s infinite linear;
  animation: loader 1.4s infinite linear;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
}
.loadspinner > span:before {
  width: 50%;
  height: 50%;
  background: #ccc;
  border-radius: 100% 0 0 0;
  position: absolute;
  top: 0;
  left: 0;
  content: '';
}
.loadspinner > span:after {
  background: #fff;
  width: 75%;
  height: 75%;
  border-radius: 50%;
  content: '';
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}
@-webkit-keyframes loader {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes loader {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@media screen and (max-width: 767px) {
  .loadspinner {
    top: 0;
    /*display: none;*/
  }
}