@charset "UTF-8";
@import url("/common/css/themecolor.css");

@import url("https://fonts.googleapis.com/css2?family=Mulish:wght@300;400;500;600&display=swap");

/* 企業情報 SIDE MENU */
body.info #side li.info a,
body.vision #side li.vision a,
body.business #side li.business a,
body.roadmap #side li.roadmap a,
body.advantage #side li.advantage a,
body.history #side li.history a,
body.management #side li.management a,
body.message #side li.message a,
body.group #side li.group a,
body.group2 #side li.group a,
body.group3 #side li.group a,
body.group4 #side li.group a,
body.group5 #side li.group a,
body.gov #side li.gov a,
body.map #side li.map a,
body.social #side li.social a {
  color: #fff;
  background: var(--themeColor);
  border-radius: 5px;
}
body.info #side li.info a .fa,
body.vision #side li.vision a .fa,
body.business #side li.business a .fa,
body.roadmap #side li.roadmap a .fa,
body.advantage #side li.advantage a .fa,
body.history #side li.history a .fa,
body.management #side li.management a .fa,
body.message #side li.message a .fa,
body.group #side li.group a .fa,
body.group2 #side li.group a .fa,
body.group3 #side li.group a .fa,
body.group4 #side li.group a .fa,
body.group5 #side li.group a .fa,
body.gov #side li.gov a .fa,
body.map #side li.map a .fa,
body.social #side li.social a .fa {
  color: #fff;
}

body.business span.caption {
  font-size: 12px;
}

.gov #main .pt50 {
  padding-top:50px !important;
}

/* 1024px以上 */

.memberlistSVG {
  width: 700px;
  height: 836px;
}
#main.addcolorbar h2 {
  border-bottom: 2px solid #ccc;
  position: relative;
}
.addcolorbar h2::after {
  content: "";
  border-bottom: 2px solid var(--themeColor);
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 27%;
}

/* 企業情報トップ */

body.profile #main div.index_profile {
  width: 700px;
  margin: 0 0 50px 30px;
}

body.profile #main div.index_profile:after {
  display: block;
  clear: both;
  content: "";
}

body.profile #main div.index_profile h2 {
  margin: 0px;
  padding: 0 0 5px 0;
  border: 0;
  font-size: 18px;
}

body.profile #main div.index_profile div {
  width: 50%;
  height: 8em;
  float: left;
}

body.profile #main div.index_profile img {
  width: 100px;
  height: 100px;
  float: left;
  margin: 0 10px 0 0;
  border-radius: 5px;
}

body.profile #main div.index_profile img.history {
  border: 1px solid #ccc;
}

body.profile #main div.index_profile p {
  font-size: 13px;
  line-height: 1.5em;
  color: #666;
  margin: 0 10px 30px 30px;
}

body#profile.info dl.bod_dl {
  font-size: 16px;
  line-height: 1.5em;
  color: #666;
  margin: 0 10px 30px 30px;
}
body#profile.info dl.bod_dl dt {
  float: left;
  width: 200px;
}

body.profile #main div.index_profile h2 a {
  color: #666;
}
body.profile #main div.index_profile h2:before {
  color: #9b9b9b;
}

/* 英語版サービストップ */
body.profile #main div.index_profile.service {
  margin: 0 0 100px 30px;
}

/* 会社概要 */
body.info #main h1 {
  color: #666;
}

/* 企業理念 */
body.vision #main h1 {
  color: #666;
}

body.vision #main h2 {
  width: 700px;
  margin: 50px 0 10px 30px;
  font-size: 24px;
  color: #666;
}

body.vision #main h3 {
  width: 700px;
  margin: 30px 0 10px 30px;
  font-size: 18px;
  color: #666;
}

body.vision #main .guideline {
  width: 700px;
  margin: 60px 0 1em 30px;
  text-align: center;
}
body.vision #main .guideline__ttl {
  margin-bottom: 30px;
}
body.vision #main .guideline__ttl__main {
  font-family: "Mulish", sans-serif;
  font-weight: 500;
  font-size: 40px;
  margin-bottom: 4px;
}
body.vision #main .guideline__ttl__sub {
  font-size: 18px;
}
body.vision #main .guideline__list {
  display: flex;
  justify-content: space-between;
}
body.vision #main .guideline__list__child {
  width: 32%;
  border: 1px solid var(--themeColor);
  padding: 12px;
}
body.vision #main .glCont__ttl {
  font-size: 18px;
  padding-bottom: 10px;
  margin-bottom: 22px;
  border-bottom: 1px solid var(--themeColor);
}
body.vision #main .glCont__main {
  font-family: "Mulish", sans-serif;
  font-weight: 300;
  font-size: 26px;
  color: var(--themeColor);
  line-height: 1.2;
  margin-bottom: 18px;
}
body.vision #main .glCont__sub {
  font-size: 14px;
}
body.vision #main .glCont__sub .glCont__sub__eng {
  font-family: "Mulish", sans-serif;
  font-weight: 300;
  font-size: 12px;
  margin-bottom: 10px;
}

body.vision #main .glCont__sub_en {
  font-size: 12px;
}

body.vision #main .message {
  width: 700px;
  margin: 0 0 1em 30px;
  text-align: center;
}

body.vision #main p {
  width: 700px;
  margin: 0 0 1em 30px;
  font-size: 16px;
  color: #666;
}

/* 事業内容 */
body.business #main h1 {
  color: #666;
}

body.business .businessbody {
  margin: 0 0 30px 0;
}

body.business .businessbody .group img {
  margin: 0 0 0 30px;
}

body.business .businessbody .group h2 {
  text-align: center;
  margin-bottom: 10px;
  border: 0 !important;
}

body.business .businessbody .group h2:before {
  content: "" !important;
}

body.business .businessbody .group img.sp {
  display: none;
}

body.business .businessbody p.summary {
  margin: 0 0 30px 0;
  color: #666;
}

body.business .businessbody .detail h2 {
  color: var(--themeColor);
  border-top: 1px solid var(--themeColor);
  border-left: 1px solid var(--themeColor);
  border-right: 1px solid var(--themeColor);
  margin: 0 0 0 30px !important;
  padding: 10px 10px 5px 10px !important;
  font-size: 20px;
}

body.business .businessbody .detail p {
  border-bottom: 1px solid var(--themeColor);
  border-left: 1px solid var(--themeColor);
  border-right: 1px solid var(--themeColor);
  margin: 0 0 20px 30px !important;
  padding: 10px;
  color: #666;
}

body.business .businessbody .detail p:after {
  display: block;
  content: "";
  clear: both;
}

body.business .businessbody .detail p img {
  display: block;
  margin: 0 0 0 20px;
  width: 250px;
  height: 210px;
  float: right;
}

body.business .businessbody .detail2 {
  padding: 20px 0 0 0;
}

body.business .businessbody .detail2 div {
  padding: 0.5em 1em;
  height: 130px;
  margin: 0 200px 10px 0;
  background: var(--themeColorHover);
  color: white;
}

body.business .businessbody .detail2 div.b2c {
  width: 180px;
  height: 550px;
  float: right;
  margin: 0 !important;
  padding: 180px 1em;
}

body.business .businessbody .detail2 h2 {
  margin: 0 0 0.5em 0;
  padding: 1em 0 0 0;
  font-size: 18px;
}

body.business .businessbody .detail2 div.b2c h2 {
  text-align: center;
}

body.business .businessbody .detail2 p {
  font-size: 12px;
}

/* Our Roadmap */
body.roadmap #main h1 {
  color: #666;
}
body.roadmap #main h2 {
  margin: 20px 0 10px 30px !important;
  padding: 0 0 5px 0 !important;
  font-size: 16px;
  font-weight: bold !important;
  color: #666;
}

body.roadmap #main p.lead {
  padding: 20px 0 !important;
  font-size: 150%;
  font-weight: bold !important;
  text-align: center;
}

body.roadmap #main p {
  width: 700px;
  margin: 0 30px 1em 30px !important;
  font-size: 16px;
  color: #666;
}

body.roadmap #main p span {
  font-weight: bold;
}

body.roadmap #main p.btnf {
  font-size: 180%;
  font-weight: bold;
}

/* 2025.07.24 Our Roadmap */

.our_roadmap #main h1 {
  max-width: 980px;
  width: 100%;
  margin: 0;
  position: unset;
  padding: 0;
  line-height: unset;
  border-bottom: none;
}

