@charset "utf-8";
/* CSS Document */

/* =============================================================================
 Reset
============================================================================= */

abbr,address,article,aside,audio,b,blockquote,body,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,p,pre,q,samp,section,small,span,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,ul,var,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}nav ul,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}ins{text-decoration:none}ins,mark{background-color:#ff9;color:#000}mark{font-style:italic;font-weight:700}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}
*,:after,:before{box-sizing:border-box}button,input[type=button]{margin:0;padding:0;border:0;border-radius:0;background-color:transparent;outline:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}





/* =============================================================================
 Reset cms hub
============================================================================= */
.dnd-section, .content-wrapper--vertical-spacing {
  padding: 0;
}
.dnd-section .dnd-column {
  padding: 0;
}
.dnd-section>.row-fluid {
  max-width: inherit;
}







/* =============================================================================
 variable
============================================================================= */
:root {
  --color-base : #3a3a3a;
  --color-red: #e3032d;
  --color-blue: #003b55;
  --color-green: #009292;
  --color-black: #000;
  --color-white: #fff;
  --color-gray: #f5f5f5;

  --font-en: 'Lexend','Noto Sans JP', sans-serif;

  --font-base: 1.6rem;
  --font-spbase: 1.4rem;

  --pc-content-width: 1000px;
  --pc-content-wide: 1100px;
  --sp-content-width: calc(335/375*100%);

  --transition-op_vis: opacity ease .5s,visibility ease .5s;
  --transition-trf: transform ease .5s;
  --transition-all: all ease .5s;
}




/* =============================================================================
 Fonts
============================================================================= */

html {
  font-size: 62.5%;
  scroll-padding-top: 100px;
}
body {
  font-size: var(--font-base);
  font-family: 'Noto Sans JP',"游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo",Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
}
* {
  letter-spacing: 0.08em;
}
strong {
  font-weight: 700;
}

@media screen and (max-width: 768px) {
  body {
    font-size: var(--font-spbase);
  }
}





/* =============================================================================
 Elements
============================================================================= */

/* color setting */
body {
  color: var(--color-base);
}


/* link setting */
a {
  color: inherit;
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}



/* image setting */
img {
  max-width: 100%;
  vertical-align: top;
}
img.cover {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: var(--transition-all);
}

@media screen and (min-width: 769px) {
  a:hover img.cover {
    opacity: 0.8;
    transform: scale(1.08);
  }
}

@media screen and (max-width: 768px) {
  img {
    width: 100%;
  }
}


/* setting */
.aright {
  text-align: right;
}
.acenter {
  text-align: center;
}
.aright {
  text-align: right;
}





/* =============================================================================
 Responsive Class
============================================================================= */

@media screen and (min-width: 769px) {
  .only-sp {
    display: none;
  }
}

@media screen and (max-width: 768px) {
  .only-pc {
    display: none;
  }
}





/* =============================================================================
 ANCHOR Base Layout
============================================================================= */

body {
}
#container {
  overflow: hidden;
}
#main-content {
  padding-left: 50px;
  padding-right: 50px;
  padding-bottom: 156px;
  position: relative;
}

@media screen and (max-width: 768px) {
  #container {
  }
  #main-content {
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 100px;
  }
}





/* =============================================================================
 SECTION common header & global navi
============================================================================= */

/* SECTION header base */
#header {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  width: 100%;
  background-color: var(--color-white);
}
body:before {
  content: '';
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 80;
  width: 100%;
  height: 100vh;
  background-color: var(--color-black);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: var(--transition-op_vis);
}
/* !SECTION */

/* SECTION header pc */
@media screen and (min-width: 769px) {
  body.mmOpen:before {
    opacity: .6;
    visibility: visible;
    pointer-events: all;
  }
  #header {
    height: 89px;
  }
  #header .headerInner {
    display: flex;
    justify-content: space-between;
  }
  #header .menuOpen,
  #header .menuClose {
    display: none;
  }
  #header #siteLogo {
    margin: 0 0 0 20px;
    display: flex;
    align-items: center;
    width: min(300px,calc(300/1200*100vw));
  }
  #header #siteLogo a {
    width: 100%;
    display: flex;
    align-items: center;
    text-decoration: none;
  }
  #header #siteLogo .logo {
    width: 100%;
  }
  #header #siteLogo .name {
    margin-left: 1.46em;
    padding-top: 4px;
    font-size: 1.3rem;
    font-size: min(1.3rem,calc(13/1000*100vw));
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  #header #siteLogo .name br {
    display: none;
  }
  #globalNavi {
    display: flex;
  }
  #globalNavi .navBody,
  #globalNavi .mainNav {
    display: flex;
    align-items: center;
  }
  #globalNavi .primaryConts {
    display: flex;
  }
  #globalNavi .primaryCont {
  }
  #globalNavi .primaryContLabel {
    font-size: 1.6rem;
    font-size: min(1.6rem,calc(16/1200*100vw));
  }
  #globalNavi .primaryContLabel a,
  #globalNavi .primaryContLabel span {
    margin-left: min(.6em,calc(10/1000*100vw));
    margin-right: min(.6em,calc(10/1000*100vw));
    position: relative;
    display: flex;
    align-items: center;
    height: 89px;
    font-weight: bold;
    text-decoration: none;
    cursor: pointer;
  }
  #globalNavi .primaryContLabel a:before,
  #globalNavi .primaryContLabel span:before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    bottom: 22px;
    width: 0;
    height: 3px;
    background-color: var(--color-blue);
    transition: var(--transition-all);
  }
  #globalNavi .primaryContLabel a:hover,
  #globalNavi .primaryContLabel span:hover {
    color: var(--color-blue);
  }
  #globalNavi .primaryContLabel a:hover:before,
  #globalNavi .primaryContLabel span:hover:before,
  #globalNavi .open .primaryContLabel span:before {
    width: 100%;
  }
  #globalNavi .primaryContLabel span {
    padding-right: 16px;
  }
  #globalNavi .primaryContLabel span:hover:before,
  #globalNavi .open .primaryContLabel span:before {
    width: calc(100% - 16px);
  }
  #globalNavi .primaryContLabel span:after {
    content: '';
    display: block;
    border-top: 1px solid var(--color-base);
    border-right: 1px solid var(--color-base);
    position: absolute;
    top: calc(50% - 4px);
    right: 0;
    width: 6px;
    height: 6px;
    transform: rotate(135deg);
  }
  #globalNavi .primaryContLabel span:hover:after {
    border-color: var(--color-blue);
  }
  #globalNavi .langSelect {
    margin-right: 24px;
    margin-right: min(24px,calc(24/1300*100vw));
  }
  #globalNavi .langSelect a {
    border-radius: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    color: var(--color-white);
    background-color: #beb7a9;
    font-size: 1rem;
    font-weight: bold;
    font-family: var(--font-en);
    letter-spacing: 0.1em;
    text-decoration: none;
    transition: var(--transition-all);
  }
  #globalNavi .langSelect a:hover {
    background-color: #a49983;
  }
  #globalNavi .subNav {
    display: flex;
  }
  #globalNavi .subNav a {
    padding: 54px 0 0;
    display: block;
    position: relative;
    width: 109px;
    width: min(109px,calc(109/1200*100vw));
    height: 89px;
    line-height: 1.33;
    color: var(--color-white);
    font-size: 1.1rem;
    font-size: min(1.1rem,calc(11/1200*100vw));
    font-weight: 500;
    letter-spacing: 0.06em;
    transition: var(--transition-all);
    text-decoration: none;
    text-align: center;
  }
  #globalNavi .subNav a:before {
    content: '';
    display: block;
    position: absolute;
    top: 22px;
    left: calc(50% - 11px);
    width: 22px;
    height: 19px;
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: contain;
  }
  #globalNavi .linkDwonload a {
    background-color: var(--color-red);
  }
  #globalNavi .linkContact a {
    background-color: var(--color-blue);
  }
  #globalNavi .linkDwonload a:before {
    background-image: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_download.svg);
  }
  #globalNavi .linkContact a:before {
    background-image: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_mail.svg);
  }
  #globalNavi .linkDwonload a:hover {
    background-color: #ab0121;
  }
  #globalNavi .linkContact a:hover {
    background-color: #002130;
  }
  .megaMenu {
    padding: 0 50px;
    display: block !important;
    position: absolute;
    top: 89px;
    left: 0;
    width: 100%;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: var(--transition-op_vis);
  }
  .open .megaMenu {
    opacity: 1;
    visibility: visible;
    pointer-events: all;
  }
  .megaMenu .inner {
    margin: 0 auto;
    display: flex;
    max-width: var(--pc-content-width);
    width: 100%;
  }
  .megaMenuHead {
    padding: 60px 0;
    position: relative;
    z-index: 1;
    width: 25.8%;
    color: var(--color-white);
  }
  .megaMenuHead:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    z-index: -1;
    width: 100vw;
    height: 100%;
    background-color: var(--color-blue);
  }
  .megaMenuLabel {
    color: var(--color-green);
    font-size: 1.2rem;
    font-weight: bold;
    font-family: var(--font-en);
    letter-spacing: 0.18em;
  }
  .megaMenuTitle {
    margin: 20px 0 50px;
    line-height: 1.5;
    font-size: 3rem;
    font-weight: bold;
    letter-spacing: 0.1em;
  }
  #globalNavi .linkList {
  }
  #globalNavi .linkList a {
    padding-right: 30px;
    display: inline-block;
    position: relative;
    text-decoration: none;
    transition: var(--transition-all);
  }
  #globalNavi .linkList a:before {
    content: '';
    display: block;
    position: absolute;
    bottom: -16px;
    left: 0;
    width: 27px;
    height: 2px;
    background-color: #3c6c82;
    transition: var(--transition-all);
  }
  #globalNavi .linkList a:after {
    content: '';
    display: block;
    border-top: 1px solid var(--color-white);
    border-right: 1px solid var(--color-white);
    position: absolute;
    top: 6px;
    right: 0;
    width: 6px;
    height: 6px;
    transform: rotate(45deg);
  }
  #globalNavi .linkList a:hover:before {
    width: 100%;
  }
  .megaMenuBody {
    padding: 60px 0 60px 50px;
    display: flex;
    flex-wrap: wrap;
    position: relative;
    z-index: 1;
    width: 74.2%;
    color: var(--color-white);
  }
  .megaMenuBody:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100vw;
    height: 100%;
    background-color: var(--color-green);
  }
  .megaMenuBody dl {
    padding-right: 20px;
    width: 50%;
  }
  .megaMenuBody dl.full {
    margin-top: 50px;
    width: 100%;
  }
  .megaMenuBody dl dt {
    padding-right: 56px;
    display: inline-block;
    position: relative;
    font-weight: bold;
    letter-spacing: 0.1em;
  }
  .megaMenuBody dl dt * {
  }
  .megaMenuBody dl dt .em {
    font-size: 120%;
    letter-spacing: 0.1em;
  }
  .megaMenuBody dl dt:after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    right: 0;
    width: 40px;
    height: 1px;
    background-color: #76bfbe;
  }
  .megaMenuBody dl dd {
    margin-top: 20px;
    letter-spacing: 0.1em;
  }
  .secondaryCont {
    line-height: 1.33;
  }
  .secondaryCont + .secondaryCont {
    margin-top: 10px;
  }
  .secondaryCont a {
    padding-left: 20px;
    display: inline-block;
    position: relative;
  }
  .secondaryCont a[target='_blank']:after {
    content: '';
    display: inline-block;
    margin-left: 8px;
    border: none;
    width: 14px;
    height: 11px;
    background: url(//7833030.fs1.hubspotusercontent-na1.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_another_w.png) 0 0 no-repeat;
    transform: translateY(-1px);
  }
  .secondaryCont a:before {
    content: '';
    display: block;
    position: absolute;
    top: 7px;
    left: 0;
    width: 7px;
    height: 7px;
    background-color: var(--color-white);
  }
  .searchCas {
    display: flex;
    max-width: 355px;
    width: 100%;
    height: 49px;
  }
  .searchCas form {
    display: flex;
    width: 100%;
  }
  .searchCasEntry {
    width: calc(100% - 49px);
    height: 49px;
    background-color: var(--color-white);
  }
  .searchCasEntry input {
    margin: 0;
    padding: 5px 20px;
    border: none;
    border-radius: 0;
    width: 100%;
    height: 100%;
    background-color: var(--color-white);
    outline: none;
  }
  .searchCasBtn {
    width: 49px;
    background: var(--color-blue) url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_search_b.svg) center center no-repeat;
    cursor: pointer;
  }
  .searchCasBtn input[type="submit"] {
    padding: 0;
    border: none;
    border-radius: 0;
    font-size: 0;
    width: 100%;
    height: 100%;
    background-color: transparent !important;
    cursor: pointer;
  }
  .companyInformation .megaMenuBody dl {
    margin: 0;
    width: 100%;
  }
  .companyInformation .megaMenuBody dl dd {
    margin: 0;
  }
  .secondaryConts.col2 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .secondaryConts.col2 .secondaryCont {
    width: 48.5%;
  }
  .secondaryConts.col2 .secondaryCont:nth-child(2) {
    margin-top: 0;
  }
  .productInformation .megaMenuBody dl:nth-child(1) {
    order: 1;
  }
  .productInformation .megaMenuBody dl:nth-child(2) {
    margin-top: -20px;
    order: 3;
  }
  .productInformation .megaMenuBody dl:nth-child(3) {
    order: 2;
  }
  .productInformation .megaMenuBody dl:nth-child(3) .secondaryCont:nth-child(odd) {
    width: 40%;
  }
  .productInformation .megaMenuBody dl:nth-child(3) .secondaryCont:nth-child(even) {
    width: 57%;
  }
  .productInformation .megaMenuBody dl:nth-child(4) {
    margin-top: 30px;
    order: 4;
  }
}
@media screen and (min-width: 769px) and (max-width: 1217px) {
  #header #siteLogo {
    width: min(260px,calc(260/1200*100vw));
  }
}
@media screen and (min-width: 769px) and (max-width: 970px) {
  #globalNavi .primaryContLabel a, #globalNavi .primaryContLabel span {
    margin: 0 .5em;
  }
}
/* !SECTION */

/* SECTION header sp */
@media screen and (max-width: 768px) {
  body.menuOpen:before {
    opacity: .6;
    visibility: visible;
    pointer-events: all;
  }
  #header {
    height: 63px;
  }
  #header .headerInner {
  }
  #header #siteLogo {
    margin: 0 0 0 20px;
    padding: 13px 0 0;
  }
  #header #siteLogo a {
    display: flex;
    align-items: center;
    text-decoration: none;
  }
  #header #siteLogo .logo {
    width: 170px;
  }
  #header #siteLogo .name {
    margin-left: 16px;
    padding-top: 4px;
    line-height: 1.454;
    font-size: 1.1rem;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  #globalNavi .subNav {
    position: absolute;
    top: 12px;
    right: 73px;
    display: flex;
  }
  #globalNavi .subNav a {
    margin-left: 7px;
    border-radius: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 36px;
    height: 36px;
    font-size: 0;
  }
  #globalNavi .subNav a:before {
    content: '';
    display: block;
    width: 19px;
    height: 16px;
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: contain;
  }
  #globalNavi .linkDwonload a {
    background-color: var(--color-red);
  }
  #globalNavi .linkContact a {
    background-color: var(--color-blue);
  }
  #globalNavi .linkDwonload a:before {
    background-image: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_download.svg);
  }
  #globalNavi .linkContact a:before {
    background-image: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_mail.svg);
  }
  #header .menuOpen {
    position: absolute;
    top: 0;
    right: 0;
    width: 63px;
    height: 63px;
    background-color: var(--color-blue);
    cursor: pointer;
  }
  #header .menuOpen span {
    position: absolute;
    top: 30px;
    left: 23px;
    width: 19px;
    height: 1px;
    background-color: var(--color-white);
  }
  #header .menuOpen span:before,
  #header .menuOpen span:after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: var(--color-white);
    transition: var(--transition-trf);
  }
  #header .menuOpen span:before {
    top: -7px;
  }
  #header .menuOpen span:after {
    bottom: -7px;
  }
  .menuOpen #header .menuOpen span {
    background-color: transparent;
  }
  .menuOpen #header .menuOpen span:before {
    top: 0;
    transform: rotate(45deg);
  }
  .menuOpen #header .menuOpen span:after {
    bottom: 0;
    transform: rotate(-45deg);
  }
  #globalNavi .navBody {
    position: fixed;
    top: 63px;
    right: 0;
    width: calc(335/375*100%);
    height: calc(100% - 63px);
    overflow: auto;
    color: var(--color-white);
    background-color: var(--color-blue);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: var(--transition-op_vis);
  }
  .menuOpen #globalNavi .navBody {
    opacity: 1;
    visibility: visible;
    pointer-events: all;
  }
  #globalNavi .mainNav {
    padding: 30px calc(40/335*100%);
    position: relative;
  }
  #globalNavi .primaryCont {
    padding: 0 0 1em;
    border-bottom: 1px solid #22546a;
    line-height: 1.5625;
    font-size: 1.6rem;
  }
  #globalNavi .primaryCont + .primaryCont {
    margin-top: 1em;
  }
  #globalNavi .primaryContLabel {
  }
  #globalNavi .primaryContLabel a,
  #globalNavi .primaryContLabel span {
    display: block;
    position: relative;
    font-weight: bold;
  }
  #globalNavi .primaryContLabel a:after,
  #globalNavi .primaryContLabel span:after {
    content: '';
    border-top: 1px solid var(--color-white);
    border-right: 1px solid var(--color-white);
    display: block;
    position: absolute;
    top: .5em;
    right: 3px;
    width: 8px;
    height: 8px;
    transform: rotate(45deg);
    transition: var(--transition-trf);
  }
  #globalNavi .primaryContLabel span:after {
    top: 0.25em;
    transform: rotate(135deg);
  }
  #globalNavi .primaryContLabel.accopen span:after {
    top: .5em;
    transform: rotate(-45deg);
  }
  #globalNavi .megaMenu,
  #globalNavi .megaMenuLabel,
  #globalNavi .megaMenuTitle {
    display: none;
  }
  #globalNavi .megaMenuBody dl dt {
    margin-top: 1.5em;
    font-size: 1.4rem;
  }
  #globalNavi .linkList {
    font-size: 1.3rem;
  }
  #globalNavi .megaMenu .inner {
    margin-top: 1em;
    padding: 1em 0 .5em;
    border-top: 1px solid #22546a;
  }
  #globalNavi .secondaryCont {
    margin-top: 10px;
    line-height: 1.33;
    font-size: 1.3rem;
  }
  #globalNavi .linkList a,
  #globalNavi .secondaryCont a {
    padding-left: 16px;
    display: inline-block;
    position: relative;
  }
  #globalNavi .linkList a:before,
  #globalNavi .secondaryCont a:before {
    content: '';
    display: block;
    position: absolute;
    top: 7px;
    left: 0;
    width: 5px;
    height: 5px;
    background-color: var(--color-white);
  }
  .secondaryCont a[target='_blank']:after {
    content: '';
    display: inline-block;
    margin-left: 8px;
    border: none;
    width: 14px;
    height: 11px;
    background: url(//7833030.fs1.hubspotusercontent-na1.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_another_w.png) 0 0 no-repeat;
    transform: translateY(-1px);
  }
  .searchCas {
    margin-top: 20px;
    display: flex;
    width: 100%;
    height: 49px;
  }
  .searchCas form {
    display: flex;
    width: 100%;
  }
  .searchCasEntry {
    width: calc(100% - 54px);
    height: 54px;
    background-color: var(--color-white);
  }
  .searchCasEntry input {
    margin: 0;
    padding: 5px 20px;
    border: none;
    border-radius: 0;
    width: 100%;
    height: 100%;
    background-color: var(--color-white);
    outline: none;
  }
  .searchCasBtn {
    width: 54px;
    height: 54px;
    background: var(--color-green) url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_search_g.svg) center center no-repeat;
    cursor: pointer;
  }
  .searchCasBtn input[type="submit"] {
    padding: 0;
    border: 0;
    border-radius: 0;
    font-size: 0;
    width: 100%;
    height: 100%;
    background-color: transparent;
    cursor: pointer;
  }
  #globalNavi .langSelect {
    margin-top: 50px;
  }
  #globalNavi .langSelect a {
    border-radius: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    color: var(--color-white);
    background-color: #beb7a9;
    font-size: 1.44rem;
    font-weight: bold;
    font-family: var(--font-en);
    letter-spacing: 0.1em;
    text-decoration: none;
    transition: var(--transition-all);
  }
  #globalNavi .menuClose {
    padding-left: 30px;
    position: absolute;
    right: calc(40/335*100%);
    height: 15px;
    bottom: 45px;
    color: var(--color-white);
    background: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_cross.png) center left no-repeat;
    font-size: 1.44rem;
    font-weight: bold;
    font-family: var(--font-en);
    cursor: pointer;
  }
}
@media screen and (max-width: 374px) {
  #header #siteLogo {
    margin-left: 5px;
  }
  #globalNavi .subNav {
    right: 66px;
  }
  #globalNavi .linkContact a {
    margin-left: 4px;
  }
}
/* !SECTION */
/* !SECTION */





/* =============================================================================
 SECTION common footer
============================================================================= */

#footer {
  padding: 0 50px;
  background-color: var(--color-blue);
}
#footer .footerCont {
  margin: 0 auto;
  padding: 110px 0;
  display: flex;
  justify-content: space-between;
  max-width: var(--pc-content-wide);
}
#footer .companyData {
  width: calc(400/1100*100%);
  line-height: 2;
  color: #92b0bf;
}
#footer .companyName {
  display: flex;
  align-items: center;
  height: 50px;
}
#footer .companyName .logo {
  width: 286px;
}
#footer .companyName .name {
  margin-left: 20px;
  color: var(--color-white);
  font-size: 1.8rem;
  font-size: min(1.8rem,calc(18/1100*100vw));
  font-weight: bold;
}
#footer .conpanyInfo dl {
  margin-top: 40px;
  line-height: 26px;
}
#footer .conpanyInfo dl dt {
  font-size: 1.4rem;
  font-weight: bold;
}
#footer .conpanyInfo dl dd {
  font-size: 1.3rem;
}
#footer .conpanyInfo dl dd.sub {
  font-size: 1.1rem;
}
#footer .footerNav {
  padding-top: 17px;
  width: calc(640/1100*100%);
  line-height: 1.5;
}
#footer .footerNav>ul {
  display: flex;
  flex-wrap: wrap;
}
#footer .footerNav>ul>li .catLabel {
  margin-bottom: 1em;
  color: var(--color-white);
  font-weight: bold;
}
#footer .footerNav>ul>li .catLabel a {
}
#footer .footerNav>ul>li ul {
}
#footer .footerNav>ul>li ul li {
  margin-bottom: 0.5em;
  padding-left: 1.1em;
  text-indent: -1.1em;
  color: #e7e7e7;
  font-size: 1.2rem;
}
#footer .footerNav>ul>li ul li:before {
  content: '・';
}
#footer .footerInfo {
  margin: 0 -50px;
  padding: 0 50px;
  background-color: var(--color-white);
}
#footer .footerInfoInner {
  margin: 0 auto;
  padding: 30px 0;
  max-width: var(--pc-content-width);
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #9a9999;
}
#footer .copyright {
  font-size: 1.1rem;
}
#footer ul.infoNav {
  display: flex;
  flex-wrap: wrap;
  line-height: 1;
  color: #3a3a3a;
  font-size: 1.2rem;
}
#footer ul.infoNav li + li {
  margin-left: 1em;
  padding-left: 1em;
  border-left: 1px solid #bebebe;
}
#footer .searchCasBtn {
  background-image: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_search_g.svg);
  background-color: var(--color-green);
}

