@charset "UTF-8";
/* ========================================
    CSS Reset & Base Styles
======================================== */
html {
  scroll-behavior: smooth;
}

body {
  line-height: 1.6;
}

.main p {
  font-size: 2rem;
}
@media screen and (max-width: 768px) {
  .main p {
    font-size: 1.3rem;
  }
}


/* ========================================
    top only common
======================================== */
@media screen and (min-width: 768px) {
  .rd-en__cmn-btn01 {
    max-width: auto;
  }
}
@media not screen and (min-width: 768px) {
  .rd-en__cmn-btn01 {
    width: 77%;
  }
}

.top-col2-box {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
  margin-top: 48px;
}
.top-col2-box__ttl {
  width: 22.5%;
  margin-right: 6.5%;
  text-align: center;
}
.top-col2-box__ttl p {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.5;
}
.top-col2-box__inner {
  width: 71%;
}
@media not screen and (min-width: 768px) {
  .top-col2-box {
    flex-direction: column;
  }
  .top-col2-box__ttl {
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;
  }
  .top-col2-box__ttl p {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.5;
  }
  .top-col2-box__inner {
    width: 100%;
  }
}

.top-tag-btn {
  display: block;
  width: 100%;
  padding: 16px 10px;
  border: 1px solid #FFF;
  border-radius: 100px;
  text-align: center;
  color: #FFF;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;
  text-decoration: none;
}
a.top-tag-btn:visited,
button.top-tag-btn:visited {
  color: #FFF;
}
a.top-tag-btn:hover,
a.top-tag-btn:focus,
button.top-tag-btn:hover,
button.top-tag-btn:focus {
  background-color: #FFF;
  text-decoration: none;
  color: #14134F;
}

.top-tag-btn.is-active {
  border: 1px solid #FA82A0;
  color: #FA82A0;
}
a.top-tag-btn.is-active:visited,
button.top-tag-btn.is-active:visited  {
  color: #FA82A0;
}
a.top-tag-btn.is-active:hover,
a.top-tag-btn.is-active:focus,
button.top-tag-btn.is-active:hover,
button.top-tag-btn.is-active:focus {
  background-color: #FA82A0;
  color: #14134F;
}


@media not screen and (min-width: 768px) {
  .rd-en__cmn-sec-block01 .rd-en__cmn-sec-block01__inner {
    max-width: 500px;
    margin: 0 auto;
  }
}


/* ========================================
    #kvArea
======================================== */
#kvArea.rd-en__cmn-sec-block01 {
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  margin-top: 20px;
  background: url(/english/corporate/technology/rd/images/top/bg_kv_01_pc.png) no-repeat center / cover;
  min-height: 373px;
}
#kvArea .rd-en__cmn-sec-block01__inner {
  position: relative;
}
@media not screen and (min-width: 768px) {
  #kvArea.rd-en__cmn-sec-block01 {
    margin-top: 0;
    background-image: url(/english/corporate/technology/rd/images/top/bg_kv_01_smt.png);
  }
  #kvArea .rd-en__cmn-sec-block01__inner {
    padding-top: 80px;
  }
}

.top-btn-block {
  position: absolute;
  top: 5%;
  right: 0;
  display: flex;
  gap: 10px;
}
.top-sns-btn {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 7px 25px;
  border-radius: 100vw;
  background-color: #fff;
}
.top-sns-btn p {
  color: #000;
  font-size: 16px;
}
.top-sns-btn__inner {
  display: flex;
  align-items: center;
  gap: 14px;
}
.top-sns-btn__inner__icon {
  width: 30px;
}
.top-sns-btn__inner__icon img {
  width: 100%;
}
.top-lang-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  color: #000;
  font-size: 1.6rem;
  padding: 7px 23px;
  border-radius: 100vw;
  background-color: #fff;
  letter-spacing: 0.04em;
  transition: all 0.3s ease;
  text-decoration: none;
}
.top-lang-btn:visited {
  color: #000;
}
.top-lang-btn:hover {
  color: #d52b1e;
}
@media not screen and (min-width: 768px) {
  .top-btn-block {
    top: 4%;
  }
  .top-sns-btn {
    padding: 7px 19px;
  }
  .top-sns-btn p {
    font-size: 12px;
  }
  .top-sns-btn__inner__icon {
    width: 20px;
  }
  .top-lang-btn {
    font-size: 12px;
    padding: 7px 16px;
  }
}

.top-kv-block {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.top-kv-block .top-kv-block__image {
  width: 42%;
  margin-right: 10%;
}
.top-kv-block .top-kv-block__image img {
  width: 100%;
}
.top-kv-block__subttl {
  display: block;
  color: #FFF;
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
}
.top-kv-block .top-kv-block__text {
  width: 48%;
  color: #FFF;
  text-shadow: 0 0 20px rgba(0, 0, 0, 0.10);
  font-size: 18px;
  font-weight: 700;
  line-height: 2.0;
}
@media not screen and (min-width: 768px) {
  .top-kv-block {
    flex-direction: column;
  }
  .top-kv-block .top-kv-block__image {
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;
  }
  .top-kv-block__subttl {
    font-size: clamp(15px,18px,20px);
    margin-bottom: 12px;
  }
  .top-kv-block .top-kv-block__text {
    width: 100%;
    text-align: center;
    font-size: 16px;
  }
}


/* ========================================
    #trendingTechArea
======================================== */
#trendingTechArea.rd-en__cmn-sec-block01 {
  background:#14134F;
  color: #FFF;
}