.our_roadmap #main h1::before {
  position: unset;
  left: unset;
  top: unset;
  height: unset;
  border-left: none;
}

.our_roadmap #main h2::before,
.our_roadmap #main h3::before {
  color: unset;
  content: unset;
  font-family: unset;
  margin-right: unset;
}

.our_roadmap #main h1::after {
  position: unset;
  left: unset;
  bottom: unset;
  width: unset;
  border-bottom: unset;
}

.our_roadmap #main p {
  margin: 0;
  padding: 0;
  max-width: unset;
  border: none;
  text-align: left;
}

.our_roadmap #main h2,
.our_roadmap #main h3,
.our_roadmap #main h4 {
  margin: 0;
  padding: 0;
  max-width: unset;
  border: none;
  text-align: center;
  font-weight: bold;
}


#main .our_roadmap_fv {
  text-align: center;
  background-color: #fafafa;
  padding: 60px 0 100px;
}

/*
#main .our_roadmap_fv h2 {
  max-width: 980px;
  font-size: 34px;
  border: none;
  color: #333333;
}

#main .our_roadmap_fv h2:before {
  color: unset;
  font-family: unset;
  content: unset;
}

#main .our_roadmap_fv p {
  max-width: 980px;
}
*/

#main .fv {
  background-color: var(--themeColor);
  background-image: url(/profile/image/roadmap/fv_bg.png);
  background-repeat: no-repeat;
  padding: 36px;
}

.our_roadmap  #main .fv h1 {
  font-size: 28px;
  color: #fff;
  padding: 16px 0;
  line-height: 0;
}

.our_roadmap  #main .fv .fv-txt {
  color: #fff;
  margin-top: 16px;
  padding-bottom: 8px;
  line-height: 170%;
}

.our_roadmap #main p.fv-movie-link a {
  background: url(/profile/image/roadmap/fv_arrow.svg) no-repeat center right 10px;
  display: block;
  background-color: #fff;
  margin-top: 34px;
  padding: 8px;
  width: 480px;
  text-align: center;
  box-shadow: 4px 4px 0 #B30009;
  transition: opacity 0.3s ease;
}

p.fv-movie-link a:hover {
  opacity: 0.8;
  color: var(--themeColor);
}

.our_roadmap #crumb {
  max-width: 980px;
  width: 100%;
}

.pivot-img {
  position: relative;
  color: #666;
}

.pivot-img-infra {
  position: absolute;
  top: 54px;
  left: 60px;
}

.pivot-img-web3 {
  position: absolute;
  top: 208px;
  left: 296px;
}

.pivot-img-infra dt,
.pivot-img-web3 dt {
  font-size: 20px;
  margin-bottom: 3px;
  font-weight: 500;
}

.pivot-img-infra dd,
.pivot-img-web3 dd {
  line-height: 160%;
}

.our_roadmap #main .pivot-img-platform {
  position: absolute;
  top: 36px;
  right: 100px;
  font-size: 20px;
  color: var(--themeColor);
  padding: 6px 24px;
  border: 2px solid var(--themeColor);
  border-radius: 8px;
}

img.pivot-web3 {
  width: 100%;
  height: auto;
}

.our_roadmap #main h2 {
  font-size: 34px;
  color: #333;
  margin: 24px auto 8px;
}

.our_roadmap #main p.rebuild-txt {
  text-align: center;
}

.our_roadmap #main p.rebuild-arrow {
  text-align: center;
  margin: 20px auto;
}

.our_roadmap #main p.rebuild-arrow img {
  width: 60px;
  height: auto;
}

#main .return {
  margin: 0;
}

#main .return h3::before {
  content: unset;
  margin-right: 0;
}

#main .return h2 {
  margin: 0 auto 8px;
  font-weight: bold;
  font-size: 24px;
  color: #666;
}

#main .return h2 br {
  display: none;
}

#main .return p.sub-txt {
  line-height: 170%;
  margin: 0 0 24px 0;
}

#main .return .return-flame {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}

#main .return-web2,
#main .return-web3 {
  border-radius: 10px;
  background-color: #fff;
  width: 480px;
}

#main .return-web2 {
  border: 4px solid #2BB41F;
}

#main .return-web3 {
  border: 4px solid var(--themeColor);
}

#main .return-web2 .title,
#main .return-web3 .title {
  text-align: center;
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  margin: 0;
  padding: 12px 0;
}

#main .return-web2 .title {
  background-color: #2BB41F;
}

#main .return-web3 .title {
  background-color: var(--themeColor);
}

#main .return-web2 .txt-list,
#main .return-web3 .txt-list {
  margin: 16px;
}

#main .return-web2 .txt-list li,
#main .return-web3 .txt-list li {
  color: #666;
  position: relative;
  padding-left: 16px;
  margin-bottom: 10px;
}

#main .return-web2 .txt-list li::before,
#main .return-web3 .txt-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.5em;
  width: 0.6em;
  height: 0.6em;
  border-radius: 50%;
}

#main .return-web2 .txt-list li::before {
  background-color: #2BB41F;
}

#main .return-web3 .txt-list li::before {
  background-color: var(--themeColor);
}

#main .return-web3 .txt-list li:last-child::before {
  background-color: unset;
}

#main .return-web2 .photo,
#main .return-web3 .photo {
  padding: 0 10px 10px 10px;
  margin: 0;
  line-height: 0;
}

#main .return-web2 .photo img,
#main .return-web3 .photo img {
  width: 100%;
  height: auto;
}

#main .return p.arrow {
  margin: 10px 0 0 0;
  width: 980px;
}

#main .return p.arrow img {
  width: 100%;
  height: auto;
}

#main .portfolia {
  margin-top: 80px;
}

#main .portfolia .connect {
  margin: 0;
  text-align: center;
  max-width: 980px;
  width: 100%;
  line-height: 0;
}

#main .portfolia .connect img {
  width: 36px;
  height: auto;
}

#main .portfolia .portfolia-flame {
  background-color: #fff;
  border: 4px solid #00A0E9;
  border-radius: 10px;
  padding: 22px;
}

#main .portfolia .portfolia-flame .logo-portfolia {
  margin: 0;
  text-align: center;
  max-width: unset;
  padding: 0;
  line-height: 0;
}

#main .portfolia .portfolia-flame .logo-portfolia img {
  width: 170px;
  height: auto;
}

#main .portfolia .portfolia-flame h3 {
  color: #666;
}

#main .portfolia .portfolia-flame .portfolia-txt {
  margin: 14px 0 0 0;
  text-align: left;
  max-width: 100%;
  color: #666;
  line-height: 170%;
  padding: 0 4px;
}

#main .portfolia .portfolia-flame .portfolia-list {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  margin-top: 20px;
}

#main .portfolia .portfolia-flame .portfolia-list li {
  background-color: #fff;
  padding: 8px;
  border-radius: 10px;
  margin-right: 8px;
  width: 25%;
}

#main .portfolia .portfolia-flame .portfolia-list li:last-child {
  margin-right: 0;
}

#main .portfolia .portfolia-flame .portfolia-list li h4 {
  padding: 0;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  line-height: unset;
  color: #fff;
  max-width: unset;
  background-color: #00A0E9;
  border-radius: 6px;
  height: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
}

#main .portfolia .portfolia-flame .portfolia-list li h4.wallet {
  margin: 0;
}

#main .portfolia .portfolia-flame .portfolia-list li h4.blockchain {
  margin: 0;
}

#main .portfolia .portfolia-flame .portfolia-list li p {
  margin: 0;
  line-height: 0;
}

#main .portfolia .portfolia-flame .portfolia-list li p.icon-wallet {
  text-align: center;
  padding: 40px 0 36px;
}

#main .portfolia .portfolia-flame .portfolia-list li p.icon-blockchain {
  text-align: center;
  padding: 32px 0;
}

#main .portfolia .portfolia-flame .portfolia-list li p.icon-emotionlink {
  text-align: center;
  padding: 34px 0;
}

#main .portfolia .portfolia-flame .portfolia-list li p.icon-llm {
  text-align: center;
  padding: 44px 0 20px;
}

#main .portfolia .portfolia-flame .portfolia-list li p.icon-wallet img {
  width: 104px;
  height: auto;
}

#main .portfolia .portfolia-flame .portfolia-list li p.icon-blockchain img {
  width: 95px;
  height: auto;
}

#main .portfolia .portfolia-flame .portfolia-list li p.icon-emotionlink img {
  width: 92px;
  height: auto;
}