@media screen and (min-width: 769px) {
  #footer .footerNav>ul>li ul,
  #footer .footAccBody {
    display: block !important;
  }
  #footer .footerNav>ul>li:nth-child(1) {
    padding-right: 1em;
    width: calc(290/640*100%);
  }
  #footer .footerNav>ul>li:nth-child(1) .footAccBody {
    padding-bottom: 100px;
    position: relative;
    width: 100%;
    display: flex !important;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  #footer .footerNav>ul>li:nth-child(1) .catLabel {
    width: 100%;
  }
  #footer .footerNav>ul>li:nth-child(1) ul:nth-of-type(1) {
    width: 45%;
  }
  #footer .footerNav>ul>li:nth-child(1) ul:nth-of-type(2) {
    width: 55%;
  }
  #footer .footerNav>ul>li:nth-child(2) {
    padding-right: 1em;
    width: calc(220/640*100%);
  }
  #footer .footerNav>ul>li:nth-child(3) {
    width: calc(130/640*100%);
  }
  #footer .searchCas {
    position: absolute;
    bottom: 0;
    min-width: 356px;
  }
  #footer .footerNav>ul>li .catLabel a.nolink {
    pointer-events: none;
  }
}

@media screen and (max-width: 768px) {
  #footer {
    padding: 0 calc(20/375*100%);
  }
  #footer .footerCont {
    padding: 60px 0;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column-reverse;
  }
  #footer .companyData,
  #footer .footerNav {
    width: 100%;
  }
  #footer .footerNav {
    margin-bottom: 45px;
    border-top: 1px solid #22546a;
  }
  #footer .footerNav>ul {
    display: block;
  }
  #footer .footerNav>ul>li {
    margin: 0 0 15px;
    border-bottom: 1px solid #22546a;
    width: 100%;
  }
  #footer .footerNav>ul>li .catLabel {
    margin-bottom: 0;
  }
  #footer .footerNav>ul>li .catLabel:not(.footAcc) {
    margin-top: 15px;
    border-bottom: 1px solid #22546a;
  }
  #footer .footerNav>ul>li .catLabel a {
    padding: 0 0 1em;
    display: block;
    position: relative;
    font-weight: bold;
    text-decoration: none;
  }
  #footer .footerNav>ul>li .catLabel:not(.footAcc) a:after {
    content: '';
    border-top: 1px solid var(--color-white);
    border-right: 1px solid var(--color-white);
    display: block;
    position: absolute;
    top: 0.5em;
    right: 3px;
    width: 8px;
    height: 8px;
    transform: rotate(45deg);
    transition: var(--transition-trf);
  }
  #footer .footerNav>ul>li .catLabel.footAcc a:before {
    content: '';
    display: block;
    position: absolute;
    top: 10px;
    right: 0;
    width: 11px;
    height: 1px;
    background-color: var(--color-white);;
  }
  #footer .footerNav>ul>li .catLabel.footAcc a:after {
    content: '';
    display: block;
    position: absolute;
    top: 5px;
    right: 5px;
    width: 1px;
    height: 11px;
    background-color: var(--color-white);
  }
  #footer .footerNav>ul>li .catLabel.footAcc a.open:after {
    display: none;
  }
  #footer .footerNav>ul>li .footAccBody {
    display: none;
  }
  #footer .footerNav>ul>li ul {
  }
  #footer .footerNav>ul>li ul li {
    margin: 0.5em 0 0 1em;
  }
  #footer .footerNav>ul>li ul li:first-child {
  }
  #footer .companyData {
    text-align: center;
  }
  #footer .companyName {
    display: block;
    height: auto;
  }
  #footer .companyName .logo {
    margin: 0 auto 15px;
  }
  #footer .companyName .name {
    margin: 0;
    font-size: 1.5rem;
  }
  #footer .conpanyInfo dl {
    margin-top: 30px;
  }
  #footer .footerInfo {
    margin: 0 calc(-20/375*100vw);
    padding: 0 calc(20/375*100%);
  }
  #footer .footerInfoInner {
    display: block;
  }
  #footer .copyright {
    margin-top: 2em;
    font-size: 1rem;
    text-align: center;
  }
  #footer ul.infoNav {
    justify-content: center;
  }
  #footer ul.infoNav li + li {
    margin-left: 1em;
    padding-left: 1em;
    border-left: 1px solid #bebebe;
  }
  #footer .footerNav>ul>li .footAccBody {
    padding-bottom: 25px;
  }
}
/* !SECTION */





/* =============================================================================
 SECTION Conversion Area Styles
============================================================================= */

.conversion {
}
.conversion .inner {
  margin: 0 auto;
  padding: 90px 50px 100px min(100px,calc(100/1000*100%));
  position: relative;
  z-index: 1;
  max-width: 1100px;
}
.conversion .inner:before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: calc(50vw + 50%);
  min-width: calc(100% + 50px);
  height: 100%;
  background: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/bg_contact.png) 0 0 no-repeat;
  background-size: cover;
}
.conversion .cnvBody {
  display: flex;
  justify-content: space-between;
}
.conversion .cnvHead {
  margin-bottom: 40px;
  width: calc(350/950*100%);
}
.conversion .cnvTitle {
  font-family: var(--font-en);
  font-size: 5rem;
  font-size: min(5rem,calc(50/1100*100vw));
  font-weight: bold;
  letter-spacing: .1em;
}
.conversion .cnvLabel {
  margin-top: 15px;
  font-size: 1.8rem;
  font-weight: bold;
  letter-spacing: .1em;
}
.conversion .cnvLead {
  width: calc(575/950*100%);
}
.conversion .cnvLead p {
  line-height: 2.133;
}
.conversion ul {
  display: flex;
  justify-content: space-between;
}
.conversion a {
  padding-right: 35px;
  display: flex;
  align-items: center;
  position: relative;
  z-index: 1;
  height: 76px;
  line-height: 1.5;
  background-repeat: no-repeat;
  font-weight: bold;
  letter-spacing: 0.1em;
  text-decoration: none;
  transition: var(--transition-all);
}
.conversion a:after {
  content: '';
  border-top: 1px solid var(--color-white);
  border-right: 1px solid var(--color-white);
  display: block;
  position: absolute;
  top: calc(50% - 3px);
  right: 20px;
  width: 8px;
  height: 8px;
  transform: rotate(45deg);
}
.conversion .icon {
  border-radius: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: -25px;
  left: -25px;
  width: 50px;
  height: 50px;
  color: var(--color-white);
  background-color: var(--color-blue);
  font-weight: bold;
  letter-spacing: 0.1em;
}
.conversion .linkDownload {
  width: calc(534/950*100%);
}
.conversion .linkContact {
  width: calc(375/950*100%);
}
.conversion .linkDownload a {
  padding-left: 76px;
  color: var(--color-white);
  background-color: var(--color-red);
  background-image: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_download.svg);
  background-position: center left 33px;
}
.conversion .linkContact a {
  padding-left: 64px;
  color: var(--color-blue);
  background-color: var(--color-white);
  background-image: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_mail.svg);
  background-position: center left 24px;
}
.conversion .linkContact a:before {
  content: '';
  border: 2px solid transparent;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  transition: var(--transition-all);
}
.conversion .linkContact a:after {
  border-color: var(--color-blue);
}
@media screen and (min-width: 769px) {
  .conversion .linkDownload a:hover {
    background-color: #ab0121;
  }
  .conversion .linkContact a:hover:before {
    border-color: var(--color-blue);
  }
}
@media screen and (max-width: 768px) {
  .conversion {
    padding: 0;
  }
  .conversion .inner {
    padding: 50px calc(20/375*100%) 60px;
  }
  .conversion .inner:before {
    width: 100%;
    min-width: 100%;
    background: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/bg_contact_sp.png) 0 0 no-repeat;
    background-size: cover;
  }
  .conversion .cnvBody {
    margin-bottom: 35px;
    display: block;
  }
  .conversion .cnvHead {
    margin-bottom: 25px;
    width: auto;
  }
  .conversion .cnvTitle {
    font-size: 3.2rem;
  }
  .conversion .cnvLabel {
    font-size: 1.5rem;
  }
  .conversion .cnvLead {
    width: auto;
  }
  .conversion .cnvLead p {
    line-height: 1.857;
  }
  .conversion ul {
    display: block;
  }
  .conversion ul li {
    width: 100% !important;
    height: 56px;
  }
  .conversion ul li +li {
    margin-top: 20px;
  }
  .conversion a {
    padding-right: 30px;
    height: 100%;
    line-height: 1.666;
    font-size: 1.5rem;
  }
  .conversion .icon {
    top: -15px;
    left: -15px;
    width: 30px;
    height: 30px;
    font-size: 1rem;
  }
  .conversion .linkDownload {
    height: 80px;
  }
  .conversion .linkContact {
  }
  .conversion .linkDownload a {
    padding-left: 64px;
    background-position: center left 21px;
  }
  .conversion .linkContact a {
    padding-left: 60px;
    background-position: center left 18px;
  }
}




/* !SECTION */
/* =============================================================================
 SECTION Common Block Styles
============================================================================= */

/* SECTION pagetop */
#pagetop {
  position: fixed;
  right: 0;
  bottom: 0;
  z-index: 10;
  width: 56px;
  height: 56px;
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  transition: var(--transition-op_vis);
}
#pagetop a {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-blue);
  transition: var(--transition-op_vis);
}
#pagetop a:hover {
  opacity: 0.6;
}
#pagetop.show {
  opacity: 1;
  pointer-events: all;
  visibility: visible;
}
.footIn #pagetop {
  position: absolute;
}

@media screen and (max-width: 768px) {
  #pagetop {
    width: 53px;
    height: 53px;
  }
  #pagetop img {
    width: 17px;
  }
}
/* !SECTION */



/* SECTION section */
.section {
  margin-left: auto;
  margin-right: auto;
  padding-top: 100px;
  padding-bottom: 100px;
  position: relative;
  z-index: 1;
  max-width: var(--pc-content-width);
}
.bgG:before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 50%;
  z-index: -1;
  width: 100vw;
  height: 100%;
  background-color: var(--color-gray);
  pointer-events: none;
  transform: translateX(-50%);
}
.sectionBody {
  margin-left: auto;
  margin-right: auto;
  max-width: var(--pc-contentinner-width);
}
.sectionTitle {
  margin-bottom: 25px;
  line-height: 1.5;
  font-size: 2.4rem;
  font-weight: 700;
}
.lineTitle {
  margin-bottom: 15px;
  display: flex;
  align-items: center;
  line-height: 2.5;
  font-size: 1.8rem;
  font-weight: bold;
  letter-spacing: 0.1em;
}
.lineTitle:after {
  margin-left: 10px;
  content: '';
  display: block;
  width: 40px;
  height: 1px;
  background-color: #9d9d9d;
}
@media screen and (max-width: 768px) {
  .section {
    padding: 60px calc(20/375*100%);
  }
  .sectionTitle {
    margin-bottom: 15px;
    font-size: 2rem;
  }
  .lineTitle {
    margin-bottom: 20px;
    line-height: 1.5;
    font-size: 1.7rem;
  }
}
/* !SECTION */



/* SECTION button */
.button {
  padding: 0;
  border: 1px solid var(--color-blue);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 100%;
  height: 49px;
  line-height: 1.5;
  color: var(--color-white);
  background: var(--color-blue);
  font-family: inherit;
  font-size: 1.4rem;
  text-align: center;
  text-decoration: none !important;
  transition: var(--transition-all);
}
.button:after {
  content: '';
  display: block;
  position: absolute;
  top: calc(50% - 3px);
  right: 20px;
  border-top: 1px solid var(--color-white);
  border-right: 1px solid var(--color-white);
  width: 8px;
  height: 8px;
  transform: rotate(45deg);
  transition: var(--transition-all);
}
@media screen and (min-width: 769px) {
  .button:hover {
    color: var(--color-blue);
    background: var(--color-white);
  }
  .button:hover:after {
    border-color: var(--color-blue);
  }
}
@media screen and (max-width: 768px) {
  .button {
    font-size: 1.3rem;
  }
}
/* !SECTION */



/* SECTION view more */
.viewmore a,
.viewmore span {
  padding: 0 30px 20px 0;
  display: inline-block;
  position: relative;
  color: var(--color-blue);
  font-family: var(--font-en);
  font-size: 1.2rem;
  font-weight: bold;
  text-decoration: none;
  letter-spacing: 0.14em;
  transition: var(--transition-all);
}
.viewmore a:before,
.viewmore span:before {
  content: '';
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 40px;
  height: 2px;
  background-color: #c3c3c3;
  transition: var(--transition-all);
}
.viewmore a:after,
.viewmore span:after {
  content: '';
  display: block;
  border-top: 1px solid var(--color-blue);
  border-right: 1px solid var(--color-blue);
  position: absolute;
  top: 2px;
  right: 0;
  width: 6px;
  height: 6px;
  transform: rotate(45deg);
}
@media screen and (min-width: 769px) {
  .viewmore a:hover {
  }
  .viewmore a:hover:before {
    width: 100%;
    background-color: var(--color-blue);
  }
}
@media screen and (max-width: 768px) {
}
/* !SECTION */



/* SECTION ul style */
ul.disc li {
  padding-left: 28px;
  position: relative;
  line-height: 1.6;
}
ul.disc li:before {
  content: '';
  border-radius: 50%;
  display: block;
  position: absolute;
  top: .7em;
  left: 10px;
  width: 5px;
  height: 5px;
  background-color: #e3032d;
}
/* !SECTION */




/* SECTION page header */
.pageHeader {
  margin: 89px -50px -20px;
}
.topicPath {
  padding: 0 50px;
  position: relative;
  z-index: 2;
  background-color: var(--color-gray);
}
.topicPath ul {
  margin: 0 auto;
  padding: 12px 0;
  max-width: var(--pc-content-width);
  display: flex;
  flex-wrap: wrap;
}
.topicPath ul li {
  line-height: 1.5;
  font-size: 1rem;
  font-weight: 300;
}
.topicPath ul li:after {
  margin: 0 .5em;
  content: '／';
  color: #c7c7c7;
}
.topicPath ul li:last-child:after {
  display: none;
}
.topicPath ul li a {
  color: var(--color-blue);
}
.pageHeadding {
  padding: 0 50px;
  display: flex;
  justify-content: center;
  flex-direction: column;
  height: 180px;
  color: var(--color-white);
  background-image: linear-gradient(to right, #069896 0%, var(--color-blue) 100%);
}
.pageSubTitle {
  margin: 0 auto 15px;
  width: 100%;
  max-width: var(--pc-content-width);
  font-family: var(--font-en);
  font-size: 1.2rem;
  font-weight: bold;
  letter-spacing: 0.18em;
}
.pageTitle {
  margin: 0 auto;
  width: 100%;
  max-width: var(--pc-content-width);
  font-size: 3rem;
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  .pageHeader {
    margin: 63px 0 -10px;
  }
  .topicPath {
    padding: 0 calc(20/375*100%);
  }
  .topicPath ul {
    padding: 6px 0;
  }
  .pageHeadding {
    padding: 0 calc(20/375*100%);
    height: 100px;
  }
  .pageSubTitle {
    margin-bottom: 8px;
    font-size: 1.2rem;
  }
  .pageTitle {
    font-size: 2rem;
  }
}
/* !SECTION */



/* SECTION page anchor */
.pageAnchor {
  margin-bottom: 70px;
}
.pageAnchor ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 5px 0;
}
.pageAnchor ul li {
  margin: 0 3px 5px;
}
.pageAnchor ul li a {
  padding: 0 50px 0 40px;
  border-radius: 100px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  height: 50px;
  color: var(--color-blue);
  background-color: var(--color-gray);
  text-decoration: none;
  transition: var(--transition-all);
}
.pageAnchor ul li a:after {
  content: '';
  display: block;
  position: absolute;
  top: 21px;
  right: 25px;
  border-top: 1px solid var(--color-blue);
  border-right: 1px solid var(--color-blue);
  width: 6px;
  height: 6px;
  transform: rotate(135deg);
  transition: var(--transition-all);
}
.pageAnchor ul li a.download {
  padding-right: 40px;
}
.pageAnchor ul li a.download:after {
  display: none;
}
.pageAnchor ul li a.download:before {
  margin-right: 8px;
  content: '';
  display: inline-block;
  width: 15px;
  height: 14px;
  background: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_download_b.svg) 0 0 no-repeat;
  background-size: contain;
}
.pageAnchor ul li a.contact {
  color: var(--color-gray);
  background-color: var(--color-blue);
}
.pageAnchor ul li a.contact:after {
  border-top: 1px solid var(--color-gray);
  border-right: 1px solid var(--color-gray);
  top: 22px;
  transform: rotate(45deg);
}
@media screen and (min-width: 768px) {
  .pageAnchor ul li a:hover {
    color: var(--color-white);
    background-color: var(--color-blue);
  }
  .pageAnchor ul li a:hover:after {
    border-color: var(--color-white);
    top: 26px;
  }
  .pageAnchor ul li a.download:hover:before {
    background-image: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_download.svg);
  }
  .pageAnchor ul li a.contact:hover:after {
    top: 22px;
    transform: rotate(45deg);
  }
  .pageAnchor ul li a.contact:hover {
    opacity: 0.6;
  }
}
@media screen and (max-width: 768px) {
  .pageAnchor {
    margin-bottom: 40px;
  }
  .pageAnchor ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  .pageAnchor ul li {
    margin: 0 2px 5px;
  }
  .pageAnchor ul li a {
    padding: 0 30px 0 25px;
    height: 40px;
  }
  .pageAnchor ul li a:after {
    top: 16px;
    right: 15px;
    width: 6px;
    height: 6px;
  }
  .pageAnchor ul li a.download {
    padding-right: 30px;
  }
  .pageAnchor ul li a.contact:after {
    top: 17px;
  }
}
/* !SECTION */



/* SECTION pagination */
.pager {
  margin-top: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pager .prev,
.pager .next {
  width: 42px;
  height: 42px;
}
.pager .prev.-disabled,
.pager .next.-disabled {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.pager .prev a,
.pager .next a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  transition: var(--transition-all);
}
.pager .prev a:before,
.pager .next a:before {
  content: '';
  display: block;
  border-top: 1px solid var(--color-blue);
  border-left: 1px solid var(--color-blue);
  width: 6px;
  height: 6px;
  transform: rotate(-45deg);
  transition: var(--transition-all);
}
.pager .next a:before {
  transform: rotate(135deg);
}
.pager ul {
  margin: 0 14px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pager ul li {
  margin: 0 7px;
  width: 42px;
  height: 42px;
}
.pager ul li a,
.pager ul li a.-active {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: var(--color-blue);
  background-color: var(--color-gray);
  font-family: var(--font-en);
  font-weight: 500;
  font-size: 1.8rem;
  transition: var(--transition-all);
  text-decoration: none;
}
.pager ul li a.-active {
  color: var(--color-white);
  background-color: var(--color-blue);
}

@media screen and (min-width: 769px) {
  .pager ul li a:hover {
    color: var(--color-white);
    background-color: var(--color-blue);
  }
  .pager .prev a:hover,
  .pager .next a:hover {
    background-color: var(--color-blue);
  }
  .pager .prev a:hover:before,
  .pager .next a:hover:before {
    border-color: var(--color-white);
  }
}
@media screen and (max-width: 768px) {
  .pager {
    margin-top: 30px;
  }
  .pager .prev,
  .pager .next {
    width: 36px;
    height: 36px;
  }
  .pager ul {
    margin: 0 7px;
  }
  .pager ul li {
    margin: 0 3px;
    width: 36px;
    height: 36px;
  }
  .pager ul li a,
  .pager ul li a.-active {
    font-size: 1.6rem;
  }
}
/* !SECTION */



/* SECTION news list */
.newsList li {
  display: flex;
  align-items: flex-start;
}
.newsList li + li {
  margin-top: 20px;
}
.newsDate {
  width: 105px;
  line-height: 31px;
  color: #959595;
  font-size: 1.7rem;
  font-family: var(--font-en);
  letter-spacing: 0.06em;
}
.newsCategory {
  margin-right: 20px;
  border-radius: 100px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 94px;
  height: 31px;
  color: #fff;
  background-color: #009292;
  font-size: 1.3rem;
  letter-spacing: 0.14em;
}
.newsCategory.news,
.newsCategory.news_en {
  background-color: #00557f;
}
.newsTitle {
  width: calc(100% - 220px);
  line-height: 31px;
  font-size: 1.8rem;
}
.newsTitle a {
  background: linear-gradient(var(--color-base), var(--color-base)) 0 100%/0 1px no-repeat;
  text-decoration: none;
  transition: var(--transition-all);
}
@media screen and (min-width: 769px) {
  .newsTitle a:hover {
    background-size: 100% 1px;
  }
}
@media screen and (max-width: 768px) {
  .newsList li {
    display: block;
  }
  .newsDate {
    display: inline-block;
    width: auto;
    font-size: 1.5rem;
  }
  .newsCategory {
    width: 100px;
    line-height: 20px;
    font-size: 1.1rem;
  }
  .newsTitle {
    margin: .5em 0 0;
    padding: 0;
    width: 100%;
    font-size: 1.6rem;
  }
}
/* !SECTION */



/* SECTION another contents */
.anotherContents {
  margin: 0 -50px 100px;
  padding: 100px 50px;
  color: var(--color-white);
  background: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/company/bg_companyinfo.png) top center no-repeat;
  background-size: cover;
  text-align: center;
}
.anotherContentsTitle {
  font-family: var(--font-en);
  font-size: 3.8rem;
  font-weight: bold;
  letter-spacing: 0.1em;
}
.anotherContents p {
  margin: 15px 0 35px;
  font-size: 1.4rem;
  font-weight: bold;
  letter-spacing: 0.12em;
}
.anotherContents ul {
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  max-width: var(--pc-content-width);
}
.anotherContents ul li {
  width: 31%;
  height: 200px;
  text-align: left;
}
.anotherContents ul li a {
  padding: 30px 35px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
  height: 100%;
  background-color: rgba(255,255,255,.9);
  text-decoration: none;
}
.anotherContentTitle {
  line-height: 1.571;
  color: var(--color-blue);
  font-size: 2.1rem;
  font-weight: bold;
}
.anotherContents ul li .viewmore {
}
.anotherContents ul li .viewmore span:before {
  background-color: #38728c;
}
.anotherContents.-products {
  background-image: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/product/bg_productinfo.png);
}
.anotherContents.-products ul li {
  height: 160px;
}
.anotherContents dl {
  margin-top: 40px;
  display: flex;
  justify-content: center;
}
.anotherContents dl dt {
  margin: 0;
}
.anotherContents dl dt.lineTitle:after {
  background-color: var(--color-white);
}
.anotherContents dl dd.searchCas {
  margin-left: 30px;
  max-width: 538px;
}
@media screen and (min-width: 769px) {
  .anotherContents.-products ul li {
    width: 24%;
  }
  .anotherContents.-products ul li a {
    padding: 30px 25px;
  }
  .anotherContents ul li a:hover .viewmore span:before {
    width: 100%;
    background-color: var(--color-blue);
  }
}
@media screen and (max-width: 768px) {
  .anotherContents {
    margin: 0 0 50px;
    padding: 50px calc(20/375*100%);
  }
  .anotherContentsTitle {
    font-size: 2.4rem;
  }
  .anotherContents p {
    margin: 10px 0 20px;
    font-size: 1.2rem;
  }
  .anotherContents ul {
    display: block;
  }
  .anotherContents ul li {
    margin-top: 15px;
    width: 100%;
    height: auto !important;
  }
  .anotherContents ul li a {
    padding: 20px calc(20/335*100%);
  }
  .anotherContentTitle {
    margin-bottom: 1.5em;
    font-size: 1.6rem;
  }
  .anotherContents dl {
    margin-top: 30px;
    display: block;
  }
  .anotherContents dl dt {
    margin: 0;
  }
  .anotherContents dl dd.searchCas {
    margin-left: 0;
    max-width: 100%;
  }
}
/* !SECTION */