#trendingTechArea .rd-en__cmn-card01 .rd-en__cmn-card01__txt {
  margin-top: 20px;
  font-size: 24px;
}
#trendingTechArea .rd-en__cmn-card01 a:hover,
#trendingTechArea .rd-en__cmn-card01 a:focus {
  color: #FFF;
}

@media not screen and (min-width: 768px) {
    #trendingTechArea .rd-en__cmn-card01 .rd-en__cmn-card01__txt {
        font-size: 20px;
    }
}

#trendingTechArea .top-col2-box {
  align-items: center;
}
#trendingTechArea .top-col2-box__ttl {
  color: #FFF;
}

@media not screen and (min-width: 768px) {
  #trendingTechArea .rd-en__cmn-text-link01__wrap {
    margin-top: 48px;
  }
  #trendingTechArea .top-col2-box {
    flex-direction: column;
    margin-top: 20px;
  }
}

.top-ttl-img01 {
  max-width: 320px;
  margin: 0 auto 48px;
  text-align: center;
}
.top-ttl-img01 img {
  width: 100%;
}


/* ========================================
    #contactUsArea
======================================== */
#contactUsArea.rd-en__cmn-sec-block01 {
  color: #FFF;
  background: url(/english/corporate/technology/rd/images/top/bg_top_contact_01_pc.png) no-repeat center / cover;
}
#contactUsArea .rd-en__cmn-sec-block01__inner {
  display: flex;
  position: relative;
  align-items: center;
  min-height: 450px;
}
@media not screen and (min-width: 768px) {
  #contactUsArea.rd-en__cmn-sec-block01 {
    background:#0C1729 url(/english/corporate/technology/rd/images/top/bg_top_contact_01_smt.png) no-repeat center bottom / 100%;
  }
  #contactUsArea .rd-en__cmn-sec-block01__inner {
    display: flex;
    align-items: flex-start;
    padding-bottom: 54%;
  }
}

#contactUsArea .rd-en__cmn-ttl01 {
  color: #EEE;
}

.top-contact-area {
  width: 40%;
}
@media not screen and (min-width: 768px) {
  .top-contact-area {
    width: 100%;
  }
}


/* ========================================
    #technologyArea / #technicalJournalArea
======================================== */
#technologyArea .rd-en__cmn-ttl01,
#technicalJournalArea .rd-en__cmn-ttl01 {
  color: #000;
}

.top-sec-block01__wrap {
  display: flex;
}
.top-sec-block01__wrap .top-sec-block01 {
  display: flex;
  align-items: center;
  width: 50%;
  min-height: 580px;
  padding: 60px 100px;
}
@media not screen and (min-width: 950px) {
  .top-sec-block01__wrap .top-sec-block01 {
    padding: 12% 5%;
  }
}
@media not screen and (min-width: 768px) {
  .top-sec-block01__wrap {
    flex-wrap: wrap;
  }
  .top-sec-block01__wrap .top-sec-block01 {
    width: 100%;
    min-height: auto;
  }
  .top-sec-block01__inner {
    max-width: 500px;
    margin: 0 auto;
  }
}

.top-sec-block01__wrap .top-sec-block01 .rd-en__cmn-btn01 {
  max-width: 348px;
}


.top-sec-block01__wrap #technologyArea.top-sec-block01 {
  background: url(/english/corporate/technology/rd/images/top/bg_technology_pc.png) no-repeat center / cover;
}

.top-sec-block01__wrap #technicalJournalArea.top-sec-block01 {
  border-bottom: 1px solid #D5D5D5;
  background: linear-gradient(94deg, #FFF 0%, #F0F0F0 100%);
}


/* ========================================
    #linksArea / #pressReleasesArea / #otherLinkArea
======================================== */
#linksArea.rd-en__cmn-sec-block01,
#pressReleasesArea.rd-en__cmn-sec-block01 {
  border-bottom: 1px solid #D5D5D5;
}
@media screen and (min-width: 768px) {
  #linksArea .top-col2-box {
  margin-top: 80px;
  }

  #linksArea .top-col2-box__ttl .rd-en__cmn-ttl01,
  #pressReleasesArea .top-col2-box__ttl .rd-en__cmn-ttl01 {
    text-align: left;
  }
}
@media not screen and (min-width: 768px) {
  #linksArea .top-col2-box {
    margin-top: 40px;
  }
  #pressReleasesArea .top-col2-box {
    margin-top: 0;
  }
  #linksArea .top-col2-box__ttl,
  #pressReleasesArea .top-col2-box__ttl {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  #linksArea .top-col2-box__ttl .rd-en__cmn-ttl01,
  #pressReleasesArea .top-col2-box__ttl .rd-en__cmn-ttl01 {
    margin-bottom: 20px;
  }
}

#pressReleasesArea .top-col2-box__ttl .list-cmn-notes {
  font-size: 14px;
}

.top-bg-block01 {
  background: url(/english/corporate/technology/rd/images/top/bg_bg-block01_pc.png) no-repeat center / 150%;
}
@media not screen and (min-width: 768px) {
  .top-bg-block01 {
    background-size: 450%;
  }
}

@media screen and (min-width: 768px) {
  #otherLinkArea .rd-en__cmn-card01__txt {
    font-size: 20px;
  }
}