#main .portfolia .portfolia-flame .portfolia-list li p.icon-llm img {
  width: 113px;
  height: auto;
}

#main .portfolia .portfolia-flame .portfolia-list li p.idea-txt {
  font-size: 14PX;
  color: #666;
  line-height: 180%;
  text-align: justify;
}


#main .comparison h2 {
  margin: 80px auto 8px;
  color: #666;
  font-size: 24px;
}

#main .comparison p.sub-txt {
  line-height: 170%;
  margin: 0 0 24px;
}

#main .comparison .comparison-flame {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
}

#main .comparison .comparison-flame li.comparison-web2,
#main .comparison .comparison-flame li.comparison-web3 {
  border-radius: 10px;
  width: 480px;
}

#main .comparison .comparison-flame li.comparison-web2 {
  border: 4px solid #2DBA1F;
  background-color: #ffffff;
}

#main .comparison .comparison-flame li.comparison-web3 {
  border: 4px solid var(--themeColor);
  background-color: #ffffff;
}

#main .comparison .comparison-flame li.comparison-web2 .comparison-title {
  background-color: #2DBA1F;
  color: #ffffff;
  text-align: center;
  font-size: 20px;
  padding: 16px 0;
}

#main .comparison .comparison-flame li.comparison-web3 .comparison-title {
  background-color: var(--themeColor);
  color: #ffffff;
  text-align: center;
  font-size: 20px;
  padding: 16px 0;
}

#main .comparison .comparison-flame li p.comparison-img {
  padding: 20px;
}

#main .comparison .comparison-flame li p img {
  width: 100%;
}

#main .comparison .comparison-flame .icon-list {
  list-style: none;
  padding: 0 20px;
  margin: 0;
}

#main .comparison .comparison-flame .icon-list li {
  display: flex;
  align-items: flex-start;
  margin-bottom: 1.5em;
}

#main .comparison .comparison-flame .icon-list .icon {
  flex-shrink: 0;
  margin-right: 1em;
  width: 30px;
  height: auto;
}

#main .comparison .comparison-flame .icon-list .icon.web2-02 {
  width: 26px;
}

#main .comparison .comparison-flame .icon-list .icon.web3-01 {
  width: 24px;
}

#main .comparison .comparison-flame .icon-list .icon.web3-03 {
  width: 34px;
}

#main .comparison .comparison-flame .icon-list .icon.web3-04 {
  width: 32px;
}


#main .comparison .comparison-flame .icon-list .icon img {
  width: 100%;
  height: auto;
}

#main .comparison .comparison-flame .icon-list .content h4 {
  margin: 0 0 0.25em;
  font-size: 16px;
  font-weight: bold;
  color: #666;
  padding: 0;
  text-align: left;
}

#main .comparison .comparison-flame .icon-list .content p {
  margin: 0;
  font-size: 14px;
  color: #666;
  line-height: 1.5;
}

#main .comparison p.arrow {
  margin: 10px 0 0 0;
  width: 980px;
}

#main .comparison p.arrow img {
  width: 100%;
  height: auto;
}

#main .pivot h2 {
  margin: 110px auto 8px;
  font-size: 30px;
}

#main .pivot .sub-txt {
  line-height: 170%;
}

#main .pivot .pivot-img {
  margin: 40px auto 0 !important;
  text-align: center;
}

#main .pivot .pivot-img img {
  width: 94%;
  height: auto;
  margin: auto;
}

#main .platformer h2 {
  margin: 80px auto 8px;
  font-size: 30px;
  color: #333;
}

#main .platformer p.platformers-img img {
  width: 100%;
  height: auto;
}

#main .step h2 {
  margin: 80px auto 8px;
  font-size: 24px;
  color: #666;
}

#main .step h2 br {
  display: none;
}

#main .step .sub-txt {
  line-height: 170%;
}

#main .step .product {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  margin-top: 24px;
}

#main .step .product li {
  border: 1px solid #666;
  border-radius: 10px;
  padding: 16px;
  width: 25%;
  margin-right: 10px;
}

#main .step .product li:last-child {
  margin-right: 0;
}

#main .step .product li h4 {
  color: #666;
  margin: 10px auto;
}

#main .step .product li .step-img {
  text-align: center;
  line-height: unset;
}

#main .step .product li .step-img img {
  width: 100%;
  height: auto;
}

#main .step .product li .step-txt {
  font-size: 14px;
  line-height: 160%;
}

#main .step .step-notes {
  margin-top: 10px;
}

#main .step .step-notes li {
  color: #666;
  font-size: 12px;
  line-height: 180%;
}

#main .one-fb {
  margin-top: 80px;
}

#main .one-fb h2 {
  margin-bottom: 20px;
}

#main .one-fb h2 img {
  width: 380px;
  height: auto;
}

#main .one-fb .one-fb-flame {
  background-color:#00A0E9;
  padding: 20px;
  border-radius: 10px;
}

#main .one-fb .one-fb-flame h3 {
  color: #fff;
  margin: 16px auto 8px;
}

#main .one-fb .one-fb-flame h3 br {
  display: none;
}

#main .one-fb .one-fb-flame .sub-txt {
  color: #fff;
  line-height: 170%;
  text-align: center;
}

#main .one-fb .one-fb-flame .sub-txt br {
  display: block;
}

#main .one-fb .one-fb-flame .group {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  margin-top: 24px;
}

#main .one-fb .one-fb-flame .group li.group-frame {
  background-color: #fff;
  padding: 36px 20px 20px 20px;
  border-radius: 8px;
  margin-right: 24px;
  width: 50%;
}

#main .one-fb .one-fb-flame .group li:last-child {
  margin-right: 0;
}

#main .one-fb .one-fb-flame .group li p.logo-group {
  margin: auto;
  text-align: center;
}

#main .one-fb .one-fb-flame .group li p.logo-group img.fb {
  width: 397px;
  height: auto;
}

#main .one-fb .one-fb-flame .group li p.logo-group img.giga {
  width: 200px;
  height: auto;
}

#main .one-fb .one-fb-flame .group li p.logo-group img.fs {
  width: 394px;
  height: auto;
}

#main .one-fb .one-fb-flame .group li p.logo-group img.craid {
  width: 140px;
  height: auto;
}

#main .one-fb .one-fb-flame .group li .gray-dot {
  margin-top: 24px;
}

#main .one-fb .one-fb-flame .group li .gray-dot li {
  position: relative;
  padding-left: 1.5em; /* テキストのインデント */
  margin-bottom: 1em;
  line-height: 1.7;
  color: #666;
}

#main .one-fb .one-fb-flame .group li .gray-dot li:last-child {
  margin-bottom: 0;
}

#main .one-fb .one-fb-flame .group li .gray-dot li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.6em;
  width: 0.5em;
  height: 0.5em;
  background-color: #bbb; /* グレイの丸 */
  border-radius: 50%;
}

#main h1.pivot-title {
  font-size: 24px;
  padding: 6px 0 16px 20px;
}

#main .bnn-pivot img {
  width: 100%;
  height: auto;
  transition: opacity 0.3s ease;
}

#main .bnn-pivot img:hover {
  opacity: 0.8;
}

.pivot-button-wrapper {
  text-align: center;
  margin: 2em 0;
}

.pivot-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 1.2em;
  background-color: var(--themeColor);
  color: #fff;
  font-size: 16px;
  padding: 1em 2.4em;
  border-radius: 2em; /* 丸み */
  transition: opacity 0.3s ease;
}

.pivot-button:hover {
  opacity: 0.8;
}

.pivot-button .icon {
  width: 10px;
  height: auto;
}




/* フリービットの強み */
body.advantage #main h1 {
  color: #666;
}
body.advantage #main .el img {
  float: right;
  margin: 0 0 10px 20px;
}

body.advantage #main .technology {
  clear: both;
  margin: 50px 0 0 30px;
  padding: 30px 30px 30px 0;
  background: #fafafa;
  width: 700px;
  border-radius: 10px;
}

body.advantage #main .technology h3 {
  margin: 0 0 20px 0 !important;
  padding: 0;
  text-align: center;
  border-bottom: 0 !important;
}
body.advantage #main .technology h3:before {
  content: "";
}

body.advantage #main .technology p {
  width: auto;
}

body.advantage #main .el ul {
  margin: 0 0 0 30px;
}

body.advantage #main .el ul:after {
  display: block;
  content: "";
  clear: both;
}