/* SECTION back list */
.backList {
  margin-top: 70px;
  padding-top: 50px;
  border-top: 1px solid #d7d7d7;
  display: flex;
  justify-content: center;
  align-items: center;
}
.backList a.back {
  margin: 0 25px;
  border: 1px solid var(--color-blue);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 150px;
  height: 58px;
  color: var(--color-blue);
  text-decoration: none;
  text-align: center;
  transition: var(--transition-all);
}
.backList a.prev,
.backList a.next {
  display: block;
  position: relative;
  width: calc(50% - 100px);
  line-height: 1.866;
  color: var(--color-blue);
}
.backList a.prev.-disabled,
.backList a.next.-disabled {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}
.backList a.prev {
  padding-left: 25px;
}
.backList a.next {
  padding-right: 25px;
  text-align: right;
}
.backList a.prev:before,
.backList a.next:before {
  content: '';
  display: block;
  border-top: 1px solid var(--color-blue);
  border-left: 1px solid var(--color-blue);
  position: absolute;
  top: calc(50% - 3px);
  width: 6px;
  height: 6px;
  transform: rotate(-45deg);
}
.backList a.prev:before {
  left: 0;
}
.backList a.next:before {
  right: 0;
  transform: rotate(135deg);
}
.backList.hs-search-results__pagination {
  padding-top: 0;
  border-top: none;
  display: block;
}
.backList.hs-search-results__pagination:after {
  content: '';
  display: block;
  clear: both;
}
html[lang="ja"] .backList .hs-search-results__prev-page {
  font-size: 0;
}
html[lang="ja"] .backList .hs-search-results__prev-page:after {
  content: '前のページへ';
  font-size: 1.6rem;
}
html[lang="ja"] .backList .hs-search-results__next-page {
  font-size: 0;
}
html[lang="ja"] .backList .hs-search-results__next-page:after {
  content: '次のページへ';
  font-size: 1.6rem;
}
.philosophy_btn a.back {
  width: 360px;
  font-weight: 600;
}

@media screen and (min-width: 769px) {
  .backList a.back:hover {
    color: var(--color-white);
    background-color: var(--color-blue);
  }
}
@media screen and (max-width: 768px) {
  .backList {
    margin-top: 40px;
    padding-top: 20px;
    display: block;
  }
  .backList a.back {
    margin: 0 0 10px;
    width: 100%;
    height: 48px;
    line-height: 46px;
    font-size: 1.6rem;
    order: 1;
  }
  .backList a.prev {
    margin-bottom: 20px;
    padding-left: 15px;
    width: 100%;
    line-height: 1.5;
  }
  .backList a.next {
    margin-top: 20px;
    padding-right: 15px;
    width: 100%;
    line-height: 1.5;
  }
  .backList .hs-search-results__prev-page,
  .backList .hs-search-results__next-page {
    margin-top: 0 !important;
    width: 50% !important;
  }
}
/* !SECTION */





/* !SECTION */
/* =============================================================================
 SECTION Top Page Styles
============================================================================= */

/* SECTION top common */
.contentIntro {
}
.topSectionLabel {
  line-height: 1.1875;
  color: var(--color-gray);
  font-family: var(--font-en);
  font-size: 8rem;
  font-weight: bold;
  letter-spacing: 0.1em;
}
.topSectionTitle {
  margin-bottom: 40px;
  line-height: 1.666;
  font-size: 2.7rem;
  font-weight: bold;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 768px) {
  .topSectionLabel {
    font-size: 4.2rem;
  }
  .topSectionTitle {
    margin-bottom: 30px;
    font-size: 2.2rem;
  }
}
/* !SECTION */


/* SECTION hero */
.hero {
  margin: 0 -50px;
  padding: 89px 50px 0;
  padding-bottom: min(80px,calc(80/880*100vh));
  position: relative;
  display: flex;
  align-items: center;
  height: calc(100vh - 90px);
}
.hero .heroImg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.hero .heroImg:before {
  content: '';
  display: block;
  position: absolute;
  bottom: -122px;
  left: calc(50% - 445px);
  width: 230px;
  height: 160px;
  background: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/top/hero_treat.png) 0 0 no-repeat;
  background-size: contain;
}
.hero .heroImg img {
  position: relative;
  width: 100%;
  max-width: inherit;
}
.hero .philosophy {
  margin: 0 auto;
  position: relative;
  width: 100%;
  max-width: var(--pc-content-wide);
  color: var(--color-white);
}
.hero .tagline {
  margin: 0 0 63px;
  position: relative;
  line-height: 1.1875;
  font-size: 8rem;
  font-weight: bold;
  letter-spacing: 0.12em;
  font-family: var(--font-en);
}
.hero .taglineMain {
  font-size: 7.2rem;
}
.hero .taglineSub {
  font-size: 2.4rem;
}
.hero .slogan {
  line-height: 1.958;
  font-size: 2.4rem;
  font-weight: bold;
  letter-spacing: 0.24em;
}
.hero .scroller {
  position: absolute;
  bottom: -58px;
  left: 50%;
  z-index: 3;
  width: 100%;
  height: 127px;
  max-width: 1200px;
  transform: translateX(-50%);
  pointer-events: none;
}
.hero .scroller:before {
  content: 'SCROLL';
  position: absolute;
  top: 0;
  left: 50px;
  color: var(--color-white);
  font-size: 1rem;
  font-weight: 600;
  font-family: var(--font-en);
  transform: rotate(90deg) translate(-120%,-75%);
  transform-origin: top left;
}
.hero .scroller span {
  position: absolute;
  bottom: 0;
  left: 50px;
  z-index: 3;
  width: 7px;
  height: 127px;
  overflow: hidden;
}
.hero .scroller span:before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 3px;
  width: 1px;
  height: 100%;
  background-image: linear-gradient(to bottom, var(--color-white) 50%, var(--color-blue) 50%);
}
.hero .scroller span:after {
	content: "";
	border-radius: 100%;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 7px;
	height: 7px;
	background-color: var(--color-red);
	opacity: 0;
	animation: guide 2s ease-out infinite;
}
@keyframes guide {
	0% {
		opacity: 0;
		top: 0;
	}
	19% {
		opacity: 0;
		top: 0;
	}
	20% {
		opacity: 1;
		top: 0;
	}
	100% {
		opacity: 1;
		top: 193px;
	}
}
@media screen and (max-width: 768px) {
  .hero {
    margin: 0;
    padding: 63px calc(20/375*100%) 97px;
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    height: 100vh;
    min-height: 360px;
  }
  .hero .heroImg:before {
    display: none;
  }
  .hero .philosophy {
    margin: 0 auto;
    position: relative;
    width: 100%;
    max-width: var(--pc-content-wide);
    color: var(--color-white);
  }
  .hero .tagline {
    margin: 0 0 calc(20/375*100vmin);
    font-size: calc(37/375*100vmin);
    letter-spacing: 0.06em;
    white-space: nowrap;
  }
  .hero .taglineMain {
    font-size: 2.4rem;
  }
  .hero .taglineSub {
    font-size: 2rem;
  }
  .hero .slogan {
    line-height: 1.888;
    font-size: calc(18/375*100vmin);
  }
  .hero .scroller {
    bottom: -49px;
    left: 0;
    height: 98px;
    transform: translateX(0);
  }
  .hero .scroller:before {
    left: calc(20/375*100%);
  }
  .hero .scroller span {
    left: calc(20/375*100%);
    height: 98px;
  }
}
/* !SECTION */



/* SECTION important news */
.importantNews {
  margin: -97px -50px 90px;
  position: relative;
  display: flex;
  z-index: 3;
  align-items: center;
  justify-content: flex-end;
}
.importantNewsInner {
  padding-right: 50px;
  width: calc(555/1300*100%);
  min-width: 455px;
  background-color: var(--color-white);
}
.importantNewsArea {
  padding: 42px;
  padding-right: 0;
  width: 100%;
  height: 194px;
}
.importantNewsHead {
  margin-bottom: 13px;
  display: flex;
  align-items: center;
  max-width: 405px;
  min-width: 355px;
}
.importantNews .labelEN {
  font-family: var(--font-en);
  font-size: 1.8rem;
  font-weight: bold;
  letter-spacing: 0.1em;
}
.importantNews .newsDate {
  margin: 0 20px;
  width: auto;
}
.importantNews .label {
  color: var(--color-red);
  font-size: 1.2rem;
  font-weight: bold;
  letter-spacing: 0.06em;
}
.importantNewsBody {
  display: flex;
  align-items: center;
  max-width: 405px;
  min-width: 355px;
}
.importantNews .newsTitle {
  margin: 0;
  width: calc(100% - 120px);
  /*
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  */
}
.importantNews .viewmore {
  margin-top: 25px;
  max-width: 405px;
  min-width: 355px;
  text-align: right;
}
@media screen and (max-width: 768px) {
  .importantNews {
    margin: -91px 0 60px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-end;
  }
  .importantNewsInner {
    margin-left: calc(53/375*100%);
    padding-right: calc(20/375*100%);
    width: calc(322/375*100%);
    min-width: inherit;
  }
  .importantNewsArea {
    padding: 20px 0 0 calc(30/322*100%);
    width: 100%;
    height: 130px;
  }
  .importantNewsHead {
    margin-bottom: 6px;
    display: flex;
    align-items: center;
    max-width: inherit;
    min-width: inherit;
  }
  .importantNews .labelEN {
    font-family: var(--font-en);
    font-size: 1.8rem;
    font-weight: bold;
    letter-spacing: 0.1em;
  }
  .importantNews .newsDate {
    margin: 0 10px;
    width: auto;
  }
  .importantNews .label {
    color: var(--color-red);
    font-size: 1.2rem;
    font-weight: bold;
    letter-spacing: 0.06em;
  }
  .importantNewsBody {
    display: flex;
    align-items: center;
    max-width: inherit;
    min-width: inherit;
  }
  .importantNews .newsCategory {
    width: 68px;
    height: 23px;
    font-size: 1rem;
  }
  .importantNews .newsTitle {
    width: calc(100% - 88px);
    line-height: 23px;
    font-size: 1.4rem;
  }
  .importantNews .viewmore {
    margin-top: 14px;
    max-width: inherit;
    min-width: inherit;
  }
}
@media screen and (max-width: 768px) {
  .importantNews .newsDate {
    margin: 0 5px;
    font-size: 1.2rem;
  }
}
/* !SECTION */



/* SECTION top lead */
.topLead {
  margin: 90px 50px 130px;
  position: relative;
  z-index: 4;
}
.topLead:after {
  content: '';
  display: block;
  position: absolute;
  bottom: -242px;
  left: calc(50% + 250px);
  width: 258px;
  height: 192px;
  background: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/top/lead_treat.png) 0 0 no-repeat;
  background-size: contain;
}
.topLead p {
  line-height: 2.5;
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 768px) {
  .topLead {
    margin: 60px 0 70px;
    padding: 0 calc(20/375*100%);
    position: relative;
  }
  .hero + .topLead {
    margin-top: 102px;
    z-index: 1;
  }
  .topLead:before {
    content: '';
    display: block;
    position: absolute;
    top: calc(-98/375*100vw);
    left: calc(10/375*100vw);
    width: calc(134/375*100vw);
    height: calc(98/375*100vw);
    background: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/top/hero_treat.png) 0 0 no-repeat;
    background-size: contain;
  }
  .topLead:after {
    bottom: -114px;
    left: calc(203/375*100vw);
    width: calc(154/375*100vw);
    height: calc(114/375*100vw);
  }
  .topLead p {
    line-height: 2.4;
    font-size: 1.5rem;
  }
}
/* !SECTION */



/* SECTION top product search */
.productSearch .topSectionLabel {
  margin-bottom: -.5em;
  color: var(--color-white);
}
.topProduct {
  position: relative;
}
ul.productPickup {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
ul.productPickup li {
  margin-bottom: 40px;
  position: relative;
  width: 48%;
}
ul.productPickup li .image {
  overflow: hidden;
}
ul.productPickup li dl {
  padding: 12px 18px;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  line-height: 24px;
  color: var(--color-white);
  background-color: rgba(0,0,0,.7);
}
ul.productPickup li dl dt {
  font-size: 1.8rem;
}
ul.productPickup li dl dd {
  overflow: hidden;
  font-size: 1.4rem;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.productSearchHead {
  display: flex;
  justify-content: space-between;
  height: 69px;
}
.productSearchSelector {
  display: flex;
  justify-content: space-between;
  width: 59.4%;
}
.productSearchSelector li {
  width: calc(50% - 5px);
}
.productSearchSelector li span {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 69px;
  color: var(--color-red);
  background-color: #ebebeb;
  font-weight: bold;
  letter-spacing: 0.1em;
  cursor: pointer;
  transition: var(--transition-all);
}
.productSearchSelector li span:hover,
.productSearchSelector li span.active {
  color: var(--color-white);
  background-color: var(--color-red);
}
.productSearchSelector li span:before {
  margin-right: 10px;
  content: '';
  display: block;
  width: 29px;
  height: 29px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
}
.productSearchSelector li span[data-cat="search-compound"]:before {
  background-image: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_beaker.svg);
}
.productSearchSelector li span[data-cat="search-compound"].active:before {
  background-image: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_beaker_r.svg);
}
.productSearchSelector li span[data-cat="search-casestudy"]:before {
  background-image: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_microscope.svg);
}
.productSearchSelector li span[data-cat="search-casestudy"].active:before {
  background-image: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_microscope_r.svg);
}
.productSearchBody {
  padding: 50px;
  border-top: 2px solid var(--color-red);
  display: none;
  background-color: var(--color-white);
}
.productSearchBody#search-compound {
  display: block;
}
.productSearchBody .link {
  margin: 40px auto 0;
  max-width: 255px;
}
.productSearchBody .link a {
  height: 60px;
  font-size: 1.5rem;
}
.productSearchList {
  display: flex;
  flex-wrap: wrap;
}
.productSearchList li {
  margin: 0 calc(36/900*100%) 0 0;
  width: calc(276/900*100%);
}
.productSearchList li:nth-child(3n) {
  margin-right: 0;
}
.productSearchList li .image {
  overflow: hidden;
}
.productSearchList li .name {
  margin: 20px 0 15px;
  line-height: 1.555;
  color: var(--color-blue);
  font-size: 1.8rem;
  font-weight: bold;
  letter-spacing: 0.01em;
}
.productSearchList li .name a,
.caseSearchList li dl dt a {
  color: var(--color-blue);
  background: linear-gradient(var(--color-blue), var(--color-blue)) 0 100%/0 2px no-repeat;
  text-decoration: none;
  transition: var(--transition-all);
}
.productSearchList li .text {
  line-height: 1.866;
}
.productSearchList li dl {
}
.productSearchList li dl dt {
  margin: 20px 0 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.productSearchList li dl dt span {
  border: 1px solid var(--color-green);
  border-radius: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 92px;
  height: 31px;
  color:var(--color-green);
  font-size: 1.1rem;
  font-weight: 500;
}
.productSearchList li dl dt:after {
  content: '';
  display: block;
  width: calc(100% - 105px);
  height: 1px;
  background-color: #e1e1e1;
}
.productSearchList li dl dd {
  padding-left: 13px;
  position: relative;
  line-height: 2;
  color: #767676;
  font-size: 1.3rem;
}
.productSearchList li dl dd:before {
  content: '';
  display: block;
  border-radius: 6px;
  position: absolute;
  top: .85em;
  left: 0;
  width: 6px;
  height: 6px;
  background-color: var(--color-red);
}
.productSearchList li .link {
  margin: 30px auto 0;
  max-width: 238px;
}
.topProduct .searchCas {
  position: absolute;
  top: 60px;
  right: 0;
  width: 35.5%;
}
.topProduct .searchCasBtn {
  background-color: var(--color-red);
  background-image: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_search.svg);
}
.caseSearchList {
  display: flex;
  flex-wrap: wrap;
}
.caseSearchList li {
  margin: 0 calc(40/900*100%) 0 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  width: calc(430/900*100%);
}
.caseSearchList li:nth-child(2n) {
  margin-right: 0;
}
.caseSearchList li:nth-child(n+3) {
  margin-top: 50px;
}
.caseSearchList li .image {
  width: calc(185/430*100%);
  overflow: hidden;
}
.caseSearchList li dl {
  width: calc(225/430*100%);
}
.caseSearchList li dl dt {
  margin: 0 0 12px;
  color: var(--color-blue);
  font-size: 1.8rem;
  font-weight: bold;
  letter-spacing: 0.1em;
}
.caseSearchList li dl dd {
/*
  padding-left: 13px;
*/
  position: relative;
  line-height: 2;
  color: #767676;
  font-size: 1.4rem;
}
/*
.caseSearchList li dl dd:before {
  content: '';
  display: block;
  position: absolute;
  top: .85em;
  left: 0;
  width: 6px;
  height: 6px;
  background-color: var(--color-blue);
}
*/
@media screen and (min-width: 769px) {
  .productSearchList {
    display: block;
  }
  .productSearchList li {
    margin: 0;
    position: relative;
    width: 100%;
    min-height: 145px;
  }
  .productSearchList li + li {
    margin-top: 40px;
  }
  .productSearchList li .image {
    position: absolute;
    top: 0;
    left: 0;
    width: 220px;
    overflow: hidden;
  }
  .productSearchList li .name {
    margin: 0 0 10px;
    padding-left: 250px;
    line-height: 1;
    color: var(--color-blue);
    font-size: 1.8rem;
    font-weight: bold;
    letter-spacing: 0.01em;
  }
  .productSearchList li .name a,
  .caseSearchList li dl dt a {
    color: var(--color-blue);
    background: linear-gradient(var(--color-blue), var(--color-blue)) 0 100%/0 2px no-repeat;
    text-decoration: none;
    transition: var(--transition-all);
  }
  .productSearchList li .text {
    padding-left: 250px;
    height: auto !important;
  }
  .productSearchList li dl {
    margin: 15px 0 0 250px;
    padding-left: 112px;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    height: auto !important;
    min-height: 32px;
  }
  .productSearchList li dl dt {
    margin: 0;
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    width: 92px;
    transform: translateY(-50%);
  }
  .productSearchList li dl dt:after {
    display: none;
  }
  .productSearchList li dl dd {
    margin-right: 20px;
  }
  .productIndex .productSearchList li dl {
    padding-right: 260px;
  }
  .productIndex .productSearchList li .link {
    margin: 0;
    position: absolute;
    bottom: 0;
    right: 0;
    width: 238px;
  }







  ul.productPickup li:nth-child(odd) {
    margin-right: 4%;
  }
  .productSearchList li .name a:hover,
  .caseSearchList li dl dt a:hover {
    background-size: 100% 2px;
  }
  .productSearchList li .image a {
    display: block;
    overflow: hidden;
  }
  .productSearchList li .image a img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: var(--transition-all);
  }
  .productSearchList li .image a:hover img {
    opacity: .8;
    transform: scale(1.08);
  }
}
@media screen and (max-width: 768px) {
  ul.productPickup {
    display: block;
  }
  ul.productPickup li {
    margin-bottom: 20px;
    width: 100%;
  }
  ul.productPickup li + li {
    margin-top: 20px;
  }
  ul.productPickup li dl dt {
    font-size: 1.6rem;
  }
  ul.productPickup li dl dd {
    font-size: 1.3rem;
  }
  .topProduct + .topProduct {
    margin-top: 40px;
  }
  .productSearchHead {
    display: block;
    height: 49px;
  }
  .productSearchSelector {
    width: 100%;
  }
  .productSearchSelector li {
    width: calc(50% - 3px);
    font-size: min(1.5rem,calc(15/375*100vw));
  }
  .productSearchSelector li span {
    height: 49px;
  }
  .productSearchSelector li span:before {
    margin-right: 5px;
  }
  .productSearchBody {
    padding: 30px calc(30/335*100%);
  }
  .productSearchBody .link {
    margin-top: 25px;
  }
  .productSearchBody .link a {
    height: 40px;
    font-size: 1.3rem;
  }
  .productSearchList {
    display: block;
  }
  .productSearchList li {
    margin: 0;
    width: 100%;
    overflow: hidden;
  }
  .productSearchList li + li {
    margin-top: 50px;
  }
  .productSearchList li .image {
    margin-left: 5px;
    float: right;
    width: calc(126/275*100%);
  }
  .productSearchList li .name {
    margin: 0 0 10px;
    font-size: 1.7rem;
  }
  .productSearchList li .text {
    line-height: 1.785;
  }
  .productSearchList li dl {
    clear: both;
  }
  .productSearchList li .link {
    margin-top: 15px;
  }
  .topProduct .searchCas {
    margin-top: 30px;
    position: static;
    width: 100%;
  }
  .topProduct .searchCasBtn {
    background-color: var(--color-red);
    background-image: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_search.svg);
  }
  .caseSearchList {
    display: block;
  }
  .caseSearchList li {
    margin: 0;
    width: 100%;
  }
  .caseSearchList li + li {
    margin-top: 20px !important;
  }
  .caseSearchList li dl dt {
    margin: 0 0 8px;
    font-size: 1.7rem;
  }
  .caseSearchList li dl dd {
    font-size: 1.3rem;
  }
}
/* !SECTION */



