@charset 'UTF-8';
/*===========================================
original.css INDEX
===========================================*/
[lang="zh-cn"] body,
[lang="zh-cn"] select,
[lang="zh-cn"] input,
[lang="zh-cn"] textarea{
   font-family:'Simhei','MS UI Gothic','Hei',sans-serif;
}

/*[lang="zh-cn"] body #headerWrap,
[lang="zh-cn"] body footer{font-family: Helvetica, Arial, Tahoma, sans-serif;}*/

h1 {font-size: 2.8rem;}
header #logo .siteLogo a img {width: 46px;}
  @media screen and (max-width:767px) {
    header #logo .siteLogo a img {width: 23px;}
  }
.mgnT150 {margin-top: 150px !important;}
/*--------------------------------------------------
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: 660px;}
.groupMap .mapBlock .earth{position: absolute; top:217px; left:795px;}
.groupMap table{position:absolute; top:472px; left:795px; 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: 145%; padding-top:95%; 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;}

.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;}

/* fibers */
.row .rawImg{width:auto!important;}
.fiberAdjust1 .innerRow{display: flex;}
.fiberAdjust1 .innerRow > .column:nth-of-type(1){margin-right:30px;}

  @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;}
    .fiberAdjust1 .col-md-4{padding-top:0!important;}
  }

/*--------------------------------------------------
China
--------------------------------------------------*/
#kvGroupMes {background: url(../../china/images/kv_bg_02.jpg) 0 0 no-repeat;position: relative; zoom: 1;min-height: 300px;}
#kvGroupMes .sectionKV {padding: 120px 0 0 35px;width: 450px;color: #000; text-shadow: none}
#kvGroupMes .sectionKV h1 {font-size: 26px;margin-bottom: 10px;padding: 0;border: none;font-size: 26px;font-weight: bold;line-height: 1.2;color: #000;}
.mgnT-130 {margin-top: -250px !important;}

  @media screen and (max-width:767px) {
    #kvGroupMes {background: url("../../china/images/kv_bg_02.jpg") 0 0 no-repeat;}
    #kvGroupMes {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;}
    #kvGroupMes .sectionKV {padding: 50px 0 0;width: auto;}
    #kvGroupMes .sectionKV h1 {width: 60%; font-size: 1.8rem}
    #kvGroupMes .sectionKV p {display: block; font-size: 14px;}
    .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.cn
--------------------------------------------------*/
.subGnav.Event {display: none}
li.Event {display: none}
#footerNav > ul.parentNav > li {width:30%!important; margin-left:2%;}



/*--------------------------------------------------
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;}
}


/*advertising*/

.advertising h2{ font-size: 2.4rem; font-weight: bold; margin-bottom: 10px;}
.advertising a{ position: relative;
  display: inline-block;
  color:#333;
  text-decoration: none;
  vertical-align: middle;
  padding:0 0 20px;}

.advertising:hover {opacity: 0.8;}
.advertising .subHeading {
    font-size: 1.4rem;
    margin: 15px 10px 5px;
}
.advertising .heading{
  background-color:#fff;
  color:#014099;
  margin:5px 10px 0;
  padding:0;
  font-size:1.6rem;
  font-weight: 300;
  line-height: 1.4;
}

.advertising a::before,
.advertising a::after{
  position: absolute;
  bottom: 0;
  content: "";
  vertical-align: middle;
  -webkit-transition:.3s cubic-bezier(0.170, 0.935, 0.305, 1.000);
  -o-transition:.3s cubic-bezier(0.170, 0.935, 0.305, 1.000);
  transition:.3s cubic-bezier(0.170, 0.935, 0.305, 1.000);
}
.advertising > a::before{
  left: 10px;
  width: 50px;
  height: 2px;
  background: #014099;
}
.advertising > a::after{
  left: 56px;
  bottom: -2px;
  width: 6px;
  height: 6px;
  border-top: 2px solid #014099;
  border-right: 2px solid #014099;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
      transform: rotate(45deg);
}
.advertising > a:hover:before{left:20px;}
.advertising > a:hover:after{left:63px;}

@media screen and (max-width:767px){
	.advertising h2{ font-size: 1.8rem;}
	.advertising> a::before,
    .advertising > a::after{display: none;}
	
}


#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;*/
  }
}