body.advantage #main .el ul li {
  display: block;
  width: 140px;
  margin: 0;
  padding: 0;
  float: left;
}

body.advantage #main .el ul li img {
  width: 125px;
  height: 92px;
  margin: 5px 7px;
  float: none;
}

body.advantage #main .el ul li h5 {
  margin: 0;
  text-align: center;
  font-size: 14px;
}

body.advantage #main .el ul li p {
  width: auto;
  margin: 0;
  font-size: 12px;
}

body.advantage #main .sip {
  margin: 0 0 50px 0;
  padding-bottom: 30px;
}

/* 沿革 */
body.history #main h1 {
  color: #666;
}
body.history .controls {
  position: relative;
  width: 700px;
  height: 40px;
  margin: 0 0 0 30px;
}

body.history .controls ul.group li {
  display: block;
  margin: 0 0 0 10px;
  padding: 0;
  float: right;
}

body.history .controls ul.group li a {
  display: block;
  padding: 0.3em 0.5em;
  background: #eee;
  color: #666;
  font-size: 12px;
  border-radius: 5px;
}

body.history .controls ul.group li a:hover,
body.history .controls ul.group li.on a {
  color: white;
  background: var(--themeColor);
}

body.history .controls ul.year li {
  display: block;
  margin: 0 10px 0 0;
  padding: 5px 0 0 0;
  color: #666;
  font-size: 14px;
  border-radius: 5px;
  cursor: pointer;
  float: left;
}

body.history .variablelist {
  width: 700px;
  min-height: 500px;
  margin: 20px 0 20px 30px;
}

body.history .variablelist .mix {
  display: none;
  position: relative;
  width: 100%;
  overflow: hidden;
  border-left: 5px solid #ccc;
}

body.history .variablelist .first {
  margin-top: 30px;
}

body.history .variablelist .mix img.pic {
  float: right;
  width: 60px;
  height: auto;
  margin: 0 0 0 10px;
  border-radius: 5px;
}

body.history .variablelist .mix .year {
  display: none;
}

body.history .variablelist .first .year {
  position: absolute;
  left: 0px;
  top: 3px;
  display: block;
  width: 3.3em;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--themeColor) !important;
  font-size: 14px !important;
  font-weight: bold !important;
  text-align: right;
}

body.history .variablelist .mix .month {
  position: absolute;
  left: 50px;
  top: 5px;
  display: block;
  width: 3em;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 13px !important;
  text-align: right;
}

body.history .variablelist .mix .contentbody {
  position: relative;
  margin: 0 0 0 100px !important;
  padding: 5px 0 !important;
  font-size: 13px !important;
  line-height: 1.3em;
  border-bottom: 1px dotted #ccc;
}

body.history .variablelist .mix .contentbody:after {
  display: block;
  content: "";
  clear: both;
}

body.history .variablelist .ylast {
  margin-bottom: 30px !important;
}

body.gov .anchorlinks li a {
  background-color: var(--themeColor);
}
body.gov .anchorlinks li a:hover {
  background-color: var(--themeColorHover);
}
body.gov table th {
  background-color: var(--themeColorHoverNav);
}

/* 経営陣 */
body.management #main h1 {
  color: #666;
}
/* 2020.07.30 追加 */

.ceo ul.ceo-flame {
  display: flex;
  margin-left: 30px;
  color: #666;
}

.ceo ul.ceo-flame li.ceo-plof {
  background: #fafafa;
  width: 440px;
  padding-bottom: 20px;
}

.ceo ul.ceo-flame li.ceo-photo {
  width: 260px;
  line-height: 0;
}

.ceo ul.ceo-flame li.ceo-photo img {
  width: 260px;
  height: auto;
}

dl.ceo-name {
  padding: 20px 10px 10px 0;
  border-bottom: 2px solid var(--themeColor);
  margin-left: 20px;
  margin-bottom: 10px;
}

dl.ceo-name dt {
  font-size: 16px;
  float: unset;
}

dl.ceo-name dd {
  font-size: 26px;
}

dl.ceo-name dd span {
  font-size: 16px;
  padding-left: 10px;
}

dl.ceo-career {
  font-size: 11px;
  padding-left: 20px;
  margin-top: 4px;
  display: flex;
}

dl.ceo-career dt {
  clear: both;
  margin-right: 5px;
  width: 95px;
}

dl.ceo-career dd {
  /* border-left: 1px solid #ccc; */
  padding-left: 5px;
  padding-right: 5px;
  width: 325px;
}

.ceo-details {
  background: #aaa;
  padding: 20px;
  width: 700px;
  margin-left: 30px;
}

.ceo-details p.ceo-details-text {
  color: #ffffff !important;
  line-height: 160% !important;
  margin-left: 0 !important;
  margin-bottom: 0 !important;
}

.ai-blog {
  display: block;
  margin-top: 20px;
  position: relative;
}
.ai-blog::before {
  position: absolute;
  content: "";
  top: 4px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #fff;
}
.ai-blog::after {
  position: absolute;
  content: "";
  left: 4px;
  top: 8px;
  width: 3px;
  height: 3px;

  border-top: 2px solid var(--themeColor);
  border-right: 2px solid var(--themeColor);
  transform: rotate(45deg);
}

.ai-blog a {
  color: #fff;
  padding-left: 20px;
}

.ai-banner {
  display: block;
  margin-top: 5px;
}

.svp {
  margin-top: 40px;
}

.pc-view {
  display: block;
}

.sp-view {
  display: none;
}

body.management .managementbody {
  width: 740px;
  margin-left: 30px;
}

body.management div.ishida,
body.management div.tanaka,
body.management div.shimizu,
body.management div.idei,
body.management div.komeya,
body.management div.takeda,
body.management div.doki,
body.management div.matsuoka,
body.management div.nakamura,
body.management div.kawaguchi,
body.management div.yamaguchi,
body.management div.yatabori,
body.management div.shino,
body.management div.tomomatsu,
body.management div.wada,
body.management div.shibata {
  width: 700px;
  min-height: 300px;
  margin: 0 30px 20px 0;
  padding: 0;
}

body.management div.ishida h2,
body.management div.tanaka h2,
body.management div.shimizu h2 {
  display: block;
  width: 420px;
  margin: 0 0 10px 10px !important;
  padding: 15px 0 0 0 !important;
  font-size: 26px !important;
  border-bottom: 2px solid var(--themeColor) !important;
}
body.management div.idei h2,
body.management div.komeya h2,
body.management div.takeda h2,
body.management div.doki h2,
body.management div.tomomatsu h2,
body.management div.wada h2,
body.management div.shibata h2 {
  display: block;
  width: 440px;
  margin: 0 0 10px 10px !important;
  padding: 15px 0 0 0 !important;
  font-size: 26px !important;
  border-bottom: 2px solid var(--themeColor) !important;
}
body.management div.matsuoka h2,
body.management div.nakamura h2,
body.management div.kawaguchi h2,
body.management div.yamaguchi h2,
body.management div.yatabori h2,
body.management div.shino h2 {
  display: block;
  width: 490px;
  margin: 0 0 10px 10px !important;
  padding: 15px 0 0 0 !important;
  font-size: 26px !important;
  border-bottom: 2px solid var(--themeColor) !important;
}

body.management .managementbody h2:before {
  content: "" !important;
  margin: 0 !important;
}

body.management .managementbody h2 span.en {
  margin: 0 0 0 15px;
  font-size: 16px;
}

body.management .managementbody h2 span.position {
  display: block;
  font-size: 16px;
  margin: 0 10px 0 0 !important;
  padding: 10px 10px 7px 0 !important;
  border-right: 5px solid var(--themeColor);
  float: left;
}

body.management .managementbody p {
  margin: 0 30px 20px 20px !important;
}

body.management .managementbody table {
  width: 440px;
  margin: 0 20px 15px 10px;
  color: #666;
  font-size: 11px;
}

body.management div.ishida table {
  width: 420px;
  margin: 0 20px 150px 10px;
}

body.management div.tanaka table,
body.management div.shimizu table {
  width: 420px;
}

body.management .managementbody th {
  white-space: nowrap;
  vertical-align: top;
  padding: 0 0.2em 0.3em 0;
  line-height: 1.5em;
  width: 100px;
}

body.management .managementbody td {
  vertical-align: top;
  padding: 0 0 0.3em 0.2em;
  line-height: 1.5em;
}