/* SECTION top topics */
.topTopics {
  padding-bottom: 0;
}
.topTopics .topSectionLabel {
  color: #1e5671;
  font-size: 5rem;
}
.topTopics .topSectionTitle {
  margin-bottom: 50px;
  font-size: 1.8rem;
}
.topTopicsList {
  position: relative;
  z-index: 1;
}
.topTopicsList:before {
  content: '';
  display: block;
  position: absolute;
  right: calc(50% - 248px);
  bottom: -76px;
  width: calc(50vw + 248px);
  height: calc(100% - 35px);
  background-color: var(--color-gray);
  pointer-events: none;
}
.topicsListBox .image {
  position: relative;
}
.topicsListBox .image a {
  display: block;
  overflow: hidden;
}
.topicsCategory {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 96px;
  height: 32px;
  color: var(--color-white);
  background-color: var(--color-green);
  font-size: 1.1rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  pointer-events: none;
}
.topicsListTitle {
  margin: 20px 0;
  line-height: 1.555;
  font-size: 1.8rem;
  font-weight: bold;
  letter-spacing: 0.1em;
}
.topicsListTitle a {
  color: var(--color-blue);
  background: linear-gradient(var(--color-blue), var(--color-blue)) 0 100%/0 2px no-repeat;
  text-decoration: none;
  transition: var(--transition-all);
}
.topTopics .viewmore {
  margin-top: 40px;
  text-align: right;
}
.topicsListText {
}
.topicsListText p {
  line-height: 1.866;
}
@media screen and (min-width: 769px) {
  .topTopicsList .topicsList {
    position: relative;
    display: flex;
  }
  .topTopicsList .topicsListBox {
    margin-right: 4.1%;
    width: 30.6%;
  }
  .topTopicsList .topicsListBox:nth-child(3n) {
    margin-right: 0;
  }
  .topicsListTitle a:hover {
    background-size: 100% 2px;
  }
}
@media screen and (max-width: 768px) {
  .topTopics:before {
    content: '';
    display: block;
    position: absolute;
    right: calc(80/375*100vw);
    bottom: 65px;
    width: calc(295/375*100vw);
    height: calc(100% - 232px);
    background-color: var(--color-gray);
    pointer-events: none;
  }
  .topTopics .topSectionLabel {
    font-size: 3.2rem;
  }
  .topTopics .topSectionTitle {
    margin-bottom: 30px;
    font-size: 1.5rem;
  }
  .topTopicsList {
    padding: 0 calc(15/335*100%);
    overflow: hidden;
  }
  .topTopicsList:before {
    display: none;
  }
  .topicsListTitle {
    margin: 20px 0 10px;
    line-height: 1.75;
    font-size: 1.6rem;
  }
  .topTopics .viewmore {
    margin-top: 30px;
  }
  .topTopicsList .topicsListText {
    padding-bottom: 40px;
  }
  .topTopicsList .slick-arrow {
    position: absolute;
    top: calc(88/375*100vw);
    z-index: 2;
    width: 33px;
    height: 33px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACEAAAAhCAYAAABX5MJvAAACYUlEQVRYhcWYz0sUYRjHPzOF4sHt4BJFsHQwtI5BWZ10ISH7ZT/pEFEbbRHW0sWjhw6LV7NDuiV1iepiRKQYGGRQ1h+QUV08G1ESy5Zu8cgzMoy7OzvvzG5fGAaGeb7Ph5l5n+d5x0qcvkEA7QZ69NwGtAAbgB/AN+AT8B54oeeqVA1EE5ACMsC2AMBfgCHgHpCvdKPtY3QUmANuBwQQtQLDGt9rAtEIjABPgUTA5F5J/Lj6NVYLEQMmgHTI5F6l1TfmB9Gg1F0RAzjqUv+GShDyDpM1AnCU1DwlIXpr8ArKKe3+WB2IJl1O9dSQ5l2FSEWwCoJK8l10Q2TqDODougPRYVCIVrTOtleOEJK8HeLQbeqRPtxJ9tJJLMsKA9ItEHtMo+9PztCW2Ez/mZ4wEHsFYrtpdL7whwuDd0nu3MGVI8blpd3Wdmys74u/OD+Y4+z+fZzq3GViE7dL1fKgsm2L5WKRllizSXizQPwMA7B1U5wnA32MTbzmzrNpE4tFWyciI7Vu2cjjgasMj7/kweQbU5sFgfhoGn0zdYLsw+c8mn5naiGaWw+Ig9EaO5cdYWm5GAZA9FaexJRpdAQAoimBmAU+R+FmIMk76xT+erdxR7dwddExYL7OAPO6HViFyP+Hdp5x9iPuPizjfa5OADnNhxdC1AfM1BhAqto19wUvxG/gEPCqRgDiexAoVIJAe8kBYDRigFH1XdOrys1mQnoZOBbBqpH44+pXKHWD34AoH0+7DqRfAyaX+yVO4mXXVVbSO/wky0h2THJ4/0/EdR6RR7yg/yc+6J5TKvFfX3fgH6xKfzC+6EPeAAAAAElFTkSuQmCC) 0 0 no-repeat;
    font-size: 0;
    cursor: pointer;
  }
  .topTopicsList .slick-prev {
    left: calc(-15/305*100%);
    transform: rotate(180deg);
  }
  .topTopicsList .slick-next {
    right: calc(-15/305*100%);
  }
}
/* !SECTION */



/* SECTION top company info */
.topCompanyInfo .topSectionLabel {
  margin-bottom: -.5em;
}
.topCompanyInfo ul li {
  padding: 100px 0;
  position: relative;
  display: flex;
  justify-content: space-between;
}
.topCompanyInfo ul li + li {
  margin-top: 50px;
}
.topCompanyInfo ul li:before {
  content: '';
  display: block;
  position: absolute;
  top: 50px;
  left: 50px;
  width: calc(100% - 100px);
  height: calc(100% - 50px);
  background-color: var(--color-gray);
}
.topCompanyInfo ul li:after {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  right: calc(50% - 50vw);
  width: calc(50vw + 250px);
  height: calc(100% - 50px);
  background-color: var(--color-green);
}
.topCompanyInfo ul li:nth-child(odd) {
  flex-direction: row-reverse;
}
.topCompanyInfo ul li:nth-child(odd):after {
  left: calc(50% - 50vw);
  right: auto;
}
.topCompanyInfo .image {
  position: relative;
  z-index: 2;
  width: 55%;
}
.topCompanyInfo ul li:nth-child(odd) .image {
  right: -50px;
}
.topCompanyInfo ul li:nth-child(even) .image {
  left: -50px;
}
.topCompanyInfo .info {
  position: relative;
  z-index: 4;
  width: 42.5%;
  color: var(--color-white);
}
.topCompanyInfo .title {
  line-height: 1.32;
  font-family: var(--font-en);
  font-size: 5rem;
  font-weight: bold;
}
.topCompanyInfo .label {
  margin: 10px 0 40px;
  font-size: 1.8rem;
}
.topCompanyInfo .text {
  line-height: 1.933;
}
.topCompanyInfo .viewmore {
  margin-top: 65px;
}
.topCompanyInfo .viewmore a {
  color: var(--color-white);
}
.topCompanyInfo .viewmore a:before {
  background-color: #2fb0b0;
}
.topCompanyInfo .viewmore a:after {
  border-color: var(--color-white);
}
@media screen and (max-width: 768px) {
  .topCompanyInfo .topSectionTitle {
    letter-spacing: 0;
  }
  .topCompanyInfo ul li {
    padding: 0 0 100px;
    display: block;
  }
  .topCompanyInfo ul li:before {
    top: auto;
    bottom: 0;
    left: 50%;
    width: 50vw;
    height: calc(100% - (60/375*100vw));
  }
  .topCompanyInfo ul li:after {
    top: auto;
    bottom: 50px;
    left: calc(-20/375*100vw);
    width: 100vw;
    height: calc(100% - (120/375*100vw) - 50px);
  }
  .topCompanyInfo ul li:nth-child(even):before {
    left: auto;
    right: 50%;
  }
  .topCompanyInfo .image {
    margin-bottom: 30px;
    position: relative;
    z-index: 2;
    width: 100%;
  }
  .topCompanyInfo ul li:nth-child(odd) .image {
    right: 0;
  }
  .topCompanyInfo ul li:nth-child(even) .image {
    left: 0;
  }
  .topCompanyInfo .info {
    width: 100%;
  }
  .topCompanyInfo .title {
    font-size: 3.2rem;
  }
  .topCompanyInfo .label {
    margin: 10px 0 30px;
    font-size: 1.5rem;
  }
  .topCompanyInfo .viewmore {
    margin-top: 30px;
  }
}
/* !SECTION */



/* SECTION top news */
.topNews {
  margin-bottom: 100px;
  padding-top: 0;
  padding-bottom: 0;
}
.topNews .topSectionLabel {
  margin-bottom: -.5em;
}
.topNewsHead p {
  margin: -30px 0 50px;
  line-height: 1.857;
  color: #808080;
  font-size: 1.4rem;
}
.topNews .viewmore {
  margin-top: 60px;
  text-align: right;
}
@media screen and (max-width: 768px) {
  .topNews {
    margin-bottom: 50px;
  }
  .topNewsHead p {
    margin: -20px 0 30px;
    line-height: 2;
    font-size: 1.3rem;
  }
  .topNews .viewmore {
    margin-top: 30px;
  }
}
/* !SECTION */







/* !SECTION */
































/* =============================================================================
 SECTION Company Pages Styles
============================================================================= */

/* SECTION company president */
.presidentMssg {
  display: flex;
  justify-content: space-between;
}
.presidentMssgBody {
  width: 64%;
}
.presidentMssgTitle {
  line-height: 1.875;
  font-size: 2.4rem;
  font-weight: bold;
}
.presidentMssgText p {
  margin-top: 1.5em;
  line-height: 2.133;
}
.presidentData {
  width: 24.1%;
}
.presidentTxt .post {
  margin: 30px 0 10px;
  line-height: 1.5;
  font-size: 1.3rem;
}
.presidentName {
  font-size: 1.8rem;
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  .presidentMssg {
    display: block;
  }
  .presidentMssgBody {
    width: 100%;
  }
  .presidentMssgTitle {
    font-size: 2rem;
  }
  .presidentMssgTitle br {
    display: none;
  }
  .presidentMssgText p {
    margin-top: 1em;
  }
  .presidentData {
    margin-top: 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
  }
  .presidentPhoto {
    width: 40%;
  }
  .presidentTxt {
    padding-left: 1em;
    width: 60%;
  }
  .presidentTxt .post {
    margin: 0 0 5px;
    line-height: 1.5;
    font-size: 1.1rem;
  }
  .presidentName {
    font-size: 1.5rem;
  }
}
/* !SECTION */



/* SECTION company strength */
.companyStrength .strengthTitle {
  margin-bottom: 80px;
  font-size: 2.4rem;
  font-weight: 700;
  text-align: center;
}
.companyStrength .strengthTitle strong {
  position: relative;
}
.companyStrength .strengthTitle strong:before {
  content: '';
  position: absolute;
  bottom: -2px;
  left: calc(50% - 10px);
  width: 18px;
  border-bottom: 4px dotted var(--color-red);
}
.companyStrengthBox {
  margin-bottom: 80px;
  padding: 60px 0 0;
  position: relative;
  z-index: 1;
}
.companyStrengthBox:after {
  content: 'STRENGTHS';
  display: block;
  position: absolute;
  top: 50px;
  right: 3%;
  z-index: -1;
  color: var(--color-red);
  font-family: var(--font-en);
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  transform-origin: top right;
  transform: rotate(90deg);
}
.companyStrengthBox .label {
  margin-bottom: -25px;
  position: relative;
  z-index: 2;
  color: var(--color-white);
  font-family: var(--font-en);
  font-size: 6.7rem;
  font-weight: 700;
}
.companyStrengthBox .title {
  position: relative;
  z-index: 2;
  line-height: 1.5;
  font-size: 2.4rem;
  font-weight: 700;
  letter-spacing: 0.1em;
}
.companyStrengthBox .inner {
  margin-top: -25px;
  position: relative;
  display: flex;
  align-items: flex-start;
}
.companyStrengthBox .text {
  margin-top: 100px;
  margin-right: -5%;
  padding: 40px 50px;
  position: relative;
  z-index: 2;
  width: 55%;
  line-height: 2;
  background-color: var(--color-white);
}
.companyStrengthBox .image {
  margin-left: -7.3%;
  position: relative;
  width: 57.3%;
}
.companyStrengthBox .image:before {
  content: '';
  display: block;
  position: absolute;
  bottom: 0;
  right: calc(80/573*100%);
  z-index: -1;
  width: calc(50vw + 87%);
  height: calc(100% + 115px);
  background-color: var(--color-gray);
}
.companyStrengthBox .num {
  position: absolute;
  bottom: -.5em;
  right: 12px;
  line-height: 1;
  z-index: 3;
  color: var(--color-red);
  font-family: var(--font-en);
  font-style: italic;
  font-size: 9.2rem;
  font-weight: 500;
}
.companyStrengthBox:nth-child(odd) .title,
.companyStrengthBox:nth-child(odd) .label {
  text-align: right;
}
.companyStrengthBox:last-child {
  margin-bottom: 0;
}
.groupStrength {
  padding-top: 0;
}
.groupStrength .strengthTitleEN {
  margin-bottom: -20px;
  color: var(--color-gray);
  font-family: var(--font-en);
  font-size: 8rem;
  font-weight: 700;
  text-align: center;
}
.groupStrength .strengthTitle {
  margin-bottom: 30px;
  font-size: 2.7rem;
  font-weight: 700;
  text-align: center;
}
.groupStrength .strengthSubTitleEN {
  margin-bottom: -20px;
  color: var(--color-gray);
  font-family: var(--font-en);
  font-size: 6.7rem;
  font-weight: 700;
  text-align: center;
}
.groupStrength .strengthSubTitle {
  margin-bottom: 30px;
  font-size: 2.4rem;
  font-weight: 700;
  text-align: center;
}
.groupStrengthBox {
  padding: 360px 0 0;
  position: relative;
  z-index: 1;
}
.groupStrengthBox:before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: calc(50% - 50vw);
  z-index: -1;
  width: 100vw;
  height: 610px;
  background: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/company/img_strength_04.png) top center no-repeat;
  background-size: cover;
}
.groupStrengthBox .lead {
  margin-bottom: 50px;
  padding: 30px;
  background-color: var(--color-white);
}
.groupStrengthBox .lead p {
  line-height: 2;
  text-align: center;
  letter-spacing: 0.06em;
}
.groupStrengthBox .lead p + p {
  margin-top: 1.5em;
}
.groupStrength ul {
  min-height: 623px;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  background: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/company/img_strength_05.png) center center no-repeat;
}
.groupStrength ul:before {
}
.groupStrength ul li {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  width: 45%;
}
.groupStrength ul li .icon {
  border-radius: 100px;
  width: 88px;
  height: 88px;
  color: var(--color-white);
  background-color: var(--color-green);
  font-family: var(--font-en);
  font-size: 3.2rem;
  font-weight: 500;
  text-align: center;
}
.groupStrength ul li .icon:before {
  padding: 25px 0 2px;
  content: 'FEATURE';
  display: block;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.14em;
}
.groupStrength dl {
  padding: 15px 0 0;
  width: calc(100% - 115px);
  line-height: 2;
}
.groupStrength dl dt {
  margin-bottom: 10px;
  font-size: 1.8rem;
  font-weight: 700;
}
.groupStrength dl dd {
}
@media screen and (min-width: 769px) {
  .companyStrengthBox:nth-child(odd) .inner {
    flex-direction: row-reverse;
  }
  .companyStrengthBox:nth-child(odd) .text {
    margin-right: 0;
    margin-left: -5%;
  }
  .companyStrengthBox:nth-child(odd) .image {
    margin-right: -7.3%;
    margin-left: 0;
  }
  .companyStrengthBox:nth-child(odd) .image:before {
    right: auto;
    left: calc(80/573*100%);
  }
  .companyStrengthBox:nth-child(odd) .num {
    right: auto;
    left: 12px;
  }
  .groupStrength ul li:nth-child(even) {
    padding-top: 80px;
  }
  .groupStrength ul li:nth-child(n+3) {
    margin-top: -80px;
  }
}
@media screen and (max-width: 768px) {
  .companyStrength .strengthTitle {
    margin-bottom: 50px;
    line-height: 1.5;
    font-size: 2rem;
  }
  .companyStrengthBox {
    margin-bottom: 80px;
    padding: 40px 0 0;
  }
  .companyStrengthBox:before {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    right: calc(20/335*100%);
    z-index: -1;
    width: 100vw;
    height: 100%;
    background-color: var(--color-gray);
  }
  .companyStrengthBox:after {
    top: 40px;
    right: -.5em;
    font-size: 1.1rem;
  }
  .companyStrengthBox .label {
    margin-bottom: -10px;
    font-size: 3.2rem;
  }
  .companyStrengthBox .title {
    font-size: 2rem;
  }
  .companyStrengthBox .inner {
    margin-top: 0;
    display: block;
  }
  .companyStrengthBox .text {
    margin: 25px 0 0;
    padding: 20px calc(20/335*100%);
    width: 100%;
  }
  .companyStrengthBox .image {
    margin: 0;
    width: 100%;
  }
  .companyStrengthBox .image:before {
    display: none;
  }
  .companyStrengthBox .num {
    right: 6px;
    font-size: 5rem;
  }
  .companyStrengthBox:nth-child(odd):before {
    right: auto;
    left: calc(20/335*100%);
  }
  .companyStrengthBox:nth-child(odd):after {
    right: auto;
    left: -7.5em;
  }
  .companyStrengthBox:nth-child(odd) .num {
    right: auto;
    left: 6px;
  }
  .groupStrength {
    padding-top: 0;
  }
  .groupStrength .strengthTitleEN {
    margin-bottom: -15px;
    font-size: 5rem;
  }
  .groupStrength .strengthTitle {
    margin-bottom: 30px;
    font-size: 2.2rem;
  }
  .groupStrength .strengthSubTitleEN {
    margin-bottom: -10px;
    font-size: 3.2rem;
  }
  .groupStrength .strengthSubTitle {
    margin-bottom: 20px;
    font-size: 2rem;
  }
  .groupStrengthBox {
    padding: 25vmin 0 0;
  }
  .groupStrengthBox:before {
    height: 50vmin;
  }
  .groupStrengthBox .lead {
    margin-bottom: 35px;
    padding: 20px calc(20/335*100%);
  }
  .groupStrengthBox .lead p {
    text-align: left;
  }
  .groupStrength ul {
    min-height: 623px;
    display: block;
    background: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/company/img_strength_05.png) center center no-repeat;
    background-size: contain;
  }
  .groupStrength ul li {
    width: 100%;
  }
  .groupStrength ul li + li {
    margin-top: 20px;
  }
  .groupStrength ul li .icon {
    width: 52px;
    height: 52px;
    font-size: 1.8rem;
  }
  .groupStrength ul li .icon:before {
    padding: 15px 0 2px;
    letter-spacing: 0;
  }
  .groupStrength dl {
    padding: 5px 0 0;
    width: calc(100% - 65px);
  }
  .groupStrength dl dt {
    margin-bottom: 5px;
    font-size: 1.5rem;
  }
  .groupStrength dl dd {
  }
}
/* !SECTION */



/* SECTION company outline */
.pageAnchor2 {
  margin-bottom: 70px;
}
.pageAnchor2 ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.pageAnchor2 ul li {
  width: 21%;
}
.pageAnchor2 ul li a {
  color: var(--color-blue);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-decoration: none;
  transition: var(--transition-all);
}
.pageAnchor2 ul li .en {
  margin-bottom: 15px;
  display: block;
  color: #ccc;
  font-size: 1rem;
  font-family: var(--font-en);
  font-size: 600;
  letter-spacing: 0.18em;
}
.pageAnchor2 ul li .jpn {
  width: 100%;
  position: relative;
  display: flex;
  align-items: center;
}
.pageAnchor2 ul li .jpn:before {
  content: '';
  display: block;
  position: absolute;
  top: 7px;
  left: 100px;
  width: calc(100% - 100px);
  height: 1px;
  background-color: #c7c7c7;
  background-image: linear-gradient(to right, var(--color-blue) 50%, #c7c7c7 50%);
  background-position: top right;
  background-repeat: no-repeat;
  background-size: 200% 1px;
  transition: var(--transition-all);
}
.pageAnchor2 ul li .jpn:after {
  margin: 0 15px;
  content: '';
  display: block;
  position: relative;
  top: -1px;
  border-top: 1px solid var(--color-blue);
  border-right: 1px solid var(--color-blue);
  width: 6px;
  height: 6px;
  transform: rotate(135deg);
  transition: var(--transition-all);
}
.companyOutline {
  margin-top: 100px;
}
.companyOutlineTitle {
  margin-bottom: 20px;
  line-height: 1.5;
  font-size: 1.8rem;
  font-weight: 700;
}
.companyOutline p {
  line-height: 2.1333;
}
.companyOutline a {
  display: inline-block;
  position: relative;
  color: var(--color-blue);
  text-decoration: underline;
}
.companyOutline a:after {
  margin-left: 14px;
  content: '';
  display: inline-block;
  border-top: 1px solid var(--color-blue);
  border-right: 1px solid var(--color-blue);
  width: 6px;
  height: 6px;
  transform: rotate(45deg);
  transform-origin: bottom right;
  vertical-align: middle;
}
.companyOutline a[href^='#']:after {
  margin-left: 20px;
  transform-origin: top left;
  transform: rotate(135deg);
}
.companyOutline a.pdf:after {
  margin-left: 8px;
  border: none;
  width: 13px;
  height: 16px;
  background: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_pdf.png) 0 0 no-repeat;
  transform: rotate(0) translateY(-1px);
}
.companyOutline a[target='_blank']:not(.pdf):after {
  margin-left: 8px;
  border: none;
  width: 14px;
  height: 11px;
  background: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_another.png) 0 0 no-repeat;
  transform: rotate(0) translateY(-1px);
}
.companyOutline table {
  border-top: 1px solid #e6e7e9;
  line-height: 1.866;
}
.companyOutline table th {
  padding: 20px 0;
  padding-right: 1em;
  border-bottom: 1px solid #e6e7e9;
  width: 150px;
  font-weight: 400;
  text-align: left;
}
.companyOutline table td {
  padding: 20px 0;
  border-bottom: 1px solid #e6e7e9;
  width: calc(100% - 150px);
}
.philosophy {
  padding: 100px 0 150px;
  position: relative;
  z-index: 1;
  text-align: center;
}
.philosophyTitle {
  margin-bottom: 25px;
  padding-bottom: 40px;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAGCAYAAACFIR03AAAAgklEQVQ4jc3TvQkCQRCG4WcPsQCNLEIr0hbM9KJrQFswsyOL0EhjMVEWTjgvWxYGv2iCb94Z5iddLac4Yo2EM3Z4Ld4XJbql1dcdxpzggO0gJ8dPtEWVfhXGzBu4YzYyPzCvmFYYsymi/aGa/pbGOlW2GsbMP7Dvn2IzMHaVxWKYdB/pzS3J0+7m8wAAAABJRU5ErkJggg==) bottom center no-repeat;
  font-family: 'Noto Serif JP', serif;
  font-style: normal;
  font-size: 3.2rem;
  font-weight: 400;
  letter-spacing: 0.48em;
}
.philosophy p {
  position: relative;
  z-index: 2;
  line-height: 3.125;
  font-size: 1.6rem;
  letter-spacing: 0.24em;
}
.philosophy p:before {
  content: '';
  display: block;
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  width: 430px;
  height: 116px;
  background: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/company/txt_philosophy.png) 0 0 no-repeat;
  background-size: contain;
  transform: translate(-50%,-50%);
}
.philosophyImage {
  position: absolute;
  width: 20.4%;
  height: min(445px,calc(445/1000*100vw));
  z-index: 1;
}
.philosophyImage:before {
  content: '';
  display: block;
  position: absolute;
  z-index: -1;
  width: 100%;
  height: 100%;
  background-color: #f7f7f7;
}
.philosophyImage:after {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  background-size: 100% auto;
  background-position: center center;
}
.philosophyImage.-img01 {
  top: 20px;
  left: 0;
}
.philosophyImage.-img01:before {
  right: -20px;
  top: -20px;
}
.philosophyImage.-img01:after {
  background-image: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/company/img_philosophy01.png);
}
.philosophyImage.-img02 {
  bottom: 20px;
  right: 0;
}
.philosophyImage.-img02:before {
  left: -20px;
  bottom: -20px;
}
.philosophyImage.-img02:after {
  background-image: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/company/img_philosophy02.png);
}
dl.settlementList {
  padding-top: 25px;
  border-top: 1px solid #e6e7e9;
}
dl.settlementList dt {
  margin-bottom: 15px;
  font-weight: 700;
}
dl.settlementList dd {
  margin-top: 10px;
  padding-left: 1em;
  position: relative;
  line-height: 1.5;
  color: var(--color-blue);
}
dl.settlementList dd:before {
  content: '・';
  position: absolute;
  top: 0;
  left: 0;
}
#company04 {
  padding-top: 100px;
  position: relative;
  z-index: 1;
}
#company04:before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  right: 50px;
  width: 100vw;
  z-index: -1;
  height: calc(100% - 270px);
  background-color: var(--color-gray);
}
.location + .location {
  margin-top: 70px;
}
.locationName {
  line-height: 2;
  font-size: 1.6rem;
  font-weight: 700;
}
.locationIntro {
  line-height: 2.133;
}
.locationSection {
  margin: 25px 0 80px;
  padding: 20px 30px;
  border-top: 1px solid var(--color-white);
  border-bottom: 1px solid var(--color-white);
  display: flex;
}
.locationSection dl {
  line-height: 2.133;
}
.locationSection dl + dl {
  margin: 0 0 0 40px;
}
.location + .location .locationSection {
  display: block;
}
.location + .location dl + dl {
  margin: 25px 0 0;
}
.locationSection dl dt {
  font-weight: 700;
}
.locationSection dl dd {
  font-size: 1.3rem;
}
.locationMap {
  padding: 50px 0 50px 70px;
  position: relative;
  background-color: var(--color-white);
}
.locationMap .lineTitle {
  margin: 0;
  position: absolute;
  left: calc(30px + 1em);
  top: -30px;
  line-height: 1;
  color: var(--color-green);
  font-family: var(--font-en);
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  transform: rotate(90deg);
  transform-origin: top left;
}
.locationMap .lineTitle:after {
  background-color: #e6e7e9;
}
.locationMapWrap {
  position: relative;
  width: 100%;
  height: 400px;
}
.locationMapWrap .hs-responsive-embed-wrapper {
  max-width: inherit !important;
  height: 100% !important;
}
.locationMapWrap .hs-responsive-embed-inner-wrapper {
  padding-bottom: 0 !important;
  height: 100% !important;
}
.locationMapWrap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
@media screen and (min-width: 769px) {
  .pageAnchor2 ul li a:hover {
  }
  .pageAnchor2 ul li a:hover .jpn:before {
    background-position: top left;
  }
  .pageAnchor2 ul li a:hover .jpn:after {
    top: 3px;
  }
  .companyOutline a:hover {
    text-decoration: none;
  }
}
@media screen and (max-width: 768px) {
  .pageAnchor2 {
    margin-bottom: 40px;
  }
  
  .pageAnchor2 ul li {
    width: 48%;
  }
  .pageAnchor2 ul li:nth-child(n+3) {
    margin-top: 20px;
  }
  .pageAnchor2 ul li .en {
    margin-bottom: 5px;
  } 
  .companyOutline {
    margin-top: 60px;
  }
  .companyOutlineTitle {
    margin-bottom: 15px;
    font-size: 1.5rem;
  }
  .companyOutline p {
    line-height: 2;
  }
  .companyOutline table th {
    padding: 15px 0;
    width: 80px;
  }
  .companyOutline table td {
    padding: 15px 0;
    width: calc(100% - 80px);
  }
  .philosophy {
    padding: 160px 0;
  }
  .philosophyTitle {
    margin-bottom: 15px;
    padding-bottom: 20px;
    background-size: 24px 3px;
    font-size: 2.4rem;
  }
  .philosophy p {
    line-height: 2;
    font-size: 1.5rem;
    letter-spacing: 0.14em;
  }
  .philosophy p:before {
    width: 301px;
    height: 82px;
  }
  .philosophyImage {
    width: calc(100% - 10px);
    height: 100px;
    z-index: 1;
  }
  .philosophyImage.-img01 {
    top: 0;
    left: 0;
  }
  .philosophyImage.-img01:before {
    right: -10px;
    top: 10px;
  }
  .philosophyImage.-img02 {
    bottom: 0;
    right: 0;
  }
  .philosophyImage.-img02:before {
    left: -10px;
    bottom: 10px;
  }
  dl.settlementList {
    padding-top: 20px;
  }
  dl.settlementList dt {
    margin-bottom: 15px;
    font-weight: 700;
  }
  #company04 {
    padding-top: 60px;
  }
  #company04:before {
    right: 0;
    height: 100%;
  }
  .location + .location {
    margin-top: 40px;
  }
  .locationName {
    font-size: 1.5rem;
  }
  .locationIntro {
    line-height: 2;
  }
  .locationSection {
    margin: 20px 0 60px;
    padding: 15px calc(20/335*100%);
    display: block;
  }
  .locationSection dl {
    line-height: 2.133;
  }
  .locationSection dl + dl {
    margin: 15px 0 0 !important;
  }
  .locationSection dl dd {
    font-size: 1.2rem;
  }
  .locationMap {
    padding: 20px 0 20px 30px;
  }
  .locationMap .lineTitle {
    left: calc(10/335*100% + 1em);
    top: -2em;
    font-size: 1.1rem;
  }
  .locationMap .lineTitle:after {
    background-color: #e6e7e9;
  }
  .locationMapWrap {
    position: relative;
    width: 100%;
    height: calc(200/375*100vw);
  }
  .locationMapWrap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
}
/* !SECTION */