body.management div.ishida {
  background: url("/profile/image/thumb_ishida.png") right top no-repeat #fafafa;
  background-size: 270px auto;
}

body.management div.tanaka {
  background: url("/profile/image/portrait_tanakaB.jpg") right top no-repeat
    #fafafa;
  background-size: 270px auto;
}

body.management div.shimizu {
  background: url("/profile/image/thumb_shimizu.png") right top no-repeat
    #fafafa;
  background-size: 270px auto;
}

body.management div.idei {
  background: url("/profile/image/portrait_ideiB.jpg") right top no-repeat
    #fafafa;
  background-size: 250px auto;
}

body.management div.yoshida {
  background: url("/profile/image/portrait_yoshida.jpg") right top no-repeat
    #fafafa;
  background-size: 250px auto;
}

body.management div.komeya {
  background: url("/profile/image/thumb_komeya.png") right top no-repeat #fafafa;
  background-size: 250px auto;
}

body.management div.takeda {
  background: url("/profile/image/thumb_takeda.png") right top no-repeat #fafafa;
  background-size: 250px auto;
}

body.management div.doki {
  background: url("/profile/image/thumb_doki.png") right top no-repeat #fafafa;
  background-size: 250px auto;
}

body.management div.matsuoka {
  background: url("/profile/image/portrait_matsuoka.png") right top no-repeat
    #fafafa;
  background-size: 200px auto;
}

body.management div.nakamura {
  background: url("/profile/image/portrait_nakamura.jpg") right top no-repeat
    #fafafa;
  background-size: 200px auto;
}

body.management div.kawaguchi {
  background: url("/profile/image/portrait_kawaguchi.jpg") right top no-repeat
    #fafafa;
  background-size: 200px auto;
}

body.management div.yamaguchi {
  background: url("/profile/image/portrait_yamaguchi.jpg") right top no-repeat
    #fafafa;
  background-size: 200px auto;
}

body.management div.yatabori {
  background: url("/profile/image/portrait_yatabori.jpg") right top no-repeat
    #fafafa;
  background-size: 200px auto;
}

body.management div.shino {
  background: url("/profile/image/portrait_shino.jpg") right top no-repeat
    #fafafa;
  background-size: 200px auto;
}

body.management div.tomomatsu {
  background: url("/profile/image/thumb_tomomatsu.png") right top no-repeat
    #fafafa;
  background-size: 250px auto;
}

body.management div.wada {
  background: url("/profile/image/thumb_wada.png") right top no-repeat #fafafa;
  background-size: 250px auto;
}

body.management div.shibata {
  background: url("/profile/image/thumb_shibata.png") right top no-repeat #fafafa;
  background-size: 250px auto;
}

body.management p.note {
  margin: 0 !important;
  padding: 20px !important;
  background: var(--themeColor);
  color: white !important;
}

body.management .managementbody ul {
  width: 700px;
}

body.management .managementbody ul:after {
  display: block;
  clear: both;
  content: "";
}

body.management .managementbody li {
  display: block;
  float: left;
  text-align: center;
  cursor: pointer;
  background: #aaa;
  border-right: 1px solid #fff;
}

/*
body.management .managementbody ul.list1 li {
	width: 33.33333333333333333333%;
	padding: 0 0 10px 0;
	}

body.management .managementbody ul.list1 li img {
	display: block;
	margin: 0 0 10px 0;
	width: 100%;
	height: 332px;
	background: white;
	}

body.management .managementbody ul.list1 li h2 {
	color: white !important;
	font-size: 14px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	}

body.management .managementbody ul.list1 li h2 span {
	font-size: 10px !important;
	margin: 0 !important;
	display: block !important;
	}

body.management .managementbody ul.list1 li p.position {
	color: #ffffff !important;
	font-size: 11px !important;
	margin: 0 !important;
	display: block !important;
	border: 0 !important;
	}
*/

body.management .managementbody ul.list1 {
  width: 465px;
  padding: 20px 0 0 0;
}
body.management .managementbody ul.list2 {
  padding-top: 20px;
}
body.management .managementbody ul.list1 li/*,
body.management .managementbody ul.list2 li*/ {
  width: 50%;
  padding: 0 0 10px 0;
}
body.management .managementbody ul.list2 li {
  width: 33.333333%;
  padding: 0 0 10px 0;
}

body.management .managementbody ul.list1 li h2,
body.management .managementbody ul.list2 li h2 {
  color: white !important;
  font-size: 14px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

body.management .managementbody ul.list1 li h2 span,
body.management .managementbody ul.list2 li h2 span {
  font-size: 10px !important;
  margin: 0 !important;
  display: block !important;
}

body.management .managementbody ul.list1 li p.position,
body.management .managementbody ul.list2 li p.position {
  color: #ffffff !important;
  font-size: 11px !important;
  margin: 0 !important;
  display: block !important;
  border: 0 !important;
}

body.management .managementbody ul.list1 li img,
body.management .managementbody ul.list2 li img {
  display: block;
  margin: 0 auto 10px auto;
  width: 100%;
  height: 332px;
  background: white;
}

body.management .managementbody ul.list3 {
  padding: 20px 0 0 0;
}

body.management .managementbody ul.list3 li {
  width: 25%;
  padding: 10px 0;
}

body.management .managementbody ul.list3 li h2 {
  color: white !important;
  font-size: 14px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

body.management .managementbody ul.list3 li h2 span {
  font-size: 10px !important;
  margin: 0 !important;
  display: block !important;
}

body.management .managementbody ul.list3 li p.position {
  color: #ffffff !important;
  font-size: 11px !important;
  margin: 0 !important;
  display: block !important;
  border: 0 !important;
}

body.management .managementbody ul.list3 li img {
  display: block;
  margin: 0 auto 10px auto;
  width: 80%;
  height: 200px;
}

body.management .managementbody li:last-child {
  border-right: 0;
}

body.management .managementbody .hide {
  display: none;
}

body.management .managementbody li.select {
  background: var(--themeColor) !important;
  position: relative;
}

body.management .managementbody ul li.select:after {
  position: absolute;
  bottom: -7px;
  display: block;
  content: "";
  width: 100%;
  height: 7px;
  background: url("/profile/image/arrow.png") center top no-repeat;
}

/* グループ企業 */
body.group #main h1 {
  color: #666;
}
body.group #main ul {
  display: block;
  width: 720px;
  margin: 0 0 30px 30px;
}

body.group #main ul:after {
  display: block;
  clear: both;
  content: "";
}

body.group #main ul li {
  display: block;
  float: left;
  margin: 0 20px 20px 0;
  padding: 10px;
  width: 220px;
  height: 220px;
  border: 1px solid #ccc;
  box-sizing: border-box;
  color: #666;
  font-size: 14px;
  line-height: 1.3em;
  border-radius: 5px;
}

body.group #main ul li a,
body.group #main ul li span {
  display: block;
  text-align: center;
  color: #333;
}

body.group #main ul li a:hover {
  color: var(--themeColor);
}

body.group #main ul li a img,
body.group #main ul li span img {
  display: block;
  margin: 0 auto;
}

body.group #main ul li img {
  width: 150px;
  height: auto;
}

/*コーポレート・ガバナンス*/
body.gov #main h1 {
  color: #666;
}

/* トップメッセージ */

body.message #main {
  padding-bottom: 50px;
}

body.message #main p {
  margin-bottom: 2em;
}

body.message .messagebody {
  width: 700px;
  padding: 60px 350px 20px 0;
  background: url("/profile/image/bg_message.jpg") right top no-repeat;
  background-size: auto 100%;
}

body.message .sig {
  text-align: right;
  font-size: 1.3em !important;
}

body.message .sig span {
  display: block;
  font-size: 0.8em;
}

/* 地図・所在地 */
body.map #main h1 {
  color: #666;
}
body.map #main div#map_hq,
body.map #main div#map_sh {
  width: 700px;
  height: 600px;
  margin: 0 0 10px 30px;
}

body.en.map #main div#map_hq,
body.en.map #main div#map_sh {
  width: 920px;
}

body.map #main .espacetower {
  float: right;
  margin-right: 250px;
}

body.en.map #main .espacetower {
  float: right;
  margin-right: 30px;
  margin-bottom: 20px;
}

div.mapsize img {
  width: 700px;
  margin: 0 0 10px 30px;
}

/* 地図・所在地 印刷用 */

body.map_print h1 {
  margin-left: 0 !important;
  max-width: 980px !important;
}