/* SECTION company history */
.historyMssg {
  margin-bottom: 50px;
}
.historyMssg p {
  line-height: 2;
  text-align: center;
}
.historyGraph {
  width: calc(1072/1000*100%);
}
.historyGraphInner {
}
.historyGraphInner img {
}
@media screen and (max-width: 768px) {
  .historyMssg {
    margin-bottom: 30px;
  }
  .historyMssg p {
    text-align: left;
  }
  .historyMssg p br {
    display: none;
  }
  .historyGraph {
    width: 100%;
  }
  .historyGraphInner {
  }
  .historyGraphInner img {
    min-width: 750px;
  }
}
/* !SECTION */



/* SECTION company recruit */
.recruitMssg {
}
.recruitMssg p {
  line-height: 2;
}
@media screen and (max-width: 768px) {
}
/* !SECTION */







/* !SECTION */
/* =============================================================================
 SECTION Products Pages Styles
============================================================================= */


/* SECTION product index */
.productLead {
  margin-bottom: -80px;
  padding-bottom: 140px;
  position: relative;
  z-index: 1;
  min-height: 676px;
}
.productLead:before {
  content: '';
  display: block;
  position: absolute;
  bottom: 0;
  left: 50%;
  z-index: -1;
  width: 1300px;
  height: 616px;
  background: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/product/bg_product.png) bottom right no-repeat;
  transform: translateX(-50%);
}
.productLeadTitle {
  line-height: 1.5;
  font-size: 2.4rem;
  font-weight: 700;
}
.productLeadText p {
  margin-top: 25px;
  line-height: 2.133;
}
.productIndex {
  padding-top: 80px;
  position: relative;
  z-index: 1;
}
.productIndexPinckup {
}
.productIndexPinckup:before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: calc(100% - 50px);
  height: 100%;
  z-index: -1;
  background-color: var(--color-white);
}
.productIndexPinckup:after {
  content: '';
  display: block;
  position: absolute;
  top: 80px;
  left: calc(100% - 50px);
  width: calc(50vw - 50% + 50px);
  height: calc(100% - 80px);
  z-index: -1;
  background-color: var(--color-gray);
}
.productIndexSearch {
  padding: 70px 50px 80px;
  display: flex;
  justify-content: space-between;
  background-color: var(--color-gray);
}
.productIndexSearch dl {
  width: calc(100% - 304px);
}
.productIndexSearch dl:first-child {
  margin: 0 80px 0 30px;
  width: 194px;
}
.productIndexSearch dl dt {
  line-height: 1.2;
}
.productIndexSearch dl dd {
}
.productIndexSearch .searchCas {
  max-width: 100%;
}
@media screen and (max-width: 768px) {
  .productLead {
    margin-bottom: 0;
    padding-bottom: 60px;
    min-height: inherit;
  }
  .productLeadTitle {
    font-size: 2rem;
  }
  .productLeadText p {
    margin-top: 20px;
    line-height: 2;
  }
  .productIndex {
    padding-top: 50px;
  }
  .productIndexPinckup:before,
  .productIndexPinckup:after {
    display: none;
  }
  .productIndexSearch {
    padding: 30px calc(20/335*100%) 40px;
    display: block;
  }
  .productIndexSearch dl {
    width: 100%;
  }
  .productIndexSearch dl:first-child {
    margin: 0 0 30px;
    width: 100%;
  }
  .productIndexSearch .searchCas {
    max-width: 100%;
  }
  .productIndexSearch .searchCas .searchCasBtn {
    background: var(--color-blue) url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_search_b.svg) center center no-repeat;
  }
}
/* !SECTION */



/* SECTION product category */
.productsTable {
  margin-top: 70px;
}
.productsTableLead {
  margin: 0 0 30px;
}
.productsTableLeadText {
  width: 60%;
}
.productsTableLeadText p {
  line-height: 2;
}
.productsTableLeadImage {
  width: 35%;
}
.productsTableWrap {
  margin: 0 0 50px;
}
.productsTableBody {
  border-bottom: 1px solid #e6e7e9;
  min-width: 600px;
}
.productsTableBody-row {
  border-top: 1px solid #e6e7e9;
}
.productsTableBody-row,
.productsTableBody-row>a,
.productsTableBody-row-inner {
  display: flex;
  width: 100%;
  line-height: 1.5;
}
.productsTableBody-cell {
  border-left: 1px solid #e6e7e9;
}
.productsTableBody-row a {
  text-decoration: none;
}
.productsTableBody-cell.-th {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 56px;
  background-color: var(--color-gray);
  font-weight: 700;
}
.productsTableBody-cell.-td {
  padding: 10px 15px;
  display: flex;
  align-items: center;
  min-height: 80px;
}
.productsTableBody-cell.-cell01 {
  border-left: none;
  width: 27%;
  justify-content: center;
}
.productsTableBody-cell.-cell01.-td {
  justify-content: center;
}
.productsTableBody-cell.-cell02 {
  width: 26%;
}
.productsTableBody-cell.-cell03 {
  width: 30%;
}
.productsTableBody-cell.-cell04 {
  width: 17%;
}
.productsTableBody-cell.-cell05 {
  padding: 10px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 10px 0;
  width: 14%;
  width: 140px;
  flex-shrink: 0;
  text-align: center;
}


.productsTableBody {
  min-width: 720px;
}
.productsTableBody-cell.-cell01 {
  width: 26%;
}
.productsTableBody-cell.-cell02 {
  width: 20%;
}
.productsTableBody-cell.-cell03 {
  width: 25%;
}
.productsTableBody-cell.-cell04 {
  width: 15%;
}
.productsTableBody-cell.-cell05 {
  padding: 10px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 10px 0;
  width: 14%;
  width: 140px;
  flex-shrink: 0;
  text-align: center;
}
.productsTableBody-cell.-cell05 .linkDetail {
}
.productsTableBody-cell.-cell05 .linkDetail a {
  padding-right: 5px;
  width: 120px;
  border-color: var(--color-green);
  background-color: var(--color-green);
  text-align: center;
  letter-spacing: 0;
}
.productsTableBody-cell.-cell05 .linkDetail a:after {
  right: 10px;
}


.productsTable .conversion {
  margin: 0 auto;
  max-width: 900px;
}
.productsTable .inner {
  padding: 30px 40px 40px;
  background-color: #e7ecf4;
}
.productsTable .inner:before {
  display: none;
}
.productsTable .cnvBody {
}
.productsTable .cnvLead {
  margin-bottom: 20px;
  width: 100%;
}
.productsTable .cnvLead p {
  text-align: center;
}
.productsTable .conversion ul li a {
  height: 55px;
}
@media screen and (min-width: 769px) {
  .productsTableLead {
    display: flex;
    justify-content: space-between;
  }
  .productsTableLeadText:only-child {
    width: 100%;
  }
  .productsTableBody-row a {
    transition: var(--transition-all);
  }
  .productsTableBody-row a:hover {
    color: var(--color-white);
    background-color: var(--color-blue);
  }
  .productsTableBody-cell.-cell05 .linkDetail a:hover {
    color: var(--color-green);
    background-color: var(--color-white);
  }
  .productsTableBody-cell.-cell05 .linkDetail a:hover:after {
    border-color: var(--color-green);
  }
  .productsTable .conversion ul li {
    width: calc(400/820*100%) !important;
  }
  .productsTable .conversion ul li a {
    padding-left: 50px !important;
    background-position: center left 18px !important;
  }
}
@media screen and (max-width: 768px) {
  .productsTable {
    margin-top: 40px;
  }
  .productsTableLead {
    margin: 0 0 20px;
  }
  .productsTableLeadText {
    width: 100%;
  }
  .productsTableLeadImage {
    margin-top: 15px;
    width: 100%;
  }
  .productsTableWrap {
    margin: 0 0 30px;
  }
  .productsTable .inner {
    padding: 20px calc(20/335*100%) 30px;
  }
  .productsTable .inner:before {
    display: none;
  }
  .productsTable .cnvBody {
  }
  .productsTable .cnvLead {
    margin-bottom: 20px;
    width: 100%;
  }
  .productsTable .cnvLead p {
    text-align: left;
  }
  .productsTable .conversion ul li {
    height: auto !important;
  }
  .productsTable .conversion ul li a {
    padding-top: 8px;
    padding-bottom: 8px;
    height: auto !important;
    min-height: 50px;
    font-size: 1.3rem;
  }
  .productsTableBody-cell.-cell05 .linkDetail a {
    width: 90px;
    height: 40px;
    font-size: 1.1rem;
  }
  .productsTableBody-cell.-cell05 .linkDetail a:after {
    right: 7px;
  }
  .productsTableBody-cell.-cell05 {
    padding: 0 5px;
    width: 100px;
  }
}
/* !SECTION */



/* SECTION product list */
.productListSearch {
  margin: 0 0 80px;
}
.productListSearchTitle {
  margin-bottom: 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 1.4rem;
  font-family: var(--font-en);
  font-weight: 700;
  letter-spacing: 0.1em;
  white-space: nowrap;
}
.productListSearchTitle:before,
.productListSearchTitle:after {
  content: '';
  display: block;
  width: calc(50% - 100px);
  height: 1px;
  background-color: #e6e7e9;
}
.productListSearch dl {
  margin-top: 2px;
  padding: 25px;
  display: flex;
  line-height: 1.5;
  background-color: var(--color-gray);
}
.productListSearch dl dt {
  width: 150px;
  color: var(--color-blue);
  font-size: 1.6rem;
  font-weight: 700;
}
.productListSearch dl dd {
  width: calc(100% - 150px);
  color: #3a3a3a;
}
.productListSearch dl dd ul {
}
.productListSearch dl dd ul li {
  margin-right: 2em;
  display: inline-block;
  white-space: nowrap;
}
.productListSearch dl dd ul li input {
}
.productListSearchBtns {
  margin-top: 15px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.productListSearchBtns:before,
.productListSearchBtns:after {
  content: '';
  display: block;
  width: calc(50% - 190px);
  height: 1px;
  background-color: var(--color-blue);
}
.productListSearchBtn {
  margin-right: 15px;
  border: 1px solid var(--color-blue);
  display: flex;
  justify-content: center;
  align-items: center;
  width: 175px;
  height: 50px;
  color: var(--color-white);
  background-color: var(--color-blue);
  font-size: 1.4rem;
  cursor: pointer;
  transition: var(--transition-all);
}
.productListSearchBtn.-clear {
  margin-right: 20px;
  margin-left: 15px;
  color: var(--color-blue);
  background-color: var(--color-white);
}
.productListSearchResult {
}
.productListSearchResult .productsTableBody-row.-th {
  display: flex !important;
}
.resultLabel {
  margin-bottom: 30px;
  font-size: 1.8rem;
  font-weight: 700;
}
@media screen and (min-width: 769px) {
  .productListSearchBtn:hover {
    background-color: var(--color-white);
    color: var(--color-blue);
  }
  .productListSearchBtn.-clear:hover {
    color: var(--color-white);
    background-color: var(--color-blue);
  }
}
@media screen and (max-width: 768px) {
  .productListSearch {
    margin: 0 0 50px;
  }
  .productListSearchTitle {
    margin-bottom: 20px;
    font-size: 1.3rem;
  }
  .productListSearch dl {
    padding: 15px calc(20/335*100%);
    display: block;
  }
  .productListSearch dl dt {
    margin-bottom: 5px;
    width: auto;
    font-size: 1.5rem;
  }
  .productListSearch dl dd {
    width: 100%;;
  }
  .productListSearch dl dd ul {
  }
  .productListSearch dl dd ul li {
    margin-top: 0.5em;
    margin-right: 1em;
    display: inline-block;
  }
  .productListSearch dl dd ul li input {
  }
  .productListSearchBtns {
    margin-top: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .productListSearchBtns:before,
  .productListSearchBtns:after {
    width: calc(50% - 95px);
  }
  .productListSearchBtn {
    margin-right: 10px;
    width: 160px;
    height: 40px;
    font-size: 1.3rem;
  }
  .productListSearchBtn.-clear {
    margin-right: 10px;
    margin-left: 10px;
  }
  .resultLabel {
    margin-bottom: 20px;
    font-size: 1.5rem;
  }
}
/* !SECTION */



/* SECTION cas search */
.casSearResultList ul {
  border-top: 1px solid #e6e7e9;
}
.casSearResultList ul li {
  border-bottom: 1px solid #e6e7e9;
  line-height: 1.5;
}
.casSearResultList ul li a {
  padding: 20px 0;
  display: block;
  /*
  display: flex;
  align-items: center;
  justify-content: space-between;
  */
  color: var(--color-blue);
  text-decoration: none;
}
.casSearResultList ul li .casNum {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 130px;
  height: 30px;
  color: var(--color-blue) !important;
  background-color: var(--color-gray);
  font-size: 1.3rem;
  font-weight: 700;
}
.casSearResultList ul li .name {
  width: calc(100% - 140px);
}
.casSearResultList ul li .name:after {
  content: '';
  margin-left: 10px;
  display: inline-block;
  border-top: 1px solid var(--color-blue);
  border-right: 1px solid var(--color-blue);
  width: 6px;
  height: 6px;
  transform: rotate(45deg);
  transform-origin: top right;
  transition: var(--transition-all);
}
.casSearResult .backTop {
  margin-top: 40px;
  text-align: center;
}
.casSearResult .backTop a {
  border: 1px solid var(--color-blue);
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 220px;
  height: 50px;
  color: var(--color-white);
  background-color: var(--color-blue);
  font-size: 1.4rem;
  text-decoration: none;
  transition: var(--transition-all);
}
.casSearResult .backTop a:after {
  content: '';
  margin-left: 10px;
  display: inline-block;
  border-top: 1px solid var(--color-white);
  border-right: 1px solid var(--color-white);
  width: 6px;
  height: 6px;
  transform: rotate(45deg);
  transition: var(--transition-all);
}
.casSearResult .noResult {
  margin-top: 25px;
  display: none;
}
.casSearResult .noResult p {
  line-height: 2.133;
}
.casSearResult .noResult dl {
  margin-top: 25px;
  display: flex;
  justify-content: flex-start;
}
.casSearResult .noResult dl dt {
  margin: 0;
  white-space: nowrap;
}
.casSearResult .noResult dl dd.searchCas {
  margin-left: 30px;
  max-width: 538px;
}
.casSearResult .noResult dl dd.searchCas input[type="text"] {
  background-color: var(--color-gray);
}
@media screen and (min-width: 769px) {
  .casSearResultList ul li a:hover .name:after {
    margin-left: 15px;
  }
  .casSearResult .backTop a:hover {
    color: var(--color-blue);
    background-color: var(--color-white);
  }
  .casSearResult .backTop a:hover:after {
    border-color: var(--color-blue);
  }
}
@media screen and (max-width: 768px) {
  .casSearResultList ul li a {
    padding: 15px 0;
    display: block;
  }
  .casSearResultList ul li .casNum {
    margin-bottom: 5px;
  }
  .casSearResultList ul li .name {
    width: 100%;
  }
  .casSearResult .backTop {
    margin-top: 15px;
  }
  .casSearResult .backTop a {
    width: 220px;
    height: 40px;
    font-size: 1.3rem;
  }
  .casSearResult .noResult p {
    line-height: 2;
  }
  .casSearResult .noResult dl {
    margin-top: 15px;
    display: block;
  }
  .casSearResult .noResult dl dt {
    margin: 0;
    line-height: 1.5;
    white-space: nowrap;
  }
  .casSearResult .noResult dl dd.searchCas {
    margin: 10px 0 0;
    max-width: inherit;
  }
  .casSearResult .noResult dl dd.searchCas .searchCasBtn {
    background-color: var(--color-blue);
    background-image: url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_search_b.svg);
  }
}

/* !SECTION */



/* SECTION product detail */
.productDetailHeader {
  margin-bottom: 40px;
  display: flex;
  justify-content: space-between;
}
.productDetailHeaderText {
  width: 50%;
}
.productDetailHeaderText p {
  margin-top: 20px;
  line-height: 2.133;
}
.productDetailHeaderImage {
  width: 45%;
}
.productDetail-row,
.productCharacters {
  margin-top: 70px;
}
.productDetail-row .lineTitle {
  line-height: 1.33;
}
.productDetail-row p {
  line-height: 2.133;
}
.productDetail-row p + p,
.productDetail-row ul + ul {
  margin-top: 20px;
}
.productDetail-row ul li {
  padding-left: 28px;
  position: relative;
  line-height: 1.6;
}
.productDetail-row ul li:before {
  content: '';
  border-radius: 50%;
  display: block;
  position: absolute;
  top: .7em;
  left: 10px;
  width: 5px;
  height: 5px;
  background-color: #e3032d;
}
.productDetail-row.-paragraph {
  display: flex;
  justify-content: space-between;
}
.productDetail-row.-paragraph.-imageLeft {
  flex-direction: row-reverse;
}
.productDetail-row.-paragraph .text {
  width: 50%;
}
.productDetail-row.-paragraph .image {
  width: 42.8%;
}
.productDetail-row table {
  border-top: 1px solid #e6e7e9;
  width: 100%;
  line-height: 1.5;
}
.productDetail-row table th {
  padding: 15px 20px;
  border-bottom: 1px solid #e6e7e9;
  background-color: var(--color-gray);
  font-weight: 700;
}
.productDetail-row table td {
  padding: 15px 20px;
  border-bottom: 1px solid #e6e7e9;
}
.productDetail-row table td + td {
  border-left: 1px solid #e6e7e9;
}
.infoTable {
}
table.infoTable-table {
  width: 100%;
  min-width: 600px;
}
table.infoTable-table th {
  width: 14%;
  vertical-align: middle;
  text-align: left;
}
table.infoTable-table td {
  width: 36%;
  vertical-align: middle;
}
.productDetail-row.-column {
  display: flex;
  justify-content: space-between;
}
.productDetail .conversion {
  margin: 70px auto 0;
  max-width: 700px;
  position: relative;
}
.productDetail .conversion .inner {
  padding: 40px;
  background-color: #e7ecf4;
}
.productDetail .conversion .inner:before {
  display: none;
}
.productDetail .conversion .icon {
  top: -30px;
  left: calc(50% - 30px);
  width: 60px;
  height: 60px;
  font-size: 1.6rem;
}
.productDetail .conversion dl {
}
.productDetail .conversion dl dt {
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-blue);
  font-size: 1.8rem;
  font-weight: 700;
}
.productDetail .conversion dl dt:before,
.productDetail .conversion dl dt:after {
  margin: 0 30px;
  content: '';
  display: block;
  width: 40px;
  height: 1px;
  background-color: #a8b2c2;
}
.productDetail .conversion dl dd.linkDownload {
  margin: 0 auto;
  width: 100%;
  max-width: 534px;
}
.productCharacters h3 + .productDetail-row,
#hs_cos_wrapper_product_freearea .productDetail-row {
  margin-top: 0;
}
.productCharacters h4 {
  margin-top: 2em;
  margin-bottom: 15px;
  line-height: 1.33;
  font-size: 1.8rem;
}
.productCharacters .productDetail-row.-paragraph {
  margin-top: 0;
}
.productCharacters .productDetail-row.-paragraph + .productDetail-row.-paragraph {
  margin-top: 20px;
}
.productData h4,
.productProperty h4 {
  margin-bottom: 15px;
  font-size: 1.6rem;
}
.productData .infoTable + h4 {
  margin-top: 30px;
}
#hs_cos_wrapper_product_property_02 .lineTitle {
  display: none;
}
#hs_cos_wrapper_product_property_02 .productProperty {
  margin-top: 30px;
}
.pickupImages {
  margin-top: 30px;
  display: flex;
  justify-content: space-between;
}
.pickupImages .image {
  width: 49.5%;
}