body.map_print #main h2 {
  margin: 0 0 10px 0;
  padding: 0 !important;
  font-size: 30px;
  color: #666;
  max-width: 980px !important;
}

body.map_print #main h3 {
  margin: 0 0 10px 0;
  padding: 20px 0 0 0;
  font-size: 22px;
  color: #666;
  max-width: 980px !important;
}

body.map_print #main h4 {
  margin: 0 0 10px 0;
  font-size: 18px;
  color: #666;
}

body.map_print #main p {
  margin: 0 30px 10px 0;
  font-size: 16px;
  color: #666;
}

body.map_print #main div#map_hq,
body.map_print #main div#map_sh {
  width: 100%;
  height: 600px;
  margin: 0 0 10px 0;
}

/* SNS公式アカウント一覧 */
body.social #main h1 {
  color: #666;
}
body.social #main ul {
  width: 700px;
  margin: 0 0 50px 30px;
}

body.social #main ul li {
  position: relative;
  display: block;
  width: 33.3333%;
  margin: 0 0 40px 0;
  float: left;
  text-align: center;
}

body.social #main ul li:nth-child(4) {
  clear: both;
}

body.social #main ul li:nth-child(7) {
  clear: both;
}

body.social #main ul li:nth-child(10) {
  clear: both;
}

body.social #main ul li:nth-child(13) {
  clear: both;
}

body.social #main ul li:nth-child(16) {
  clear: both;
}

body.social #main ul li:nth-child(19) {
  clear: both;
}

body.social #main ul li:hover {
  opacity: 0.8;
}

body.social #main ul li img {
  display: block;
  width: 150px;
  height: auto;
  margin: 0 auto 5px auto;
}

body.social #main ul li span {
  display: block !important;
  text-align: center;
  font-size: 14px;
}

body.social #main ul li:before {
  position: absolute;
  right: 0px;
  top: 0px;
  display: block;
  width: 30px;
  height: 30px;
  font-size: 30px;
  line-height: 1em;
  color: black;
}

body.social #main ul li.fb:before {
  content: "\f082";
  font-family: FontAwesome;
}

body.social #main ul li.tw:before {
  content: url(/profile/image/icon_x.svg);
  width: 28px;
  height: auto;
  display: block;
}

body.social #main ul li.yt:before {
  content: "\f166";
  font-family: FontAwesome;
}

body.social #main ul li.bl:before {
  content: "\f14b";
  font-family: FontAwesome;
}

body.social #main ul li.in:before {
  content: "\f16d";
  font-family: FontAwesome;
}
body.social #main ul li a {
  color: #666;
}

body.gov .gov-img img {
  max-width: 700px;
  width: 100%;
  height: auto;
}

/* greeting */

p.greeting {
  width: 700px;
}

p.greeting img {
  width: 700px;
  height: auto;
}

/* 英語版 */

body.en #main h1 {
  margin: 0 30px 20px 30px !important;
  max-width: 100% !important;
}

body.en #main h2 {
  margin: 0 30px 20px 30px !important;
  max-width: 100% !important;
}

body.en #main p {
  margin: 0 30px 30px 30px !important;
  max-width: 100% !important;
}

body.management div.ishida table.table_en {
  width: 420px;
  margin: 0 20px 85px 10px;
}

body.management .managementbody h2 span.position_en {
  font-size: 16px;
  display: block;
}
body.management div.shimizu table tr.hidden_en {
  display: none;
}

/* 20180827 en stock */

.mb200 {
  margin-bottom: 200px !important;
}

.stock-top-right {
  width: 60% !important;
}

.stock-top-left {
  width: 40% !important;
}

.controls ul.year {
  display: flex;
  flex-wrap: wrap;
}

/* 768〜1023px */
@media screen and (min-width: 768px) and (max-width: 1023px) {
  /* 企業情報トップ */

  body.profile #main div.index_profile {
    margin: 0 0 50px 0;
    width: 100%;
    height: auto;
  }

  /* フリービットの強み */

  body.advantage #main .technology {
    margin-left: 0;
    padding-left: 30px;
  }

  body.advantage #main ul {
    margin-left: 0 !important;
  }

  /* 沿革 */
  body.history .controls {
    margin: 0;
  }

  body.history .variablelist {
    margin: 0 0 20px 0;
  }

  body.history .variablelist .mix {
    padding: 0 0 0 100px;
  }

  /* 経営陣 */

  body.management .managementbody {
    width: 700px;
    margin-left: 0px;
  }

  body.management div.ishida h2,
  body.management div.tanaka h2,
  body.management div.shimizu h2,
  body.management div.sakai h2,
  body.management div.idei h2,
  body.management div.komeya h2,
  body.management div.takeda h2,
  body.management div.doki h2,
  body.management div.matsuoka h2,
  body.management div.nakamura h2,
  body.management div.kawaguchi h2,
  body.management div.yamaguchi h2,
  body.management div.yatabori h2,
  body.management div.shino h2 {
    display: block;
    width: 430px;
    margin: 0 0 10px 0 !important;
    padding: 15px 0 0 0 !important;
    font-size: 26px !important;
    border-bottom: 2px solid var(--themeColor) !important;
  }

  body.management .managementbody h2 span.position {
    display: block;
    font-size: 16px;
    margin: 0 10px 0 10px !important;
    padding: 10px 10px 7px 0 !important;
    border-right: 5px solid var(--themeColor);
    float: left;
  }

  body.management .managementbody div p {
    padding-left: 30px !important;
  }

  body.management .managementbody th {
    width: 80px;
  }

  body.vision #main h2 {
    margin: 50px 0 10px 0;
  }

  body.vision #main h3 {
    margin: 30px 0 10px 0;
  }

  body.vision #main .guideline {
    margin: 0 0 1em 0;
  }

  body.vision #main .message {
    margin: 0 0 1em 0;
  }

  body.vision #main p {
    margin: 0 0 1em 0;
  }

  /* Our Roadmap */

  .our_roadmap #main .fv img {
    width: 100%;
  }

  body.roadmap #main h2 {
    margin-left: 0 !important;
  }

  body.roadmap #main p {
    margin-left: 0 !important;
  }

  body.advantage #main .el {
    margin: 0 0 50px 0;
  }

  body.advantage #main .sip {
    margin: 0 0 50px 0;
  }

  .our_roadmap #main h1 img {
    width: 100%;
  }

  #main .return-web2,
  #main .comparison .comparison-flame li.comparison-web2 {
    margin-right: 10px;
  }

  #main .return .return-flame {
    align-items: stretch;
  }

  #main .return p.arrow,
  #main .comparison p.arrow {
    width: 100%;
  }

  #main .portfolia .portfolia-flame .portfolia-list li h4 {
    height: 80px;
  }

  #main .one-fb .one-fb-flame .group li p.logo-group img.fb,
  #main .one-fb .one-fb-flame .group li p.logo-group img.fs {
    width: 100%;
  }

  .pivot-img-infra {
    position: absolute;
    top: 30px;
    left: 36px;
  }

  .pivot-img-web3 {
    position: absolute;
    top: 166px;
    left: 210px;
  }

  .pivot-img-infra dt,
  .pivot-img-web3 dt {
    font-size: 16px;
    margin-bottom: 0px;
  }

  .pivot-img-infra dd,
  .pivot-img-web3 dd {
    line-height: 160%;
    font-size: 14px;
  }

  .our_roadmap #main .pivot-img-platform {
    position: absolute;
    top: 22px;
    right: 60px;
    font-size: 16px;
    color: var(--themeColor);
    padding: 4px 16px;
    border: 2px solid var(--themeColor);
    border-radius: 8px;
  }

  /* グループ企業 */

  body.group #main ul {
    margin: 0;
  }

  body.business .businessbody img {
    margin-left: 0 !important;
  }

  /* 地図・所在地 */

  body.map #main div#map_hq,
  body.map #main div#map_sh,
  body.en.map #main div#map_hq,
  body.en.map #main div#map_sh {
    width: 700px;
    height: 600px;
    margin: 0 30px 10px 0;
  }

  body.map #main .espacetower,
  body.en.map #main .espacetower {
    float: right;
    margin-right: 0;
  }

  /* SNS公式アカウント一覧 */

  body.social #main ul {
    margin: 0 0 50px 0;
  }

  /* greeting */

  p.greeting {
    width: 100%;
  }

  p.greeting img {
    width: 100%;
    height: auto;
  }

  /* 英語版 */

  body.en #main h1 {
    margin: 0 0 20px 0 !important;
    max-width: 100% !important;
  }

  body.en #main h2 {
    margin: 0 0 20px 0 !important;
    max-width: 100% !important;
  }

  body.en #main p {
    margin: 0 0 30px 0 !important;
    max-width: 100% !important;
  }
  body.management .managementbody h2 span.position_en {
    font-size: 16px;
    display: block;
  }
} /* 768〜1023px */

/* 767px以下 */
@media screen and (max-width: 767px) {
  .memberlistSVG {
    width: 100%;
    height: auto;
  }

  /* 企業情報トップ */

  body.profile #main div.index_profile {
    margin: 0 0 50px 0;
    width: 100%;
    height: auto;
  }

  body.profile #main div.index_profile:after {
    display: block;
    clear: both;
    content: "";
  }

  body.profile #main div.index_profile div {
    width: 100%;
    float: none;
  }

  body.profile #main div.index_profile div p {
    margin: 0;
  }

  /* フリービットの強み */

  body.advantage #main .technology {
    margin-left: 0;
    padding: 10px !important;
  }

  body.advantage #main ul {
    margin-left: 0 !important;
  }

  body.vision #main h2 {
    width: 100%;
    font-weight: bold;
    margin: 50px 0 10px 0;
  }

  body.vision #main h3 {
    width: 100%;
    font-weight: bold;
    margin: 50px 0 10px 0;
  }

  body.vision #main .guideline {
    width: 100%;
    margin: 0 0 1em 0;
  }

  body.vision #main .guideline img {
    width: 100%;
  }

  body.vision #main .message {
    width: 100%;
    margin: 0 0 1em 0;
  }

  body.vision #main .message img {
    width: 100%;
  }

  body.vision #main p {
    width: 100%;
    margin: 0 0 1em 0;
  }

  body.vision #main .guideline__list {
    flex-direction: column;
  }
  body.vision #main .guideline__list__child {
    width: 100%;
    padding: 8px;
    margin-bottom: 20px;
  }

  /* Our Roadmap */

  #main .fv {
  background-image: none;
  padding: 24px;
}

.our_roadmap  #main .fv h1 {
  font-size: 24px;
  line-height: 160%;
}

.our_roadmap  #main .fv .fv-txt {
  margin-top: 8px;
  padding-bottom: 16px;
  line-height: 170%;
}

.our_roadmap  #main .fv img {
  width: 100%;
  height: auto;
}