@media screen and (min-width: 769px) {
  .productDetailHeaderText:only-child,
  .productDetail-row.-paragraph > *:only-child,
  .productDetail-row.-column > *:only-child {
    width: 100%;
  }
  .productDetail-row.-column .column {
    width: 48%;
  }
}
@media screen and (max-width: 768px) {
  .productDetailHeader {
    margin-bottom: 30px;
    display: block;
  }
  .productDetailHeaderText {
    width: 100%;
  }
  .productDetailHeaderText p {
    line-height: 2;
  }
  .productDetailHeaderImage {
    margin-top: 15px;
    width: 100%;
  }
  .productDetail-row,
  .productCharacters {
    margin-top: 40px;
  }
  .productDetail-row p {
    line-height: 2;
  }
  .productDetail-row p + p,
  .productDetail-row ul + ul {
    margin-top: 15px;
  }
  .productDetail-row.-paragraph {
    flex-direction: column-reverse !important;
  }
  .productDetail-row.-paragraph .text {
    width: 100%;
  }
  .productDetail-row.-paragraph .text + .image {
    margin-bottom: 15px;
  }
  .productDetail-row.-paragraph .image {
    width: 100%;
  }
  .productDetail-row table th,
  .productDetail-row table td {
    padding: 10px 15px;
  }
  table.infoTable-table th {
    width: 14%;
    vertical-align: middle;
    text-align: left;
  }
  .productDetail-row.-column {
    display: block;
  }
  .productDetail-row.-column .column:last-child {
    margin-top: 40px;
  }
  .productDetail .conversion {
    margin: 70px auto 0;
  }
  .productDetail .conversion .inner {
    padding: 20px calc(20/335*100%);
    padding-top: 40px;
  }
  .productDetail .conversion .icon {
    top: -20px;
    left: calc(50% - 20px);
    width: 40px;
    height: 40px;
    font-size: 1.4rem;
  }
  .productDetail .conversion dl {
  }
  .productDetail .conversion dl dt {
    margin-bottom: 15px;
    display: block;
    line-height: 1.33;
    font-size: 1.5rem;
  }
  .productDetail .conversion dl dt:before,
  .productDetail .conversion dl dt:after {
    display: none;
  }
  .productDetail .conversion dl dd.linkDownload a {
    padding-top: 8px;
    padding-bottom: 8px;
    height: auto !important;
    min-height: 50px;
    font-size: 1.3rem;kk
  }
  .productCharacters .productDetail-row.-paragraph + .productDetail-row.-paragraph {
    margin-top: 15px;
  }
  .productCharacters h4 {
    margin-bottom: 20px;
    font-size: 1.7rem;
  }
  .productData h4,
  .productProperty h4 {
    margin-bottom: 10px;
    font-size: 1.5rem;
  }
  .productData .infoTable + h4 {
    margin-top: 20px;
  }
  #hs_cos_wrapper_product_property_02 .productProperty {
    margin-top: 20px;
  }
  .pickupImages {
    margin-top: 20px;
    flex-direction: column;
    gap: 15px 0;;
  }
  .pickupImages .image {
    width: 100%;
  }
}
/* !SECTION */




/* !SECTION */
/* =============================================================================
 SECTION Research & Development Pages Styles
============================================================================= */

/* SECTION r6d style */.rdLead {
  margin-bottom: 80px;
  text-align: center;
}
.rdLeadLabel {
  margin-bottom: -0.5em;
  line-height: 1.1875;
  color: #f5f5f5;
  font-family: var(--font-en);
  font-size: 8rem;
  font-weight: bold;
  letter-spacing: 0.1em;
}
.rdLeadTitle {
  line-height: 1.875;
  font-size: 2.4rem;
  font-weight: bold;
}
.rdLeadText {
  margin: .5em 0 0;
}
.rdLeadText p {
  line-height: 1.875;
  font-size: 1.6rem;
  font-weight: 500;
}
.rdLeadText p .red {
  color: var(--color-red);
}
.rdLeadImage {
  margin-top: 30px;
}
.rd01 {
  margin-bottom: 80px;
  padding: 50px;
  background-color: var(--color-gray);
}
.rd01Text {
  margin-bottom: 30px;
  padding-bottom: 30px;
  border-bottom: 1px solid #c8c8c8;
  display: flex;
}
.rd01Text dl {
  width: 40%;
}
.rd01Text dl dt {
  margin-bottom: 0.5em;
  font-size: 1.8rem;
  font-weight: 700;
}
.rd01Text dl dd {
  line-height: 1.866;
}
.rd02 {
}
.rd02Title {
  font-size: 1.8rem;
  font-weight: 700;
}
.rd02List {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.rd02Box {
  margin-top: 15px;
  width: 49%;
}
.rd02Box dl {
  border: 1px solid #c8c8c8;
}
.rd02Box dl + dl {
  margin-top: 15px;
}
.rd02Box dl:only-child {
  height: 100%;
}
.rd02Box dl dt {
  padding: 16px 20px;
  line-height: 1.5;
  background-color: var(--color-gray);
  font-weight: 700;
}
.rd02Box dl dd {
  padding: 25px 15px;
}
.rd02Box dl dd .graphLabel {
  margin-bottom: 10px;
}
.rd02Box dl dd .graphWrap {
  width: 100%;
  text-align: center;
}
.rd02Box dl dd .graphWrap + .graphLabel {
  margin-top: 50px;
}
@media screen and (min-width: 769px) {
  .rd02Box03 dd {
    display: flex;
    align-items: center;
    width: 100%;
    height: calc(100% - 54px);
  }
}
@media screen and (max-width: 768px) {
  .rdLead {
    margin-bottom: 50px;
  }
  .rdLeadLabel {
    font-size: 4.2rem;
  }
  .rdLeadTitle {
    line-height: 1.33;
    font-size: 1.8rem;
  }
  .rdLeadText {
    margin: .5em 0 0;
  }
  .rdLeadText p {
    line-height: 1.875;
    font-size: 1.4rem;
  }
  .rdLeadImage {
    margin-top: 15px;
  }
  .rdLeadImage img {
    max-width: inherit;
    width: auto;
    height: 182px;
  }
  .rd01 {
    margin-bottom: 50px;
    padding: 20px calc(20/335*100%);
    background-color: var(--color-gray);
  }
  .rd01Text {
    margin-bottom: 15px;
    padding-bottom: 15px;
    display: block;
  }
  .rd01Text dl {
    width: 100%;
  }
  .rd01Text dl + dl {
    margin-top: 20px;
  }
  .rd01Text dl dt {
    font-size: 1.5rem;
  }
  .rd01Text dl dd {
    line-height: 1.5;
  }
  .rd01Image img {
    max-width: inherit;
    width: auto;
    height: 136px;
  }
  .rd02Title {
    font-size: 1.5rem;
  }
  .rd02List {
    display: block;
  }
  .rd02Box {
    margin-top: 10px;
    width: 100%;
  }
  .rd02Box dl + dl {
    margin-top: 10px;
  }
  .rd02Box dl:only-child {
    height: auto;
  }
  .rd02Box dl dt {
    padding: 10px calc(20/335*100%);
  }
  .rd02Box dl dd {
    padding: 12px calc(20/335*100%);
  }
  .rd02Box dl dd .graphWrap + .graphLabel {
    margin-top: 30px;
  }
}
/* !SECTION */




/* !SECTION */
/* =============================================================================
 SECTION Topics Pages Styles
============================================================================= */

/* SECTION Topics list */
div:not(.topTopicsList) .topicsList {
  display: flex;
  flex-wrap: wrap;
}
div:not(.topTopicsList) .topicsListBox {
  margin-right: 4.1%;
  width: 30.6%;
}
.topicsListDate {
  margin: 25px 0 -10px;
  color: #959595;
  font-family: var(--font-en);
  font-size: 1.3rem;
  font-weight: 400;
}
.topicsCategories {
  margin: 0 0 50px;
  padding: 20px 50px;
  background-color: var(--color-gray);
}
.topicsCategories dl {
  padding-left: 156px;
  position: relative;
  display: flex;
  flex-wrap: wrap;
}
.topicsCategories dl dt {
  display: flex;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  line-height: 40px;
  font-size: 1.8rem;
  font-weight: 700;
}
.topicsCategories dl dt:after {
  margin-left: 15px;
  content: '';
  display: inline-block;
  width: 40px;
  height: 1px;
  background-color: #9d9d9d;
}
.topicsCategories dl dd {
  margin-right: 10px;
}
.topicsCategories dl dd a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 110px;
  height: 40px;
  background-color: var(--color-white);
  font-size: 1.3rem;
  font-weight: 500;
  transition: var(--transition-all);
  text-decoration: none;
}
.topicsCategories dl dd a.-active {
  color: var(--color-white);
  background-color: var(--color-green);
}
@media screen and (min-width: 769px) {
  div:not(.topTopicsList) .topicsListBox:nth-child(3n) {
    margin-right: 0;
  }
  div:not(.topTopicsList) .topicsListBox:nth-child(n+4) {
    margin-top: 50px;
  }
  .topicsCategories dl dd a:hover,
  .topicsCategories dl dd a.current {
    color: var(--color-white);
    background-color: var(--color-green);
  }
}
@media screen and (max-width: 768px) {
  div:not(.topTopicsList) .topicsList {
    display: block;
  }
  div:not(.topTopicsList) .topicsListBox {
    margin-bottom: 30px;
    margin-right: 0;
    width: 100%;
  }
  div:not(.topTopicsList) .topicsListBox:last-child {
    margin-bottom: 0;
  }
  .topicsListDate {
    font-size: 1.2rem;
  }
  .topicsCategories {
    margin: 0 0 30px;
    padding: 10px calc(20/335*100%);
  }
  .topicsCategories dl {
    padding-left: 0;
  }
  .topicsCategories dl dt {
    position: static;
    width: 100%;
    line-height: 1.5;
    font-size: 1.5rem;
  }
  .topicsCategories dl dt:after {
    margin-left: 10px;
    width: 30px;
  }
  .topicsCategories dl dd {
    margin-top: 10px;
  }
  .topicsCategories dl dd a {
    width: 80px;
    height: 30px;
    font-size: 1.1rem;
  }
}
/* !SECTION */