.our_roadmap #main p.fv-movie-link a {
  font-size: 14px;
  width: 100%;
  text-align: left;
  transition: unset;
}

  body.roadmap #main h2 {
    width: 100% !important;
    font-weight: bold !important;
    margin: 50px 0 10px 0 !important;
  }

  body.roadmap #main p {
    width: 100% !important;
    margin: 0 0 20px 0 !important;
  }

  body.roadmap #main p img {
    max-width: 100% !important;
  }

  body.roadmap #main p.lead {
    font-size: 150%;
    font-weight: bold !important;
    text-align: left;
  }

  body.roadmap #main p.lead br {
    display: none;
  }

  body.advantage #main .el {
    width: 100%;
    margin: 0 0 50px 0;
  }

  body.advantage #main .el img {
    display: block;
    max-width: 100%;
    margin: 0 auto;
    float: none;
  }

  body.advantage #main .el ul {
    width: 100%;
    margin: 0 0 10px 0;
  }

  body.advantage #main .el ul li {
    width: 50%;
    margin: 0 0 10px 0;
    padding: 10px;
  }

  body.advantage #main .el ul li img {
    display: block;
    margin: 5px auto;
  }

  body.advantage #main .el .technology {
    display: block;
    max-width: 100%;
    padding: 0;
  }

  body.advantage #main .sip {
    width: 100%;
    margin: 0 0 50px 0;
  }

  .pivot-button {
    border-radius: 3.0em;
  }

  /* 沿革 */
  body.history .controls {
    position: relative;
    width: 100%;
    height: 80px;
    margin: 0;
  }

  body.history .controls ul:after {
    display: block;
    content: "";
    clear: both;
  }

  body.history .controls ul.year {
    clear: both;
  }

  body.history .controls ul.year li {
    margin: 15px 15px 0 0;
  }

  body.history .variablelist {
    width: 100%;
    margin: 0 0 20px 0;
  }

  body.history .variablelist {
    margin: 60px 0 20px 0;
  }

  body.history .variablelist .mix {
    padding: 0 0 0 100px;
  }

  /* 経営陣 */

  /* 2020.7.30 追加 */

  .ceo ul.ceo-flame {
    display: block;
    margin-left: 0px;
  }

  .ceo ul.ceo-flame li.ceo-plof {
    width: 100%;
  }

  .ceo ul.ceo-flame li.ceo-photo {
    width: 100%;
  }

  .ceo ul.ceo-flame li.ceo-photo img {
    width: 100%;
  }

  dl.ceo-name {
    padding: 20px 10px 10px 0;
    border-bottom: 2px solid var(--themeColor);
    margin-left: 20px;
    margin-bottom: 10px;
  }

  dl.ceo-name dt {
    font-size: 16px;
    float: unset;
  }

  dl.ceo-name dd {
    font-size: 26px;
  }

  dl.ceo-name dd span {
    font-size: 16px;
    padding-left: 10px;
  }

  dl.ceo-career {
    padding-right: 20px;
  }

  dl.ceo-career dt {
    width: 95px;
  }

  dl.ceo-career dd {
    width: -webkit-fill-available;
  }

  .ceo-details {
    width: 100%;
    margin-left: 0px;
  }

  .ceo-details p.ceo-details-text {
    font-size: 14px !important;
  }

  .ai-blog {
    display: block;
    margin-top: 20px;
  }

  .ai-blog a {
    color: #fff;
    background: url(../../profile/image/icon_arrow.png) no-repeat left center /
      14px auto;
    padding-left: 20px;
  }

  .ai-banner {
    display: block;
    margin-top: 5px;
  }

  .svp {
    margin-top: 40px;
  }

  .pc-view {
    display: none;
  }

  .sp-view {
    display: block;
  }

  body.management .managementbody {
    width: 100%;
    margin-left: 0;
  }

  body.management div.ishida,
  body.management div.tanaka,
  body.management div.shimizu,
  body.management div.idei,
  body.management div.komeya,
  body.management div.takeda,
  body.management div.doki,
  body.management div.matsuoka,
  body.management div.nakamura,
  body.management div.kawaguchi,
  body.management div.yamaguchi,
  body.management div.yatabori,
  body.management div.shino,
  body.management div.tomomatsu,
  body.management div.wada,
  body.management div.shibata {
    width: 100%;
    height: auto !important;
    background-size: 100% auto;
    padding: 150% 0 20px 0;
    background-position: center top;
  }
  body.management div.matsuoka,
  body.management div.nakamura,
  body.management div.kawaguchi,
  body.management div.yamaguchi,
  body.management div.yatabori,
  body.management div.shino {
    background-size: 70% auto;
    padding: 108% 0 20px 0;
  }

  body.management div.ishida h2,
  body.management div.tanaka h2,
  body.management div.shimizu h2,
  body.management div.idei h2,
  body.management div.komeya h2,
  body.management div.takeda h2,
  body.management div.doki h2,
  body.management div.matsuoka h2,
  body.management div.nakamura h2,
  body.management div.kawaguchi h2,
  body.management div.yamaguchi h2,
  body.management div.yatabori h2,
  body.management div.shino h2,
  body.management div.tomomatsu h2,
  body.management div.wada h2,
  body.management div.shibata h2 {
    display: block;
    width: 100%;
    margin: 0 0 10px 0 !important;
    padding: 0 10px !important;
    font-size: 26px !important;
    border-bottom: 2px solid var(--themeColor) !important;
  }

  body.management .managementbody h2 span.en {
    margin: 0 0 0 15px;
    font-size: 16px;
  }

  body.management .managementbody h2 span.position {
    display: block;
    font-size: 16px;
    margin: 0 10px 0 0 !important;
    padding: 10px 10px 7px 0 !important;
    border-right: none;
    float: none;
  }

  body.management .managementbody p {
    margin: 0 20px 20px 20px !important;
  }

  body.management .managementbody table {
    width: auto !important;
    margin: 0 10px 20px 10px !important;
  }

  body.management .managementbody ul {
    display: none;
  }

  body.management .managementbody .hide {
    display: block;
  }

  body.management p.note {
    margin: 0 0 -20px 0 !important;
    padding: 20px !important;
    background: var(--themeColor);
    color: white !important;
  }

  /* トップメッセージ */

  body.message .messagebody {
    width: 100%;
    height: 1350px;
    padding: 0 0 250px 0;
    background: url("/profile/image/bg_message.jpg") 0 1000px no-repeat;
    background-size: 100% auto;
  }

  /* グループ企業 */

  body.group #main ul {
    width: 100%;
    margin: 0 0 30px 0;
  }

  body.group #main ul li {
    width: 50%;
    height: auto;
    margin: 0 0 10px 0;
    padding: 5px;
    border: 0;
  }

  body.group #main ul li a {
    border: 1px solid #ccc;
    width: 100%;
    height: 170px;
    padding-bottom: 5px;
    border-radius: 5px;
    font-size: 12px;
  }

  body.group #main ul li img {
    /*width: 80%;201808変更*/
    width: 40%;
    height: auto;
  }

  body.business .businessbody {
    width: 100%;
    margin-left: 0;
  }

  body.business .businessbody .group img.pctab {
    display: none;
  }

  body.business .businessbody .group img.sp {
    display: block;
    width: 320px;
    height: auto;
    margin: 0 auto;
  }

  body.business .businessbody .detail {
    border-bottom: 0;
  }

  body.business .businessbody .detail div {
    padding: 0.5em 1em;
    height: 200px;
    margin: 0 120px 0 0;
  }

  body.business .businessbody .detail h2 {
    color: var(--themeColor);
    margin: 0;
    padding: 1em 0 0.5em 0;
    font-size: 20px;
    line-height: 1.2em;
  }

  body.business .businessbody .detail p {
    font-size: 16px;
    line-height: 1.5em;
    color: #666;
  }

  /* 地図・所在地 */

  body.map #main div#map_hq,
  body.map #main div#map_sh,
  body.en.map #main div#map_hq,
  body.en.map #main div#map_sh {
    width: 100%;
    height: 500px;
    margin: 0 30px 10px 0;
  }

  body.map #main .espacetower,
  body.en.map #main .espacetower {
    float: none;
    display: block;
    width: 100%;
    height: auto;
    margin: 0;
  }

  div.mapsize img {
    width: 100%;
    margin: 0;
  }

  /* SNS公式アカウント一覧 */

  body.social #main ul {
    width: 100%;
    margin: 0 0 50px 0;
  }

  body.social #main ul li {
    width: 100%;
    margin: 0 0 50px 0;
    float: none;
  }

  body.social #main ul li:hover {
    opacity: 0.8;
  }

  body.social #main ul li img {
    display: block;
    width: 150px;
    height: auto;
    margin: 0 auto 5px auto;
  }

  body.social #main ul li span {
    display: block !important;
    text-align: center;
    font-size: 14px;
  }

  body.social #main ul li.tw:before {
    content: url(/profile/image/icon_x_sp.svg);
    width: 46px;
    height: auto;
    display: block;
  }

  body.social #main ul li:before {
    position: absolute;
    right: 0px;
    top: 0px;
    display: block;
    width: 50px;
    height: 50px;
    font-size: 50px;
    line-height: 1em;
    color: var(--themeColor);
  }

  /* greeting */

  p.greeting {
    width: 100%;
  }

  p.greeting img {
    width: 100%;
    height: auto;
  }

  /* ガバナンス */

  .gov #main li {
    width: 100%;
    word-break: break-all;
  }

  .gov #main p {
    word-break: break-all;
    margin: 0;
  }

  #main ul.govindent {
    margin: 0 0 2em 0;
  }

  .govindent li {
    padding-right: 0em !important;
  }

  /* 英語版 */

  body.en #main h1 {
    margin: 0 0 20px 0 !important;
    max-width: 100% !important;
  }

  body.en #main h2 {
    margin: 0 0 20px 0 !important;
    max-width: 100% !important;
  }

  body.en #main p {
    margin: 0 0 30px 0 !important;
    max-width: 100% !important;
  }
  body.management .managementbody h2 span.position_en {
    display: block;
    font-size: 16px;
    margin: 0 10px 0 0 !important;
    padding: 10px 10px 7px 0 !important;
    border-right: none;
    float: none;
  }

  /* 20180828 stock */

  .mb200 {
    margin-bottom: 50px !important;
  }

  .stock-top-right {
    width: 100% !important;
  }

  .stock-top-left {
    width: 100% !important;
  }

  /* 2025.07.24 Our Roadmap */

  .our_roadmap #crumb {
    width: 90%;
  }

  .our_roadmap #main h1 img {
    width: 100%;
  }

  .our_roadmap #main h2 {
  font-size: 24px;
  } 

  #main .return {
    margin: 40px 0 0 0;
  }

  #main .return h2 {
    font-size: 20px;
  }

  #main .return h2 br {
    display: block;
  }

  #main .return .return-flame {
    display: block;
  }

  #main .return-web2, #main .return-web3 {
    width: 100%;
  }

  #main .return-web2 .title, #main .return-web3 .title {
    font-size: 18px;
  }

  #main .return p.arrow,
  #main .comparison p.arrow {
    display: none;
  }

  #main .return .arrow-sp,
  #main .comparison .arrow-sp {
    padding: 10px 0 4px;
    text-align: center;
  }

  #main .return .arrow-sp img,
  #main .comparison .arrow-sp img {
    width: 40px;
    height: auto;
  }

  #main .portfolia .portfolia-flame h3 {
    font-size: 20px;
  }

  #main .portfolia .portfolia-flame .portfolia-list {
    display: block;
  }

  #main .portfolia .portfolia-flame .portfolia-list li {
    width: 100%;
    margin-bottom: 16px;
    border : 1px solid #00A0E9;
  }

  #main .portfolia .portfolia-flame .portfolia-list li:last-child {
      margin-bottom: 0;
  }

  #main .portfolia .portfolia-flame .portfolia-list li p.idea-txt {
    line-height: 170%;
  }

  #main .comparison h2 {
    margin: 40px auto 8px;
    font-size: 20px;
  }

  #main .comparison .comparison-flame {
    display: block;
  }

  #main .comparison .comparison-flame li.comparison-web2, #main .comparison .comparison-flame li.comparison-web3 {
    width: 100%;
  }

  #main .pivot h2 {
    margin: 60px auto 8px;
    font-size: 22px;
  }

  #main .platformer h2 {
  font-size: 22px;
}

  #main .step h2 {
    margin: 40px auto 8px;
    font-size: 20px;
  }

  #main .step h2 br {
    display: block;
  }

  #main .step .product {
    display: block;
  }

  #main .step .product li {
    width: 100%;
    margin-bottom: 16px;
  }

  #main .step .product li .step-img img {
    width: 70%;    
  }

  #main .one-fb {
    margin-bottom: 40px;
  }

  #main .one-fb h2 img {
    width: 80%;
  }

  #main .one-fb .one-fb-flame h3 {
    font-size: 20px;
  }

  #main .one-fb .one-fb-flame h3 br {
    display: block;
  }

  #main .one-fb .one-fb-flame .sub-txt {
    text-align: left;
  }

  #main .one-fb .one-fb-flame .sub-txt br {
    display: none;
  }

  #main .one-fb .one-fb-flame .group {
    display: block;
  }

  #main .one-fb .one-fb-flame .group li.group-frame {
    width: 100%;
    margin-bottom: 20px;
  }

  #main .one-fb .one-fb-flame .group li.group-frame:last-child {
    margin-bottom: 0;
  }

  #main .one-fb .one-fb-flame .group li p.logo-group img.fb,
  #main .one-fb .one-fb-flame .group li p.logo-group img.fs {
    width: 100%;
  }
  #main .one-fb .one-fb-flame .group li p.logo-group img.giga {
    width: 60%;
  }
  #main .one-fb .one-fb-flame .group li p.logo-group img.craid {
    width: 50%;
  }
}

/* 480px以下 / 01808追記*/

@media screen and (max-width: 480px) {
  body.group #main ul li img {
    width: 80%;
    height: auto;
  }
}

/* PDF アイコン */

.irp-icon {
  text-decoration: none;
}
.irp-icon-pdf {
  background-image: none;
}
.irp-icon-pdf:after {
  content: "\f1c1";
  font: 14px "FontAwesome";
  color: #bc333c;
}