/* SECTION Topics detail */
.topicsDetail {
  margin: 0 auto;
  max-width: 800px;
}
.topicsDetail .topicsDate {
  display: inline-block;
}
.topicsDetail .topicsCategory {
  margin-right: 20px;
  display: inline-flex;
  position: static;
}
.topicsArticle {
  margin: 30px 0 0;
  display: block;
}
.topicsArticle>* {
  margin-bottom: 40px;
}
.topicsArticle h2 {
  margin-bottom: 15px;
  padding-bottom: 15px;
  border-bottom: 3px solid #dbdbdb;
  line-height: 1.5;
  font-size: 2.4rem;
  font-weight: 700;
}
.topicsArticle h3 {
  margin-bottom: 15px;
  padding-bottom: 0.75em;
  border-bottom: 3px #dbdbdb double;
  position: relative;
  line-height: 1.523;
  font-size: 2.1rem;
  font-weight: 700;
}
.topicsArticle h4 {
  margin-bottom: 15px;
  padding-bottom: 0.75em;
  border-bottom: 3px #dbdbdb double;
  line-height: 1.666;
  font-size: 1.8rem;
  font-weight: 700;
}
.topicsArticle img {
  margin-bottom: 1.5em;
}
.topicsArticle p {
  margin-bottom: 1.5em;
  line-height: 1.866;
}
.topicsArticle p a {
  color: var(--color-blue);
  text-decoration: underline;
}
.topicsArticle p a:hover {
  text-decoration: none;
}
.topicsArticle ol {
  counter-reset: item;
}
.topicsArticle ol>li {
  position: relative;
  padding-left: 32px;
  line-height: 1.6;
  list-style-type: none;
}
.topicsArticle ol>li + li {
  margin-top: 12px;
}
.topicsArticle ol>li:before {
  counter-increment: item;
  content: counter(item);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: -1px;
  left: 0;
  width: 24px;
  height: 24px;
  color: var(--color-white);
  background-color: #c4c4c4;
  font-size: 1.2rem;
  font-weight: bold;
}
.shareBtns {
  padding: 40px 20px;
  background-color: var(--color-gray);
}
.shareBtns dl {
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
.shareBtns dl dt {
  margin-right: 40px;
  line-height: 21px;
  font-family: var(--font-en);
  font-size: 1.8rem;
  font-weight: 700;
  letter-spacing: 0.14em;
}
.relatedArticles {
  margin-top: 80px;
}
.relatedArticles ul {
  display: flex;
}
.relatedArticles ul li {
  width: calc(360/800*100%);
}
.relatedArticles ul li a {
  display: flex;
  justify-content: space-between;
  text-decoration: none;
}
.relatedArticleImage {
  width: calc(175/360*100%);
  overflow: hidden;
}
.relatedArticleBody {
  width: calc(160/360*100%);
}
.relatedArticleDate {
  padding: 5px 0 10px;
  color: #959595;
  font-family: var(--font-en);
  font-size: 1.1rem;
  letter-spacing: 0.06em;
}
.relatedArticleTitle {
  display: inline;
  line-height: 1.75;
  color: var(--color-blue);
  font-size: 1.6rem;
  font-weight: 700;
}
.topicsColumn {
  padding: 30px;
  border: 2px solid var(--color-gray);
  display: flex;
  justify-content: space-between;
}
.topicsColumnPhoto {
  width: calc(300/800*100%);
}
.topicsColumnText {
  width: calc(450/800*100%);
}
@media screen and (min-width: 769px) {
  .relatedArticles ul li + li {
    margin-left: calc(80/800*100%);
  }
  a .relatedArticleImage img {
    transition: var(--transition-all);
  }
  a:hover .relatedArticleImage img {
    transform: scale(1.08);
  }
  a .relatedArticleTitle {
    transition: var(--transition-all);
    background: linear-gradient(var(--color-blue), var(--color-blue)) 0 100%/0 2px no-repeat;
  }
  a:hover .relatedArticleTitle {
    transform: scale(1.08);
    background-size: 100% 2px;
  }
}
@media screen and (max-width: 768px) {
  .topicsArticle {
    margin: 20px 0 0;
  }
  .topicsArticle h2 {
    font-size: 2rem;
  }
  .topicsArticle h3 {
    font-size: 1.8rem;
  }
  .topicsArticle h4 {
    font-size: 1.5rem;
  }
  .topicsArticle>* {
    margin-bottom: 30px;
  }
  .shareBtns {
    padding: 20px calc(20/335*100%);
  }
  .shareBtns dl {
    flex-wrap: wrap;
  }
  .shareBtns dl dt {
    margin: 0 0 10px;
    width: 100%;
    font-size: 1.5rem;
    text-align: center;
  }
  .relatedArticles {
    margin-top: 50px;
  }
  .relatedArticles ul {
    display: block;
  }
  .relatedArticles ul li {
    width: 100%;
  }
  .relatedArticles ul li + li {
    margin-top: 15px;
  }
  .relatedArticleDate {
    padding: 2px 0 5px;
  }
  .relatedArticleTitle {
    font-size: 1.4rem;
  }
  .topicsColumn {
    padding: calc(20/335*100%);
    display: block;
  }
  .topicsColumnPhoto {
    margin-bottom: 15px;
    width: 100%;
  }
  .topicsColumnText {
    width: 100%;
  }
}
/* !SECTION */



/* !SECTION */
/* =============================================================================
 SECTION Document Pages Styles
============================================================================= */
.documentList {
  display: flex;
  flex-wrap: wrap;
}
.documentList .documentBox {
  margin-right: 4.1%;
  width: 30.6%;
}
.documentList + .sectionTitle {
  margin-top: 60px;
}
.documentBox .image {
  margin-bottom: 30px;
  position: relative;
}
.documentBox .image a {
  display: block;
  overflow: hidden;
}
.documentCastegory {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 96px;
  height: 32px;
  color: var(--color-white);
  background-color: var(--color-green);
  font-size: 1.1rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  pointer-events: none;
}
.documentCastegory.en {
  padding: 0 5px;
  width: auto;
}
.documentCastegory.cat01:before {
  content: '臭素化合物';
}
.documentCastegory.cat01.en:before {
  content: 'Bromine Compounds';
}
.documentCastegory.cat02:before {
  content: 'フッ素化合物';
}
.documentCastegory.cat02.en:before {
  content: 'Fluorine Compounds';
}
.documentCastegory.cat03:before {
  content: '有機金属化合物';
}
.documentCastegory.cat03.en:before {
  content: 'Organometallic Compounds';
}
.documentCastegory.cat04:before {
  content: '会社案内';
}
.documentCastegory.cat04.en:before {
  content: 'Company Profile';
}
.documentCastegory.cat05:before {
  content: 'その他';
}
.documentCastegory.cat05.en:before {
  content: 'Other';
}
.documentCastegory.cat06:before {
  content: '機能性モノマー';
}
.documentCastegory.cat06.en:before {
  content: 'Functional Monomers';
}
.documentTitle {
  margin: 10px 0 15px;
  line-height: 1.555;
  color: var(--color-blue);
  font-size: 1.8rem;
  font-weight: bold;
  letter-spacing: 0.1em;
}
.documentTitle a {
  color: var(--color-blue);
  background: linear-gradient(var(--color-blue), var(--color-blue)) 0 100%/0 2px no-repeat;
  text-decoration: none;
  transition: var(--transition-all);
}
.documentText {
}
.documentText p {
  line-height: 1.866;
}
.documentBox ul {
  margin-top: 15px;
}
.documentBox ul li {
  padding-left: 15px;
  font-size: 1.3rem;
}
.documentBox ul li:before {
  top: 0.65em;
  left: 0;
}
.documentLead {
  margin-bottom: 60px;
}
@media screen and (min-width: 769px) {
  .documentList .documentBox:nth-child(3n) {
    margin-right: 0;
  }
  .documentList .documentBox:nth-child(n+4) {
    margin-top: 30px;
  }
  .documentTitle a:hover {
    background-size: 100% 2px;
  }
  .documentLead .documentBox {
    margin: 0 auto;
    max-width: 900px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }
  .documentLead .documentBox .image {
    width: calc(263/900*100%);
  }
  .documentLead .documentBox .documentData {
    width: calc(610/900*100%);
  }
  .documentLead .documentBox .documentData:only-child {
    width: auto;
  }
}
@media screen and (max-width: 768px) {
  .documentList {
    display: block;
  }
  .documentList .documentBox {
    margin-right: 10%;
    width: 100%;
  }
  .documentList + .sectionTitle {
    margin-top: 40px;
  }
  .documentList .documentBox + .documentBox {
    margin-top: 20px;
  }
  .documentBox .image {
    margin-bottom: 15px;
  }
  .documentTitle {
    margin: 10px 0;
    line-height: 1.75;
    font-size: 1.6rem;
  }
  .documentBox ul {
    margin-top: 10px;
  }
  .documentBox ul li {
    font-size: 1.2rem;
  }
  .documentBox ul li:before {
    top: 0.6em;
  }
  .documentLead {
    margin-bottom: 40px;
  }
}
/* !SECTION */
/* =============================================================================
 SECTION News Pages Styles
============================================================================= */

.news {
  max-width: 900px;
}
.newsCategories {
  margin-bottom: 40px;
}
.newsCategories ul {
  display: flex;
  flex-wrap: wrap;
}
.newsCategories ul li {
  width: calc(216/900*100%);
}
.newsCategories ul li a {
  padding-bottom: 15px;
  border-bottom: 2px solid var(--color-green);
  display: block;
  text-align: center;
  text-decoration: none;
}
.newsCategories ul li a {
  padding-bottom: 15px;
  border-bottom: 2px solid var(--color-green);
  display: block;
  font-weight: 500;
  text-align: center;
  text-decoration: none;
  transition: var(--transition-op_vis);
}
@media screen and (min-width: 769px) {
  .newsCategories ul li + li {
    margin-left: calc(12/900*100%);
  }
  .newsCategories ul li a:hover {
    opacity: 0.6;
  }
}
@media screen and (max-width: 768px) {
  .newsCategories {
    margin-bottom: 20px;
  }
  .newsCategories ul li {
    width: 48.5%;
  }
  .newsCategories ul li:nth-child(n+3) {
    margin-top: 15px;
  }
}

.newsDetail {
  margin: 0 auto;
  max-width: 800px;
}
.newsDetail .newsDate {
  display: inline-block;
}
.newsDetail .newsCategory {
  display: inline-flex;
}
.newsArticle {
  margin: 30px 0 0;
  display: block;
}
.newsArticle>*,
.newsArticle span.hs_cos_wrapper_type_rich_text>* {
  margin-bottom: 40px;
}
.newsArticle h2 {
  margin-bottom: 15px;
  padding-left: 1.25em;
  border-left: 3px solid #e3032d;
  line-height: 1.5;
  font-size: 2.4rem;
  font-weight: 700;
}
.newsArticle h3 {
  margin-bottom: 15px;
  padding-bottom: 0.75em;
  padding-left: 1.619em;
  border-bottom: 3px #dbdbdb double;
  position: relative;
  line-height: 1.523;
  font-size: 2.1rem;
  font-weight: 700;
}
.newsArticle h3:before {
  content: '';
  display: block;
  position: absolute;
  top: .65em;
  left: 0;
  width: 8px;
  height: 8px;
  background-color: #e3032d;
  transform: rotate(45deg);
}
.newsArticle h4 {
  margin-bottom: 15px;
  padding-bottom: 0.75em;
  border-bottom: 3px #dbdbdb double;
  line-height: 1.666;
  font-size: 1.8rem;
  font-weight: 700;
}
.newsArticle p {
  line-height: 1.866;
}
.newsArticle p a {
  color: var(--color-blue);
  text-decoration: underline;
}
.newsArticle p a:hover {
  text-decoration: none;
}
.fullImage {
  text-align: center;
}
.newsArticle ol {
  counter-reset: item;
}
.newsArticle ol>li {
  position: relative;
  padding-left: 32px;
  line-height: 1.6;
  list-style-type: none;
}
.newsArticle ol>li + li {
  margin-top: 12px;
}
.newsArticle ol>li:before {
  counter-increment: item;
  content: counter(item);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: -1px;
  left: 0;
  width: 24px;
  height: 24px;
  color: var(--color-white);
  background-color: #c4c4c4;
  font-size: 1.2rem;
  font-weight: bold;
}
.newsArticle table {
  width: 100%;
  line-height: 1.6;
}
.newsArticle table th {
  padding: 20px;
  border: 1px solid #EDEDED;
  background-color: #F8F8F8;
  font-weight: bold;
  text-align: center;
}
.newsArticle table td {
  padding: 20px;
  border: 1px solid #EDEDED;
}
.newsArticle .textWithImage {
  display: flex;
  justify-content: space-between;
}
.newsArticle .textWithImage.imageRight {
  flex-direction: row-reverse;
}
.newsArticle .textWithImage .image {
  width: calc(450/1020*100%);
}
.newsArticle .textWithImage .text {
  width: calc(510/1020*100%);
}
.newsArticle .textWithImage p {
}
.newsArticle .twiColumnTable {
  margin: 80px 0;
}
.newsArticle .anotherLink a {
  margin-right: 40px;
  padding: 0 45px .4em 0;
  border-bottom: 1px solid var(--black-color);
  display: inline-block;
  position: relative;
  font-size: 1.6rem;
  font-weight: 500;
  text-align: left;
  text-decoration: none;
}
.newsArticle .anotherLink a:last-child {
  margin-right: 0;
}
.newsArticle .anotherLink a:after {
  content: '';
  display: block;
  position: absolute;
  top: .2em;
  right: 0;
  width: 15px;
  height: 15px;
  background: var(--icon-arrow);
}
.newsArticle .anotherLink a[target="_blank"] {
  padding-left: 22px;
}
.newsArticle .anotherLink a[target="_blank"]:before {
  content: '';
  display: block;
  position: absolute;
  top: .2em;
  left: 0;
  width: 14px;
  height: 14px;
  background: url() no-repeat 0 0 / contain;
}
@media screen and (max-width: 768px) {
  .newsArticle {
    margin: 20px 0 0;
  }
  .newsArticle h2 {
    font-size: 2rem;
  }
  .newsArticle h3 {
    font-size: 1.8rem;
  }
  .newsArticle h4 {
    font-size: 1.5rem;
  }
  .newsArticle>*,
  .newsArticle span.hs_cos_wrapper_type_rich_text>* {
    margin-bottom: 30px;
  }
  .newsArticle .textWithImage {
    display: block;
  }
  .newsArticle .textWithImage .image {
    margin-bottom: 20px;
    width: 100%;
  }
  .newsArticle .textWithImage .text {
    width: 100%;
  }
  .newsDetail table th,
  .newsDetail table td {
    padding: 15px;
  }
  .newsArticle .twiColumnTable {
    margin: 40px 0;
  }
  .newsArticle .twiColumnTable tbody,
  .newsArticle .twiColumnTable tr,
  .newsArticle .twiColumnTable th,
  .newsArticle .twiColumnTable td {
    display: block;
    width: 100%;
  }
  .newsArticle .twiColumnTable table th,
  .newsArticle .twiColumnTable table td {
    padding: 15px;
    width: 100%;
  }
  .newsArticle .anotherLink {
  }
  .newsArticle .anotherLink a {
    margin-right: 30px;
    padding-right: 30px;
    font-size: 1.5rem;
  }
  .newsArticle .anotherLink a + a,
  .newsArticle .centerButton a + a {
    margin-top: 15px;
  }
  .newsArticle .anotherLink a:after,
  .newsDetail .backList a:after {
    top: .2em;
    width: 13px;
    height: 13px;
  }
  .newsArticle .anotherLink a[target="_blank"] {
    padding-left: 22px;
  }
  .newsArticle .anotherLink a[target="_blank"]:before {
    top: .3em;
    width: 12px;
    height: 12px;
  }
  .newsArticle .centerButton a {
    margin: 0;
  }
}
/* !SECTION */
/* =============================================================================
 SECTION Form Pages Styles
============================================================================= */

.formPage {
  margin: 0 auto;
  max-width: 900px;
}
.formFlow {
  margin-bottom: 30px;
}
.formFlow ul {
  display: flex;
  background-color: #e8e8e8;
}
.formFlow ul li {
  padding-left: 30px;
  display: flex;
  align-items: center;
  position: relative;
  width: 50%;
  height: 60px;
}
.formFlow ul li:last-child {
  padding-left: 50px;
}
.formFlow ul li .label {
  font-family: var(--font-en);
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: 0.18em;
}
.formFlow ul li .num {
  margin: 0 15px 0 10px;
  font-family: var(--font-en);
  font-size: 3.2rem;
  font-weight: 500;
}
.formFlow ul li.current {
  color: var(--color-white);
  background-color: var(--color-blue);
}
.formFlow ul li:last-child:before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 30px 0 30px 20px;
  border-color: transparent transparent transparent var(--color-blue);
}
.formFlow ul li.current:last-child:before {
  border-color: transparent transparent transparent #e8e8e8;
}
.formFlow ul li .title {
}
.formArea {
}
.formArea p {
  line-height: 1.866;
}
.formArea .agreement {
  margin-top: 50px;
}
.formArea .agreementLabel {
  margin-bottom: 20px;
  font-size: 1.5rem;
  font-weight: 700;
  text-align: center;
}
.formArea .agreement .privacypolicy {
  padding: 40px;
  border: 1px solid #e6e7e9;
  background-color: #fbfbfb;
}
.formArea .agreement .inner {
  padding-right: 1em;
  height: 200px;
  overflow: auto;
}
.formArea .agreement .privacypolicy p,
.formArea .agreement .privacypolicy li {
  font-size: 1.3rem;
}
.thanksMssg {
  text-align: center;
}
.thanksMssgTitle {
  margin-bottom: 30px;
  line-height: 1.5;
  font-size: 2.4rem;
  font-weight: 700;
}
.thanksMssg p {
  margin-top: 20px;
  line-height: 1.866;
}
.formLinks {
  margin-top: 40px;
}
.formLinks ul {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.formLinks ul li {
  margin-top: 10px;
  width: calc(290/900*100%);
}
.formLinks ul li a {
  padding-right: 30px;
  border: 1px solid var(--color-blue);
  position: relative;
  display: flex;
  align-items: center;
  height: 56px;
  color: var(--color-blue);
  text-decoration: none;
  transition: var(--transition-all);
}
.formLinks ul li a:before {
  margin-right: 20px;
  content: '';
  display: block;
  width: 54px;
  height: 100%;
  background-color: #c5c5c5;
}
.formLinks ul li a:after {
  content: '';
  display: block;
  position: absolute;
  top: calc(50% - 3px);
  right: 18px;
  border-top: 1px solid var(--color-blue);
  border-right: 1px solid var(--color-blue);
  width: 6px;
  height: 6px;
  transform: rotate(45deg);
  transition: var(--transition-all);
}
@media screen and (min-width: 769px) {
  .formLinks ul li a:hover {
    color: var(--color-white);
    background-color: var(--color-blue);
  }
  .formLinks ul li a:hover:after {
    border-color: var(--color-white);
  }
}
@media screen and (max-width: 768px) {
  .formFlow {
    margin-bottom: 20px;
  }
  .formFlow ul li {
    padding-left: 15px;
    height: 40px;
  }
  .formFlow ul li:last-child {
    padding-left: 30px;
  }
  .formFlow ul li .label {
    font-size: 1rem;
  }
  .formFlow ul li .num {
    margin: 0 5px;
    font-size: 2.2rem;
  }
  .formFlow ul li .title {
    font-size: 1.2rem;
  }
  .formFlow ul li:last-child:before {
    border-width: 20px 0 20px 15px;
  }
  .formArea {
  }
  .formArea p {
    line-height: 1.866;
  }
  .formArea .agreement {
  }
  .formArea .agreement .privacypolicy {
    padding: calc(20/335*100%);
  }
  .formArea .agreement .inner {
    padding-right: .5em;
  }
  .formArea .agreement .privacypolicy p,
  .formArea .agreement .privacypolicy li {
    font-size: 1.1rem;
  }
  .thanksMssgTitle {
    margin-bottom: 20px;
    font-size: 1.8rem;
  }
  .thanksMssg p {
    margin-top: 15px;
    text-align: left;
  }
  .formLinks {
    margin-top: 20px;
  }
  .formLinks ul li {
    width: 100%;
  }
  .formLinks ul li a {
    height: 50px;
  }
  .formLinks ul li a:before {
    margin-right: 15px;
    width: 50px;
    height: 100%;
  }
}



.formArea * {
  color: var(--color-base);
}
.formArea .hs-form-field {
  margin: 0;
  padding: 20px 0;
  border-bottom: 1px solid #e6e7e9;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.formArea form label:not(.hs-error-msg):not(.hs-form-radio-display):not(.hs-form-checkbox-display) {
  padding: 15px 1em 0 70px;
  position: relative;
  width: 270px;
  line-height: 2.133;
  font-size: 1.5rem;
  font-weight: 700;
}
.formArea form .hs_error_rollup ul.hs-error-msgs label {
  padding: 0 !important;
  width: auto !important;
  text-align: center;
}
.formArea form label:not(.hs-error-msg):not(.hs-form-radio-display):not(.hs-form-checkbox-display) p {
  line-height: 1.5;
}
.hs-form-required {
  position: absolute;
  top: 15px;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 32px;
  color: var(--color-white);
  background-color: #ad3434;
  font-size: 0;
  font-weight: 400;
  text-align: center;
  vertical-align: text-top;
}
.hs-form-required:before {
  content: '必須';
  font-size: 1.2rem;
}
.formArea .hs-form-field>.input {
  width: calc(100% - 270px);
}
.formArea .hs-form-field>.input ul.inputs-list {
}
.formArea .hs-form-field>.input ul.inputs-list li {
  margin: 0 1em 10px 0;
  display: inline-block;
  font-size: 1.5rem;
}
.formArea .hs-form-field>.input ul.inputs-list li label {
  margin: 0;
  font-size: 1.5rem;
}
.formArea form input[type=text], .formArea form input[type=email], .formArea form input[type=password], .formArea form input[type=tel], .formArea form input[type=number], .formArea form input[type=file], .formArea form select, .formArea form textarea {
  border: none;
  width: 100% !important;
  min-height: 56px;
  background-color: var(--color-gray);
  font-size: 1.5rem;
  outline: none;
}
.formArea form textarea {
  height: 280px;
}
.hs-error-msg {
  padding-left: 270px;
  width: 100%;
  color: #ad3434;
  font-size: 1.2rem;
}
.hs-error-msgs * {
  color: #ad3434;
}

.formArea .hs_agreement_policy {
  border: none;
  display: block;
}
.formArea .hs_agreement_policy .input {
  width: 100%;
}
.formArea .hs_agreement_policy .input ul.inputs-list li {
  margin: 0;
  display: block;
}
.formArea .hs_agreement_policy .input ul.inputs-list li label {
  padding: 50px 0 0;
  width: 100%;
  text-align: center;
}
.formArea .hs_agreement_policy .input ul.inputs-list li label .hs-form-required {
  top: 0;
  left: calc(50% - 23px);
}
.formArea .hs-richtext {
  margin: 27px 0 29px;
}
.formArea .hs-richtext p {
  line-height: 2.133;
  font-size: 1.5rem;
}
.formArea .hs-richtext p a {
  text-decoration: underline;
}
.formArea .hs_submit {
  text-align: center;
}
.formArea .hs_submit .actions {
  margin: 0 auto;
  border: 1px solid #be941a;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 1;
  overflow: hidden;
  width: 100%;
  max-width: 270px;
  height: 60px;
  color: var(--color-white);
  background-color: #be941a;
  font-weight: bold;
  text-decoration: none;
  transition: var(--transition-all);
  font-size: 1.8rem;
  cursor: pointer;
}
.formArea .hs_submit .actions input,
.formArea .hs_submit .actions button {
  font-size: 1.8rem;
}
/*
.formArea .hs_submit .actions:before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  background-color: var(--color-base);
  transform: translateX(-100%);
  transition: var(--transition-all);
}
*/
.formArea .hs_submit .actions:after {
  content: '';
  border-top: 2px solid var(--color-white);
  border-right: 2px solid var(--color-white);
  display: block;
  position: absolute;
  top: calc(50% - 4px);
  right: 22px;
  width: 8px;
  height: 8px;
  transform: rotate(45deg);
  transition: var(--transition-all);
}
.formArea .hs_submit input[type=submit] {
  border-radius: 0;
  border: none;
  width: 100%;
  height: 100%;
  background-color: transparent;
  font-weight: bold;
}
.submitted-message {
  line-height: 1.777;
  overflow: initial !important;
}
@media screen and (min-width: 768px) {
  .formArea .hs_submit .actions:hover {
    color: #be941a;
    background-color: var(--color-white);
  }
  .formArea .hs_submit .actions:hover:after {
    border-color: #be941a;
  }
  .formArea .hs_submit .actions:hover input[type=submit] {
    color: #be941a;
  }
  .formArea .hs-form-field.hs-fieldtype-radio,
  .formArea .hs-form-field.hs-fieldtype-checkbox {
    padding-top: 5px;
  }
  .formArea .hs-form-field ul.inputs-list.multi-container {
    padding-top: 19px;
  }
}
@media screen and (max-width: 768px) {
  .formArea .hs-form-field {
    padding: 15px 0;
    display: block;
  }
  .formArea form label:not(.hs-error-msg):not(.hs-form-radio-display):not(.hs-form-checkbox-display) {
    margin-bottom: 10px;
    padding: 0 0 0 55px;
    width: 100%;
    line-height: 1.857;
    font-size: 1.4rem;
  }
  .hs-form-required {
    top: 0;
    left: 0;
    width: 40px;
    height: 26px;
  }
  .hs-form-required:before {
    font-size: 1.1rem;
  }
  .formArea .hs-form-field>.input {
    width: 100%;
  }
  .formArea .hs-form-field>.input ul.inputs-list li {
    font-size: 1.4rem;
  }
  .formArea .hs-form-field>.input ul.inputs-list li label {
    font-size: 1.4rem;
  }
  .formArea form input[type=text], .formArea form input[type=email], .formArea form input[type=password], .formArea form input[type=tel], .formArea form input[type=number], .formArea form input[type=file], .formArea form select, .formArea form textarea {
    min-height: 40px;
    font-size: 1.4rem;
  }
  .formArea form textarea {
    height: 200px;
  }
  .hs-error-msg {
    padding-left: 0;
    font-size: 1.1rem;
  }
  .formArea .agreement {
    margin-top: 35px;
  }
  .formArea .hs-richtext {
    margin: 0 0 15px;
  }
  .formArea .hs_agreement_policy .input ul.inputs-list li label {
    padding: 35px 0 0;
  }
  .formArea .hs_agreement_policy .input ul.inputs-list li label .hs-form-required {
    left: calc(50% - 20px);
  }
  .formArea .hs-richtext p {
    line-height: 2;
    font-size: 1.4rem;
  }
  .formArea .hs_submit {
    text-align: center;
  }
  .formArea .hs_submit .actions {
    height: 50px;
    font-size: 1.5rem;
  }
  .formArea .hs_submit .actions input,
  .formArea .hs_submit .actions button {
    font-size: 1.5rem;
  }
}














/* !SECTION */
/* =============================================================================
 SECTION rule Pages Styles
============================================================================= */

.policy .policySubTitle {
  margin-top: 3em;
  margin-bottom: 1em;
  padding-bottom: 1em;
  border-bottom: 1px solid #e6e7e9;
  line-height: 1.5;
  font-size: 1.8rem;
  font-weight: 700;
}
.policy p {
  line-height: 1.866;
}
.policy p a {
  padding-right: 25px;
  display: inline-block;
  position: relative;
  color: var(--color-blue);
  text-decoration: underline;
}
.policy p a:after {
  content: '';
  display: block;
  border-top: 1px solid var(--color-blue);
  border-right: 1px solid var(--color-blue);
  position: absolute;
  top: 10px;
  right: 2px;
  width: 6px;
  height: 6px;
  transform: rotate(45deg);
}
.policy p + p {
  margin-top: 2em;
}
.policy ol {
  margin-top: 1em;
  counter-reset: item;
}
.policy ol>li {
  padding-left: 1.5em;
  text-indent: -1.5em;
  position: relative;
  line-height: 1.866;
  list-style-type: none;
}
.policy ol>li + li {
  margin-top: .5em;
}
.policy ol>li:before {
  counter-increment: item;
  content: counter(item) '. ';
}
.policy dl {
  counter-reset: item;
  line-height: 1.866;
}
.policy dl dt {
  margin-bottom: .5em;
  padding-left: 1.5em;
  text-indent: -1.5em;
  position: relative;
  line-height: 1.866;
  list-style-type: none;
  font-weight: 700;
}
.policy dl dt:before {
  counter-increment: item;
  content: counter(item) '. ';
}
.policy dl dd + dt {
  margin-top: 2em;
}

@media screen and (min-width: 769px) {
  .policy p a:hover {
    text-decoration: none;
  }
}
@media screen and (max-width: 768px) {
  .policy .policySubTitle {
    font-size: 1.5rem;
  }
}





/* !SECTION */
/* =============================================================================
 SECTION sitemap Pages Styles
============================================================================= */
.sitemap {
  margin: 0 auto;
  max-width: 800px;
  display: flex;
  justify-content: space-between;
}
.sitemap a {
  color: var(--color-blue);
}
.sitemap dl {
  padding-right: 1em;
  width: 25%;
}
.sitemap dl dt {
  margin-bottom: 1em;
  font-size: 1.8rem;
  font-weight: 700;
}
.sitemap dl dd {
  padding-left: 15px;
  position: relative;
  line-height: 1.5;
}
.sitemap dl dd:before {
  content: '';
  display: inline-block;
  position: absolute;
  top: 8px;
  left: 0;
  width: 10px;
  height: 2px;
  background: #ddd;
}
.sitemap dl dd + dt {
  margin-top: 3em;
}
.sitemap dl dd + dd {
  margin-top: 1em;
}
.sitemap ul {
  width: 25%;
}
.sitemap ul li {
  font-size: 1.8rem;
  font-weight: 700;
}
.sitemap ul li + li {
  margin-top: 1.5em;
}
.mssg404 {
  margin: 0 auto 50px;
  max-width: 800px;
}
.mssg404 p {
  line-height: 2;
}
@media screen and (max-width: 768px) {
  .sitemap {
    display: block;
  }
  .sitemap dl {
    margin-top: 15px;
    padding-right: 0;
    width: 100%;
  }
  .sitemap dl dt {
    margin-bottom: 10px;
    font-size: 1.5rem;
  }
  .sitemap dl dd {
    margin: 0;
  }
  .sitemap dl dd + dt {
    margin-top: 20px;
  }
  .sitemap ul {
    margin-top: 20px;
    width: 100%;
  }
  .sitemap ul li {
    font-size: 1.5rem;
    font-weight: bold;
  }
  .sitemap ul li + li {
    margin-top: 20px;
  }
}


/* !SECTION */
/* =============================================================================
 SECTION animation Styles
============================================================================= */

.anime[data-anime=slideIn],
.topCompanyInfo ul li.anime:before,
.topCompanyInfo ul li.anime:after,
.topCompanyInfo ul li.anime .image,
ul.productPickup.anime li {
  opacity: 0;
  visibility: hidden;
  transform: translateY(20px);
  pointer-events: none;
  transition-duration: .8s;
}
.anime[data-anime=slideIn].animated,
.topCompanyInfo ul li.anime.animated:before,
.topCompanyInfo ul li.anime.animated:after,
.topCompanyInfo ul li.anime.animated .image,
ul.productPickup.anime.animated li {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: all;
}
.topCompanyInfo ul li.anime:after {
  transition-delay: .4s;
}
.topCompanyInfo ul li.anime .image {
  transition-delay: .8s;
}
.conversion ul li.linkContact.anime.animated,
ul.productPickup.anime li:nth-child(2) {
  transition-delay: .3s;
}
ul.productPickup.anime li:nth-child(3) {
  transition-delay: .6s;
}
ul.productPickup.anime li:nth-child(4) {
  transition-delay: .9s;
}


/* !SECTION */
/* =============================================================================
 SECTION english Styles
============================================================================= */
html[lang="en"] table.infoTable-table th {
  width: 20%;
  font-size: 1.4rem;
  word-break: normal;
}
html[lang="en"] table.infoTable-table td {
  width: 30%;
  font-size: 1.4rem;
}
html[lang="en"] .hs-form-required:before {
  content: 'Require';
}
html[lang="en"] .megaMenuBody dl dt .em {
  font-size: 100%;
}
html[lang="en"] .pageAnchor2 ul li .jpn:before {
  display: none;
}
@media screen and (min-width: 769px) {
  html[lang="en"] .secondaryConts.col2 {
    display: block;
  }
  html[lang="en"] .secondaryConts.col2 .secondaryCont {
    width: 100% !important;
  }
  html[lang="en"] .secondaryConts.col2 .secondaryCont + .secondaryCont {
    margin-top: 5px !important;
  }
  html[lang="en"] .pageAnchor2.enfix ul {
    justify-content: center;
  }
  html[lang="en"] .pageAnchor2.enfix ul li {
    margin: 0 1em;
    width: auto;
  }
}
@media screen and (max-width: 768px) {
  html[lang="en"] .pageAnchor2.enfix ul li .jpn {
    justify-content: space-between;
  }
}

html[lang="en"] #header .headerInner,
html[lang="en"] #header #siteLogo,
html[lang="en"] #header #siteLogo a,
html[lang="en"] #header #siteLogo .logo {
  height: 100%;
}
html[lang="en"] #header #siteLogo .logo {
  display: flex;
  align-items: center;
}
html[lang="en"] #header #siteLogo .logo img {
  max-height: 100%;
}
html[lang="en"] #header #siteLogo {
  margin-left: 0;
}
@media screen and (max-width: 768px) {
  html[lang="en"] #header #siteLogo {
    margin-left: 0;
    padding-top: 0;
  }
}





/* !SECTION */
/* =============================================================================
 additional Styles
============================================================================= */
@media screen and (min-width: 768px) and (max-width: 1120px) {
  .hero .taglineMain {
    display: block;
    font-size: 4.4rem;
  }
  .hero .taglineSub {
    padding-top: 1.5em;
    display: block;
    line-height: 2;
  }
}

/* !SECTION */





/* !SECTION */
/* =============================================================================
 CSR Page Styles
============================================================================= */
@import url('https://fonts.googleapis.com/css2?family=Lexend:wght@700&display=swap');
.csrIntro {
}
.csrLead {
  margin: 0 auto 120px;
  width: 78%;
}
.csrColumn {
  margin-bottom: 70px;
  display: flex;
  justify-content: space-between;
  flex-direction: row-reverse;
}
.csrColumn:last-child {
  margin-bottom: 0;
}
.csrColumnBody {
  width: 45%;
}
.csrColumnTitle {
  margin-bottom: 30px;
  padding-left: 25px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.csrColumnTitle:before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 10px;
  height: 100%;
  background: linear-gradient(to bottom,#069896 0%, #003b55 100%);
}
.csrColumnTitle .en {
  line-height: 1.4285714285714286;
  font-size: 1.4rem;
  color: #999;
}
.csrColumnTitle .jp {
  line-height: 1.44;
  color: #003B55;
  font-size: 2.5rem;
  font-weight: bold;
}
.csrColumnBody p {
  line-height: 2.142857142857143;
  font-size: 1.4rem;
  font-feature-settings: "palt";
}
.csrColumnImg {
  width: 50%;
  text-align: center;
}
.csrColumn.-imgRight {
  flex-direction: row;
}
.csrColumns {
  margin-top: 100px;
  margin-bottom: 150px;
}
.csrColumnChild {
  display: flex;
  justify-content: space-between;
  flex-direction: row-reverse;
}
.csrColumnChild + .csrColumnChild {
  margin-top: 50px;
}
.csrColumnChild .csrColumnBody {
  width: 42%;
}
.csrColumnChildTitle {
  margin-bottom: 20px;
  padding-top: 35px;
  padding-bottom: 20px;
  border-bottom: 1px solid #999;
  position: relative;
  z-index: 1;
  line-height: 1.5;
  font-size: 2rem;
}
.csrColumnChildTitle .num {
  position: absolute;
  top: 0;
  left: -30px;
  z-index: -1;
  color: #D3DFE5;
  font-family: 'Lexend', sans-serif;
  font-size: 5rem;
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  .csrIntro {
  }
  .csrLead {
    margin-bottom: 100px;
    width: calc(295/375*100vw);
  }
  .csrColumn {
    margin-bottom: 65px;
    display: block;
  }
  .csrColumnBody {
    width: 100%;
  }
  .csrColumnTitle {
    margin-bottom: 20px;
    padding-left: 20px;
  }
  .csrColumnTitle:before {
    width: 8px;
  }
  .csrColumnTitle .en {
    font-size: 1.2rem;
  }
  .csrColumnTitle .jp {
    font-size: 2rem;
  }
  .csrColumnBody p {
    line-height: 1.7857142857142858;
  }
  .csrColumnImg {
    margin-top: 30px;
    width: 100%;
  }
  .csrColumns {
    margin-top: 65px;
    margin-bottom: 100px;
  }
  .csrColumnChild {
    display: block;
  }
  .csrColumnChild + .csrColumnChild {
    margin-top: 25px;
  }
  .csrColumnChild .csrColumnBody {
    width: 100%;
  }
  .csrColumnChildTitle {
    margin-bottom: 15px;
    padding-top: 25px;
    padding-bottom: 15px;
    font-size: 1.8rem;
  }
  .csrColumnChildTitle .num {
    left: -10px;
    font-size: 4rem;
  }
}




/* !SECTION */




/* !SECTION */
/* =============================================================================
 Print Styles
============================================================================= */
.printBtn {
  margin: 0 auto;
  width: 158px;
}
.productCatIndex .printBtn {
  margin-top: 50px;
}
.productListSearchResult .resultLabel + .printBtn {
  margin: 30px auto 50px;
}
@media screen and (max-width: 768px) {
  .printBtn {
    display: none;
  }
}
@media print{
  #list #header,
  #list #conversion,
  #list .pageHeader,
  #list .productListSearch,
  #list .resultLabel,
  #list .hs-tools-menu,
  #list .printBtn,
  #list #pagetop,
  #list #footer,
  .productCatIndex #header,
  .productCatIndex #conversion,
  .productCatIndex .pageHeader,
  .productCatIndex .productListSearch,
  .productCatIndex .resultLabel,
  .productCatIndex .hs-tools-menu,
  .productCatIndex .printBtn,
  .productCatIndex .pageAnchor,
  .productCatIndex .conversion,
  .productCatIndex .anotherContents,
  .productCatIndex #pagetop,
  .productCatIndex #footer {
    display: none;
  }
  .productCatIndex .productsTable {
    margin-top: 0;
    break-after: page;
  }
  .productCatIndex .productsTable:last-child {
    break-after: auto;
  }
}
/* !SECTION */




/* !SECTION */
/* =============================================================================
 additional Styles 2404
============================================================================= */

.gsc-control-cse {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}
.gs-webResult div.gs-visibleUrl-breadcrumb {
  margin: .2em 0 .3em;
}
.gsc-control-cse .gsc-table-result {
  line-height: 1.5;
}
table.gsc-search-box {
  display: block;
}
table.gsc-search-box tbody {
  display: block;
}
table.gsc-search-box>tbody>tr {
  width: 100%;
}
table.gsc-search-box tr {
  display: flex;
}
table.gsc-search-box td {
  display: block;
}
table.gsc-search-box .gsc-input {
  margin: 0 !important;
  padding: 0 !important;
  width: calc(100% - 49px);
  height: 49px;
}
table.gsc-search-box .gsc-input-box {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  border-radius: 0 !important;
}
table.gsc-search-box .gsc-input table {
  padding: 7px !important;
  display: block;
}
table.gsc-search-box .gsc-input table .gsib_a {
  padding: 0 !important;
}
table.gsc-search-box .gsc-input table .gsib_a .gsc-input {
  height: 35px !important;
  font-size: 16px !important;
}
table.gsc-search-box .gsc-input table .gsib_b {
  display: flex;
  align-items: center;
  height: 35px !important;
}

table.gsc-search-box .gsc-search-button {
  margin: 0 !important;
  padding: 0 !important;
  width: 49px !important;
  height: 49px !important;
  background: var(--color-blue) url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_search_b.svg) center center no-repeat;
  cursor: pointer;
}
table.gsc-search-box .gsc-search-button button.gsc-search-button-v2 {
  opacity: 0 !important;
}

@media screen and (min-width: 769px) {
  #globalNavi .primaryCont.-search {
  }
  #globalNavi .primaryCont.-search .primaryContLabel {
    display: flex;
    justify-content: center;
    position: absolute;
    top: 0;
    right: min(218px,calc(218/1200*100vw));
    width: min(88px,calc(88/1200*100vw));
  }
  #globalNavi .primaryCont.-search .primaryContLabel span {
    margin: 0;
    padding: 0 10px;
    display: inline-flex;
  }
  #globalNavi .primaryCont.-search .primaryContLabel span:before,
  #globalNavi .primaryCont.-search .primaryContLabel span:after {
    display: none;
  }
  #globalNavi .primaryCont.-search .megaMenu {
    padding: 0 min(218px,calc(218/1200*100vw));;
  }
  #globalNavi .primaryCont.-search .searchBox {
    display: flex;
    justify-content: flex-end;
  }
  #globalNavi .primaryCont.-search .searchBox>div {
    padding-top: 30px !important;
    width: 326px;
  }

  .newHeader #globalNavi .langSelect {
    margin-right: min(88px,calc(88/1300*100vw));
  }
}



@media screen and (max-width: 768px) {
  table.gsc-search-box .gsc-input {
    width: calc(100% - 54px);
    height: 54px;
  }
  table.gsc-search-box .gsc-input table .gsib_a .gsc-input,
  table.gsc-search-box .gsc-input table .gsib_b {
    height: 40px !important;
  }
  table.gsc-search-box .gsc-search-button {
    width: 54px !important;
    height: 54px !important;
  }



  form.gsc-search-box {
    margin: 0 !important;
    padding: 0 !important;
  }
  table.gsc-search-box {
    margin: 0 !important;
    padding: 0 !important;
  }

  #globalNavi .primaryCont.-search {
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
  }
  #globalNavi .primaryCont.-search .primaryContLabel {
    display: none !important;
  }
  #globalNavi .primaryCont.-search .megaMenu {
    display: block !important;
  }
  #globalNavi .primaryCont.-search .searchBox {
    margin-top: 30px;
  }
  #globalNavi .primaryCont.-search .searchBox table.gsc-search-box .gsc-search-button {
    background: var(--color-green) url(//f.hubspotusercontent30.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/icon_search_g.svg) center center no-repeat;
  }
}






.section table.gsc-search-box {
  margin-bottom: 30px !important;
  padding: 30px;
  background-color: var(--color-gray);
}
.section .gs-result b {
  color: var(--color-red) !important;
}

@media screen and (min-width: 769px) {
  .gsc-results .gsc-cursor {
    display: flex !important;
    align-items: center;
    justify-content: center;
  }
  .gsc-results .gsc-cursor-box {
    margin: 30px 0 !important;
  }
  .gsc-results .gsc-cursor-box .gsc-cursor-page {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 42px !important;
    height: 42px !important;
    color: var(--color-blue) !important;
    background-color: var(--color-gray) !important;
    font-family: var(--font-en) !important;
    font-weight: 500 !important;
    font-size: 1.8rem !important;
    transition: var(--transition-all);
    text-decoration: none !important;
  }
  .gsc-results .gsc-cursor-box .gsc-cursor-page.gsc-cursor-current-page,
  .gsc-results .gsc-cursor-box .gsc-cursor-page:hover {
    color: var(--color-white) !important;
    background-color: var(--color-blue) !important;
  }
}

@media screen and (max-width: 768px) {
  .section .gsc-control-cse {
    padding: 0 !important;
  }
  .section table.gsc-search-box {
    padding: 20px calc(20/335*100%) !important;
  }
}



.pickupTopics {
  background-color: var(--color-gray);
}
.pickupTopics .section {
  padding-top: 50px !important;
  padding-bottom: 50px !important;
}

@media screen and (min-width: 769px) {
  .pickupTopics {
    margin: 20px -50px 0;
  }
}

@media screen and (max-width: 768px) {
  .pickupTopics .section {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
  }
}



/* !SECTION */



/* !SECTION */
/* =============================================================================
 New Research and Development Styles
============================================================================= */

.rdNewLead {
  padding: 0 0 150px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.rdNewLeadTxt {
  padding-top: 8%;
  width: 36%;
}
.rdNewLeadTitle {
  margin-bottom: 30px;
  line-height: 1.425531914893617;
  font-size: 4.7rem;
  font-weight: bold;
}
.rdNewLead p {
  line-height: 2.4375;
}
.rdNewLeadImg {
  width: 60.5%;
}
.rdTecFeature {
  margin-top: 2em;
  width: 100%;
}
.rdTecFeatureTitle {
  margin-bottom: 20px;
  padding-bottom: 20px;
  display: inline-block;
  position: relative;
  color: #0A5F68;
  font-size: 3.5rem;
  font-weight: bold;
}
.rdTecFeatureTitle:before {
  content: '';
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: calc(100% + 1em);
  height: 1px;
  background-color: #0A5F68;
}
.rdTecFeatureTitle:after {
  content: '';
  display: block;
  position: absolute;
  bottom: 1px;
  right: -1em;
  width: 1px;
  height: 15px;
  background-color: #0A5F68;
  transform-origin: bottom right;
  transform: rotate(-45deg);
}
.rdTecFeature dl {
  line-height: 2.4375;
}
.rdTecFeature dl dt {
  color: #0A5F68;
}
.rdTecFeature dl dd {
  padding-left: 1em;
}



.rdNewIntro {
  padding: 120px 0;
  position: relative;
  z-index: 1;
  color: var(--color-white);
}
.rdNewIntroBG {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: calc(50% - 50vw);
  z-index: -1;
  pointer-events: none;
  width: 100vw;
  height: 100%;
  background-color: #0A5F68;
}
.rdNewIntroBG:before,
.rdNewIntroBG:after {
  content: '';
  display: block;
  position: absolute;
  width: 620px;
  height: 570px;
  background: url(//7833030.fs1.hubspotusercontent-na1.net/hubfs/7833030/raw_assets/public/tosoh_finechem_202112/images/common/bg_techintro.png) 0 0 / contain no-repeat;
}
.rdNewIntroBG:before {
  top: 0;
  right: 0;
}
.rdNewIntroBG:after {
  bottom: 0;
  left: 0;
  transform: rotate(180deg);
}
.rdNewIntroTitle {
  margin-bottom: 30px;
  line-height: 1.425531914893617;
  font-size: 4.7rem;
  font-weight: bold;
}
.rdNewIntroBody {
  display: flex;
  justify-content: space-between;
}
.rdNewIntroTxt {
  width: 29%;
}
.rdNewIntroTxt p {
  line-height: 2.4375;
  letter-spacing: 0;
}
.rdNewIntroImg {
  width: 67%;
}



.rdNewFocus {
  padding: 120px 0;
}
.rdNewFocusTitle {
  margin-bottom: 50px;
  line-height: 1.425531914893617;
  font-size: 4.7rem;
  font-weight: bold;
}
.rdNewFocusTechs {
  list-style: none;
}
.rdNewFocusTech {
  position: relative;
  counter-increment: num;
}
.rdNewFocusTech {
  margin-bottom: 60px;
  padding-bottom: 60px;
  border-bottom: 1px dotted #538F95;
}
.rdNewFocusTech:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}
.rdNewFocusTechCont {
  margin-bottom: 30px;
  padding-left: 170px;
}
.rdNewFocusTechCont:before {
  content: '0'counter(num);
  position: absolute;
  top: -30px;
  left: 0;
  line-height: 1;
  color: #0A5F68;
  font-size: 13rem;
  font-weight: bold;
  font-family: "Zen Kaku Gothic New", sans-serif;
}
.rdNewFocusTechTitle {
  margin-bottom: 20px;
  color: #0A5F68;
  font-size: 3.5rem;
  font-weight: bold;
}
.rdNewFocusTech p {
  line-height: 2;
}
.tec01 .rdNewFocusTechImg {
  max-width: 923px;
}
.tec02 .rdNewFocusTechImg {
  width: 102.1%;
}
.tec04 .rdNewFocusTechImg {
  max-width: 890px;
}



.rdNewTopics {
  padding: 60px 0;
  position: relative;
  z-index: 1;
}
.rdNewTopics:before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: calc(50% - 50vw);
  z-index: -1;
  pointer-events: none;
  width: 100vw;
  height: 100%;
  background-color: #EDEDED;
}
.rdNewTopicsTitle {
  margin-bottom: 20px;
  line-height: 1.5116279069767442;
  font-size: 4.3rem;
  font-weight: bold;
}
.rdNewTopics .newsCategory {
  background-color: #074D71;
}


@media screen and (max-width: 768px) {
  .rdNewLead {
    padding: 0 0 70px;
    display: block;
  }
  .rdNewLeadTxt {
    padding-top: 0;
    width: 100%;
  }
  .rdNewLeadTitle {
    margin-bottom: 15px;
    font-size: 2.1rem;
  }
  .rdNewLead p {
    line-height: 2;
  }
  .rdNewLeadImg {
    margin-top: 15px;
    width: 100%;
  }
  .rdTecFeature {
    margin-top: 30px;
  }
  .rdTecFeatureTitle {
    margin-bottom: 10px;
    padding-bottom: 10px;
    font-size: 1.8rem;
  }
  .rdTecFeatureTitle:after {
    height: 10px;
  }

  .rdNewIntro {
    padding: 60px 0;
  }
  .rdNewIntroBG:before,
  .rdNewIntroBG:after {
    padding-top: 39.2%;
    width: 36%;
    height: 0;
  }
  .rdNewIntroTitle {
    margin-bottom: 15px;
    font-size: 2.1rem;
  }
  .rdNewIntroTitle br {
    display: none;
  }
  .rdNewIntroBody {
    display: block;
  }
  .rdNewIntroTxt {
    width: 100%;
  }
  .rdNewIntroTxt p {
    line-height: 2;
  }
  .rdNewIntroImg {
    margin-top: 30px;
    width: 100%;
  }
  
  .rdNewFocus {
    padding: 60px 0;
  }
  .rdNewFocusTitle {
    margin-bottom: 20px;
    font-size: 2.1rem;
  }
  .rdNewFocusTech {
    margin-bottom: 20px;
    padding-bottom: 40px;
  }
  .rdNewFocusTech:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
  }
  .rdNewFocusTechCont {
    margin-bottom: 15px;
    padding-left: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 15px 0;
  }
  .rdNewFocusTechCont:before {
    display: block;
    position: static;
    width: 70px;
    font-size: 6rem;
  }
  .rdNewFocusTechTitle {
    margin-bottom: 0;
    padding-top: .65em;
    width: calc(100% - 70px);
    line-height: 1.5;
    font-size: 1.8rem;
    letter-spacing: 0;
  }
  .rdNewFocusTech p {
    line-height: 2;
  }
  .rdNewFocusTechImg {
    margin-top: 30px;
  }
  .tec01 .rdNewFocusTechImg {
    width: calc(314/390*100vw);
  }
  .tec02 .rdNewFocusTechImg {
    width: calc(348/390*100vw);
  }
  .tec03 .rdNewFocusTechImg {
    width: calc(340/390*100vw);
  }
  .tec04 .rdNewFocusTechImg {
    width: calc(302/390*100vw);
  }
  
  .rdNewTopics {
    padding: 30px 0;
  }
  .rdNewTopicsTitle {
    margin-bottom: 10px;
    font-size: 2.1rem;
  }
 
}

/* !SECTION */



/* !SECTION */
/* =============================================================================
 2409 add Styles
============================================================================= */

.topicAnchor {
  position: fixed;
  bottom: 76px;
  right: 0;
  z-index: 10;
}
.footIn .topicAnchor {
  position: absolute;
}
.topicAnchor a {
  display: block;
}
.topicAnchorBnr {
  border: 4px solid #069896;
  border-bottom: none;
}
.topicAnchorText {
  padding: 10px;
  display: flex;
  gap: 10px;
  background-color: #069896;
  text-decoration: none;
}
.topicAnchor a .icon {
  position: relative;
  width: 16px;
  color: var(--color-white);
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1.4rem;
  font-weight: bold;
  font-style: italic;
}
.topicAnchor a .iconInner {
  display: flex;
  align-items: center;
  position: absolute;
  top: 0;
  left: 100%;
  white-space: nowrap;
  flex-shrink: 0;
  transform: rotate(90deg);
  transform-origin: top left;
}
.topicAnchor a .iconInner:after {
  content: '';
  display: block;
  border-top: 2px solid var(--color-white);
  border-right: 2px solid var(--color-white);
  width: 8px;
  height: 8px;
  flex-shrink: 0;
  transform: rotate(45deg);
}
.topicAnchor a .txt {
  padding: 15px;
  display: block;
  line-height: 1.25;
  background-color: var(--color-white);
  font-weight: bold;
  text-decoration: none;
}
@media screen and (min-width: 769px) {
  .topicAnchor {
    width: 220px;
  }
}
@media screen and (max-width: 768px) {
  .topicAnchor {
    bottom: 0;
    right: auto;
    left: 0;
  }
  .topicAnchorText {
    padding-left: 20px;
  }
  .topicAnchor a .icon {
    display: flex;
    align-items: center;
  }
  .topicAnchor a .iconInner {
    position: static;
    font-size: 0;
    transform: none;
  }
  .topicAnchor a .iconInner:after {
    transform: rotate(135deg);
  }
  .topicAnchor a .txt {
    padding: 15px;
    display: block;
    line-height: 1.25;
    background-color: var(--color-white);
    font-weight: bold;
    text-decoration: none;
  }
}

/* !SECTION */



/* !SECTION */
/* =============================================================================
 living Styles
============================================================================= */

.liveBnr {
  margin: 0 auto 100px;
  max-width: 1000px;
}
.tosohLiving {
  margin: 0 auto;
  padding: 60px 0 100px;
  max-width: 1000px;
}
.tosohLivingLead {
  margin-bottom: 57px;
  line-height: 1.875;
}
@media only screen and (hover: hover) {
  .liveBnr a {
    transition: var(--transition-op_vis);
  }
  .liveBnr a:hover {
    opacity: 0.6;
  }
}
@media only screen and (max-width: 767px) {
  .liveBnr {
    margin: 0 calc(20/375*100%) 60px;
  }
  .tosohLiving {
    padding: 30px calc(20/375*100vw) 50px;
  }
  .tosohLivingLead {
    margin-bottom: 30px;
  }
}
.tosohLivingMapWrap {
    position: relative;
  font-feature-settings: "palt";
}
.tosohLivingMap {
    height: 582px;
}
.tosohLivingMap {
    position: relative;
    width: 1000px;
    height: 582px;
}
.tosohLivingMapIcon {
    position: absolute;
}
.tosohLivingMapIcon a {
    padding: 3px 6px;
    border-radius: 6px;
    position: relative;
    display: block;
    line-height: 1.33;
    color: #fff;
    background-color: #D4152D;
    font-size: 1rem;
    text-align: center;
    text-decoration: none;
    transition: opacity ease .3s;
}
.tosohLivingMapIcon a:hover {
    opacity: 0.6;
}
.tosohLivingMapIcon .em {
    font-size: 1.2rem;
}
.tosohLivingMapIcon a:after {
    content: '';
    display: block;
    position: absolute;
    bottom: -8px;
    left: calc(50% - 3px);
    width: 0;
    height: 0;
    border-style: solid;
    border-right: 3px solid transparent;
    border-left: 3px solid transparent;
    border-top: 8px solid #D4152D;
    border-bottom: 0;
}
.tosohLivingMapIcon.-icon01 {
  top: 113px;
  left: 7px;
}
.tosohLivingMapIcon.-icon02 {
  top: 152px;
  left: 76px;
}
.tosohLivingMapIcon.-icon03 {
  top: 84px;
  left: 240px;
}
.tosohLivingMapIcon.-icon04 {
    top: 28px;
    left: 426px;
}
.tosohLivingMapIcon.-icon05 {
    top: 10px;
    left: 529px;
}
.tosohLivingMapIcon.-icon06 {
    top: 15px;
    left: 690px;
}
.tosohLivingMapIcon.-icon07 {
    top: 57px;
    left: 746px;
}
.tosohLivingMapIcon.-icon08 {
    top: 47px;
    right: 10px;
}
.tosohLivingMapIcon.-icon09 {
    top: 171px;
    left: 308px;
}
.tosohLivingMapIcon.-icon10 {
    top: 266px;
    left: 319px;
}
.tosohLivingMapIcon.-icon11 {
    top: 308px;
    left: 229px;
}
.tosohLivingMapIcon.-icon12 {
    top: 315px;
    left: 406px;
}
.tosohLivingMapIcon.-icon13 {
    top: 405px;
    left: 176px;
}
.tosohLivingMapIcon.-icon14 {
    top: 523px;
    left: 155px;
}
.tosohLivingMapIcon.-icon14 a:after {
  bottom: auto;
  top: -8px;
  transform: rotate(180deg);
}
.tosohLivingMapIcon.-icon15 {
    top: 160px;
    right: 4px;
}
.tosohLivingMapIcon.-icon15 a:after {
  bottom: calc(50% - 4px);
  left: -6px;
  transform: rotate(90deg);
}
.tosohLivingMapIcon.-icon16 {
    top: 257px;
    left: 670px;
}
.tosohLivingMapIcon.-icon17 {
    top: 306px;
    left: 616px;
}
.tosohLivingMapIcon.-icon17 a:after {
  bottom: calc(50% - 4px);
  left: auto;
  right: -6px;
  transform: rotate(-90deg);
}
.tosohLivingMapIcon.-icon18 {
    top: 312px;
    left: 761px;
}
.tosohLivingMapIcon.-icon18 a:after {
  bottom: calc(50% - 4px);
  left: -6px;
  transform: rotate(90deg);
}
.tosohLivingMapIcon.-icon19 {
    top: 363px;
    left: 774px;
}
.tosohLivingMapIcon.-icon20 {
    top: 417px;
    left: 670px;
}
.tosohLivingMapIcon.-icon21 {
    top: 519px;
    left: 606px;
}
.tosohLivingMapIcon.-icon21 a:after {
  bottom: calc(50% - 4px);
  left: auto;
  right: -6px;
  transform: rotate(-90deg);
}
.tosohLivingMapIcon.-icon22 {
    top: 381px;
    right: 6px;
}
.tosohLivingMapIcon.-icon23 {
    top: 475px;
    left: 774px;
}
.tosohLivingMapIcon.-icon23 a:after {
  bottom: calc(50% - 4px);
  left: auto;
  right: -6px;
  transform: rotate(-90deg);
}
.tosohLivingMapIcon.-icon24 {
    top: 474px;
    right: 6px;
}
.tosohLivingMapIcon.-icon24 a:after {
  bottom: auto;
  top: -8px;
  transform: rotate(180deg);
}
.tosohLivingMapIcon.-icon25 {
    top: 533px;
    left: 859px;
}
.tosohLivingMapIcon.-icon25 a:after {
  bottom: auto;
  top: -8px;
  transform: rotate(180deg);
}
@media only screen and (max-width: 999px) {
    .tosohLivingMapWrap::after {
        content: '';
        border-radius: 6px;
        display: block;
        position: absolute;
        top: calc(50% - 22px);
        left: calc(50% - 22px);
        z-index: 5;
        pointer-events: none;
        width: 80px;
        height: 80px;
        background: rgba(0,0,0,0.4) url(https://www.tosoh-finechem.co.jp/hubfs/living/icon_cursor.svg) center center / 45px 44px no-repeat;
        animation: fadeoutMove 3s ease 0s 1 forwards;
    }
}

/*
.tosohLivingMapIcon {
    animation: pinMove 3s linear 0s infinite;
    opacity: 0;
    pointer-events: none;
    transition: opacity ease 1s 1s;
}
.loaded .tosohLivingMapIcon {
  opacity: 1;
  pointer-events: all;
}
@keyframes fadeoutMove {
  0% {
    opacity: 1;
    transform: translateX(-50%);
  }
  20% {
    opacity: 1;
    transform: translateX(-65%);
  }
  40% {
    opacity: 1;
    transform: translateX(-35%);
  }
  60% {
    opacity: 1;
    transform: translateX(-65%);
  }
  80% {
    opacity: 1;
    transform: translateX(-35%);
  }
  100% {
    opacity: 0;
  }
}
@keyframes pinMove {
  0% {
    transform: translateY(0);
  }
  12.5% {
    transform: translateY(-10%);
  }
  37.5% {
    transform: translateY(10%);
  }
  50% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(0);
  }
}
*/

/* !SECTION */



/* !SECTION */
/* =============================================================================
 Temporary Styles
============================================================================= */
.hs-content-id-69598711380 #conversion,
.hs-content-id-70970824488 #conversion,
.hs-content-id-70970824531 #conversion,
.hs-content-id-70970824557 #conversion {display:none;}

/* !SECTION */