@charset "utf-8";

/* =============================================================================
    Stlye
============================================================================= */

/* Common
=============================================== */
html {
  font-size: 10px;
}

body {
  overflow-x: scroll;
  line-height: 1.4;
  letter-spacing: 1px;
  -webkit-text-size-adjust: 100%;
  font-family: sans-serif;
  font-size: 1.5em;
}

.mbNone {
  display: none;
}

/* ------ clearfix ------ */
.clearfix:after { /* float release */
  content: "";
  display: block;
  clear: both;
  height: 0;
  line-height: 0;
}


/* Header
----------------------------------------------- */
div#header {
  width: 100%;
  padding: 5px 0 8px;
  border-top: 2px #466f9f solid;
  border-bottom: 2px #466f9f solid;
  background: #fff;
}

h1#headerCompanyLogo,
p#headerCompanyLogo {
  margin: 0 0 10px;
  text-align: center;
  background: url(../image/header_companyLogo_back.svg) repeat-x left 39px;
}

p#headerOfficeLogo {
  margin: 0 0 10px;
  text-align: center;
}

div#headerMap ul {
  overflow: hidden; /* float release */
  margin: 0 0 10px;
}

div#headerMap li {
  float: left;
  width: 50%;
  box-sizing: border-box;
  padding: 0 10px;
  text-align: center;
}

div#headerMap li a,
div#headerMap li span {
  position: relative;
  display: block;
  box-sizing: border-box;
  line-height: 1;
  padding: 14px 5px;
  border-radius: 3px;
  color: #1e1e24;
  text-align: center;
  text-decoration: none;
  background: #e6e9ed;
}

div#headerMap li a::before {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  margin: 0 5px 0 0;
  border-bottom: 5px transparent solid;
  border-top: 5px transparent solid;
  border-left: 7px #1e1e24 solid;
}

div#headerMap ul li span {
  line-height: 1.2;
  padding: 7px 0;
  font-size: 1.2rem;
}

/* ------ search => ------ */
div#headerMap form {
  margin: 0 10px 10px;
  padding: 0 28px 0 0;
  border: 1px #d3d9e1 solid;
  border-radius: 3px;
  text-align: left;
}

div#headerMap form input {
  vertical-align: middle;
}

div#headerMap form input[name="q"] {
  box-sizing: border-box;
  width: 100%;
  height: 48px;
  padding: 2px;
  border: none;
  border-right: 1px #d3d9e1 dotted;
  font-size: 1.4rem;
}

div#headerMap form input[name="btnG"] {
  margin: 2px -26px 2px 2px;
}
/* ------ <= search ------ */

ul#headerOffice,
p#headerContact {
  display: none;
}

p#headerOfficeName {
  margin: 0 0 10px;
  font-size: 1.2rem;
  text-align: center;
}

/* ------ headerNav ------ */
ul#headerNav {
  display: table;
  width: 100%;
}

ul#headerNav > li {
  display: table-cell;
}

ul#headerNav > li > a,
ul#headerNav > li > p {
  display: block;
  width: 44px;
  height: 44px;
  overflow: hidden;
  margin: 0 auto;
}

ul#headerNav > li.home a::before {
  content: url(../image/mb_header_navHome.svg);
}

ul#headerNav > li.product p::before {
  content: url(../image/mb_header_navProduct.svg);
}

ul#headerNav > li.office p::before {
  content: url(../image/mb_header_navOffice.svg);
}

ul#headerNav > li.news a::before {
  content: url(../image/mb_header_navNews.svg);
}

ul#headerNav > li.company a::before {
  content: url(../image/mb_header_navCompany.svg);
}

ul#headerNav > li ul {
  display: none;
  position: absolute;
  left: 0;
  z-index: 10;
  width: 100%;
  margin: 8px 0 0;
}

ul#headerNav > li ul li {
  margin: 0 10px;
  border-left: 1px #8f9eb0 solid;
  border-right: 1px #8f9eb0 solid;
  background: #fff;
}

ul#headerNav > li ul li a {
  display: block;
  position: relative;
  width: 100%;
  box-sizing: border-box;
  padding: 5px 20px 5px 10px;
  border-bottom: 1px #8f9eb0 solid;
  color: inherit;
  text-decoration: none;
  word-break: keep-all;
}

ul#headerNav > li ul li:first-child a {
  border-top: 1px #8f9eb0 solid;
}

ul#headerNav > li ul a:hover {
  background: #f3f3f3;
}

ul#headerNav > li ul li a::before,
ul#headerNav > li ul li a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 12px;
}

ul#headerNav > li ul li a::before {
  margin-top: -11px;
  padding: 10px;
  border: 1px #466f9f solid;
  border-radius: 50%;
}

ul#headerNav > li ul li a::after {
  width: 0;
  height: 0;
  margin: -5px 6px 0 0;
  border-bottom: 5px transparent solid;
  border-top: 5px transparent solid;
  border-left: 8px #466f9f solid;
}


/* Footer
----------------------------------------------- */
div#footer {
  margin: 40px 0 0;
  padding: 10px 0 0;
  border-top: 2px #466f9f solid;
  border-bottom: 5px #466f9f solid;
  color: #fff;
  background: #9bbce5;
}

div#footer div.sitemap {
  margin: 0 0 30px;
}

div#footer div.sitemap h2 {
  padding: 0.5em 0;
  font-weight: bold;
  text-align: center;
  background: #466f9f;
}

div#footer div.sitemap h3,
div#footer div.type > h4 {
  position: relative;
  padding: 0.2em;
  border-bottom: 1px #fff solid;
}

div#footer div.sitemap h4::before {
  content: "\0025a0";
  padding: 0 0 0 0.5em;
}

div#footer div.type > h3::after,
div#footer div.type > h4::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  width: 8px;
  height: 8px;
  margin: -6px 20px 0 0;
  border-right: 2px #fff solid;
  border-bottom: 2px #fff solid;
  border-radius: 1px;
}

div#footer div.type > h3.open::after,
div#footer div.type > h4.open::after {
  transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
  margin-top: -3px;
}

div#footer div.type.nosub > h3::after {
  content: none;
}

div#footer div.sitemap a {
  display: block;
  position: relative;
  margin: 0 50px 0 0;
  padding: 0.5em 40px 0.5em 0.5em;
  border: 1px #c6e0ff solid;
  color: #167fff;
  text-decoration: none;
  background: #c6e0ff;
}

div#footer div.sitemap a::before,
div#footer div.sitemap a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 12px;
}

div#footer div.sitemap a::before {
  margin-top: -12px;
  padding: 12px;
  border-radius: 50%;
  background: #fff;
}

div#footer div.sitemap a::after {
  width: 0;
  height: 0;
  margin: -7px 6px 0 0;
  border-bottom: 7px transparent solid;
  border-top: 7px transparent solid;
  border-left: 10px #9bbce5 solid;
}

div#footer div.sitemap span {
  display: inline-block;
  padding: 0.5em 0;
}

div#footer div.type > dl,
div#footer div.type > ul {
  display: none;
}

div#footer div.type > dl > dd,
div#footer div.type > ul > li {
  padding: 0.2em;
  border-bottom: 1px #fff solid;
}

div#footer div.type > dl a,
div#footer div.type > ul a {
  margin-left: 1em;
}

div#footer div.sitemap dt::before {
  content: "\0030fb";
  padding: 0 0 0 0.5em;
}

div#footer div.type li > p {
  padding: 0.5em 0 0.5em 1em;
}

div#footer div.type li > ul {
  margin: 0 0 0 1.5em;
}

/* ------ footerNav => ------ */
ul#footerNav {
  margin: 0 0 30px;
  text-align: center;
}

ul#footerNav li {
  margin: 0 0 20px;
}

ul#footerNav a {
  position: relative;
  display: inline-block;
  padding: 0.5em 3em;
  color: #fff;
  border-radius: 2.6em;
  text-decoration: none;
  background: #466f9f;
}

ul#footerNav a::before,
ul#footerNav a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 12px;
}

ul#footerNav a::before {
  margin-top: -11px;
  padding: 10px;
  border: 1px #fff solid;
  border-radius: 50%;
}

ul#footerNav a::after {
  width: 0;
  height: 0;
  margin: -5px 6px 0 0;
  border-bottom: 5px transparent solid;
  border-top: 5px transparent solid;
  border-left: 8px #fff solid;
}
/* ------ <= footerNav ------ */

address p.companyName {
  margin: 0 0 10px;
  padding: 0.5em 0;
  font-weight: bold;
  text-align: center;
  background: #466f9f;
}

address dl {
  margin: 0 10px 20px;
  color: #333;
}

address dt {
  line-height: 1;
  margin: 20px 0 0;
  border-bottom: 3px #333 double;
}

address dl dt:first-child {
  margin-top: 0;
}

address dl dd + dd.address {
  margin: 10px 0 0;
}

p#footerContact {
  margin: 0 0 10px;
  text-align: center;
}

p#copyright {
  margin: 0 10px;
  color: #333;
  font-size: 1.3rem;
}


/* Contents
----------------------------------------------- */
/* ------ breadcrumbs => ------ */
nav#breadcrumbs {
 background: #f8f8f8;
}

nav#breadcrumbs p {
  margin: 341px 0 0;
  padding: 0.3em 5px;
  font-size: 1.2rem;
}

nav#breadcrumbs p a {
  margin: 0 2px 0 0;
  padding: 2px 10px 0 0;
  color: #adadad;
  text-decoration: none;
  background: url(../image/icon_gt.svg) no-repeat right center;
}
/* ------ <= breadcrumbs ------ */

div.article {
  margin: 346px 0 0;
}

nav + article div.article {
  margin-top: 0;
}

h1#topImage {
  position: relative;
  height: 74px;
  overflow: hidden;
  text-indent: -101%;
  background-position: center top;
  background-repeat: no-repeat;
  background-size: auto 100%;
}

h1#topImage::before,
h1#topImage::after {
  content: "";
  display: block;
  position: absolute;
  width: 50%;
  height: 74px;
  top: 0;
  left: 0;
  z-index: -1;
}

h1#topImage::after {
  left: 50%;
}

h1.border,
h2.border {
  line-height: 1.2;
  margin: 0 0 5px;
  border-bottom: 2px #466f9f solid;
  font-size: 2rem;
  text-align: center;
}

h1.dot,
h2.dot {
  line-height: 1.2;
  margin: 0 5px 5px;
  border-bottom: 2px #466f9f dotted;
  font-size: 1.8rem;
}

/* ------ ページ内リンクのヘッダ高さ吸収 ------ */
div.linkWrap {
  margin: -155px 0 0;
  padding: 155px 0 0;
}

/* ------ gotoTop ------ */
p#gotoTop {
  position: fixed;
  right: 10px;
  bottom: 10px;
  z-index: 10;
  opacity: 0.5;
}

/* ------ center button ------ */
p.centerButton {
  text-align: center;
}

/* ------ detailsButton => ------ */
p.detailsButton,
dd.detailsButton,
ul.detailsButton > li {
  text-align: center;
}

ul.detailsButton > li {
  margin: 0 0 10px;
}

p.detailsButton a,
dd.detailsButton a,
ul.detailsButton > li a {
  display: inline-block;
  line-height: 1;
  padding: 8px 30px 7px;
  color: #fff;
  text-decoration: none;
  background: #adadad;
}

p.detailsButton a::before,
dd.detailsButton a::before,
ul.detailsButton > li a::before {
  content: "";
  display: inline-block;
  position: relative;
  top: -1px;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  width: 7px;
  height: 7px;
  margin: 0 10px 0 0;
  border-right: 2px solid #fff;
  border-top: 2px solid #fff;
}
/* ------ <= detailsButton ------ */


/* Pages: Index
----------------------------------------------- */
/* ====== Slider ====== */
div#indexSlider img {
  height: 190px;
}

div.slider .slick-dots {
  line-height: 1;
  bottom: -30px;
}

div.slider .slick-dots li {
  width: 16px;
}

div.slider .slick-dots li button,
div.slider .slick-dots li button::before,
div.slider .slick-dots li.slick-active button::before {
  width: 12px;
  height: 12px;
}

div.slider .slick-dots li button::before {
  content: url(../js/slick/btn_off.svg);
  line-height: 12px;
}

div.slider .slick-dots li.slick-active button::before {
  content: url(../js/slick/btn_on.svg);
  line-height: 12px;
}

div#indexSlider .slick-prev,
div#indexSlider .slick-next {
  width: 36px;
  height: 36px;
  z-index: 1;
}

div#indexSlider .slick-prev {
  left: 0;
  margin: 0 0 0 16px;
}

div#indexSlider .slick-prev::before {
  content: url(../js/slick/arrow_left.svg);
}

div#indexSlider .slick-next {
  right: 0;
  margin: 0 16px 0 0;
}

div#indexSlider .slick-next::before {
  content: url(../js/slick/arrow_right.svg);
}

/* ====== indexInformation ====== */
div.indexInformation {
  margin: 0 auto 50px;
  padding: 20px 0 0;
}

div.indexInformation p.image {
  margin: 0 0 10px;
}

div.indexInformation p.image img {
  width: 100%;
}

div.indexInformation div.info p.text {
  margin: 0 10px 1em;
}

/* ====== introLink ====== */
div.introLink {
  border-top: 1px #466f9f solid;
}

div.introLink li {
  border-bottom: 1px #466f9f solid;
  text-align: center;
}

div.introLink li a {
  position: relative;
  display: block;
}

div.introLink li a::before,
div.introLink li a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 12px;
  z-index: 1;
}

div.introLink li a::before {
  margin-top: -10px;
  padding: 10px;
  border: 1px #466f9f solid;
  border-radius: 50%;
}

div.introLink li a::after {
  width: 0;
  height: 0;
  margin: -2px 6px 0 0;
  border-top: 8px #466f9f solid;
  border-left: 5px transparent solid;
  border-right: 5px transparent solid;
}

/* ====== contents ====== */
div#index div.linkWrap:nth-child(2n) > section {
  background: #edf1f2;
}

div#index section div.introduction {
  padding: 30px 0;
}

div#index section div.introduction h2.title {
  margin: 0 10px 20px;
  text-align: center;
}

div#index section div.introduction h2.title img {
  width: 100%;
  max-height: 20px;
}

div#index section p.image + p.text {
  margin: 0 10px 20px;
}

/* ------ [Common] p.list => ------ */
div#index p.list {
  margin: 0 0 20px;
  text-align: center;
}

div#index p.list a {
  position: relative;
  display: block;
  line-height: 1;
  vertical-align: middle;
  margin: 0 10px;
  padding: 5px 10px 5px 26px;
  color: #fff;
  text-align: left;
  text-decoration: none;
  background: #2b8aa5;
}

div#index p.list a::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  width: 5px;
  height: 5px;
  margin: -4px 0 0 8px;
  border-right: 2px #fff solid;
  border-top: 2px #fff solid;
}
/* ------ <= [Common] p.list ------ */

div#index div.introduction p.image {
  margin: 0 0 20px;
}

div#index div.introduction p.image img {
  width: 100%;
}

div#index div.introduction ul.featureRow {
  margin: 0 0 30px;
}

div#index div.introduction ul.featureRow li {
  margin: 0 0 10px;
  text-align: center;
}

div#index div.introduction ul.featureColumn li {
  margin: 0 0 10px;
  text-align: center;
}

div#index div.introduction ul.featureRow li a,
div#index div.introduction ul.featureColumn li a {
  display: inline-block;
}

div#index div.introduction ul.featureColumn dl {
  margin: 0 0 5px;
  text-align: center;
}

div#index div.introduction ul.featureColumn p.text {
  margin: 0 10px;
  text-align: left;
}

div#index div.introduction ul.featureColumn dl.details dt {
  margin: 0 0 5px;
}

div#index div.introduction ul.featureColumn dl.details dd {
  margin: 0 10px;
  text-align: left;
}

/* ------ ファインセラミックス ------ */
div#index div#ceramics dl.list {
  margin: 0 10px 10px;
}

div#index div#ceramics dl.list dt {
  margin: 10px 0 0;
  padding: 2px 10px;
  color: #fff;
  background: #6f9dd1;
}

div#index div#ceramics dl.list dd {
  margin: 0 0 5px;
}

div#index div#ceramics dl.list a {
  color: inherit;
}

div#index div div.introduction h3 {
  margin: 0 0 10px;
  padding: 2px 0;
  border-top: 1px #466e9f solid;
  border-bottom: 1px #466e9f solid;
  color: #466e9f;
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
}

div#index div div.introduction p.centerButton {
  margin: 0 10px;
}
div#index div div.introduction dl.list + p.centerButton {
  margin-bottom: 30px;
}

div#index div div.introduction p.centerButton a {
  display: block;
  position: relative;
  overflow: hidden;
  width: 300px;
  height: 74px;
  margin: 0 auto;
}

div#index section div.introduction p.centerButton a[href$="ceramics/lovtec.html"] {
  height: 93px;
}

div#index section div.introduction p.centerButton a[href$="ceramics/lovtec.html"]::before {
  content: url(../image/mb_banner_new_LovTEC.svg);
  display: block;
}

div#index section div.introduction p.centerButton a[href$="contact/"]::before {
  content: url(../image/mb_contact.svg);
  display: block;
}

div#index section div.introduction p.centerButton img {
  display: none;
}

/* ====== 下部 ====== */
div#index > div.contents {
  padding: 30px 0 0;
}

div#index > div.contents h2.border {
  margin: 0 5px 10px;
  padding: 0 0 0 8px;
  border-left: 5px #466e9f solid;
}

div#index > div.contents h2.border img {
  max-width: 100%;
}

div#index > div.contents dl.office {
  width: 230px;
  margin: 0 auto 20px;
  border: 1px #466e9f solid;
}

div#index > div.contents dl.office dt {
  height: 77px;
  margin: 1px;
  text-align: center;
  border: 1px #466e9f solid;
  background: #466e9f;
}

div#index > div.contents dl.office dt::before {
  content: "";
  display: inline-block;
  width: 0;
  height: 75px;
  vertical-align: middle;
}

div#index > div.contents dl.office dt img {
  vertical-align: middle;
}

div#index > div.contents dl.office dd {
  text-align: center;
}

/* ------ news ------ */
div#index > div.contents dl.news {
  background: #edf1f2;
}

div#indexNews dl {
  height: 160px;
  overflow: auto;
  margin: 0 10px;
  padding: 5px 5px 0;
}

div#indexNews dl dt {
  margin: 1em 0 0;
  border-bottom: 1px #000 solid;
}

div#indexNews dl dt:first-child {
  margin-top: 0;
}


/* Pages: Fine Ceramics
----------------------------------------------- */
div#ceramics h1#topImage {
  background: url(../image/mb_ceramics_top.jpg) no-repeat center top;
  background-size: auto 100%;
}

div#ceramics h1#topImage::before {
  background: #476ec9;
}

/* ====== type & product ====== */
div#ceramics div#type h2,
div#ceramics div#product h2 {
  height: 50px;
  overflow: hidden;
}

div#ceramics div#type h2::before,
div#ceramics div#product h2::before {
  content: "";
  display: block;
  width: 100%;
  height: 50px;
  background-position: center center;
  background-repeat: no-repeat;
}

div#ceramics div#type div.product,
div#ceramics div#product div.product {
  padding: 30px 0;
}

/* ====== type ====== */
div#ceramics div#type h2::before {
  background-image: url(../image/ceramics_index_type_title_off.svg);
}

div#ceramics div#type div.contents:nth-child(2n+1) {
  background: #edf1f2;
}

div#ceramics div#type h3 {
  margin: 0 0 10px;
  text-align: center;
}

div#ceramics div#type h3 img {
  height: 12px;
}

/* ------ dl.row ------ */
div#ceramics div#type dl.row {
  margin: 0 0 30px;
}

div#ceramics div#type dl.row dt {
  margin: 0 0 5px;
}

div#ceramics div#type dl.row dt img {
  width: 100%;
}

div#ceramics div#type dl.row dd.title {
  margin: 0 10px 5px;
  border-bottom: 1px #000 solid;
  font-size: 1.6rem;
  text-align: center;
}

div#ceramics div#type dl.row dd.text {
  margin: 0 10px 5px;
}

div#ceramics div#type dl.row dd.lineup {
  margin: 10px 0 5px;
  text-align: center;
}

div#ceramics div#type dl.row dd.lineup dt {
  margin: 0 10px 5px;
  border-bottom: 1px #000 dotted;
}

div#ceramics div#type dl.row dd.lineup dd {
  display: inline-block;
  margin: 0 5px 5px;
  padding: 0 3px;
  border: 1px #000 solid;
  border-radius: 3px;
  background: #fff;
}

/* ------ Lov TEC ------ */
div#ceramics div#type div#lovtec p.image {
  margin: 0 0 10px;
}

div#ceramics div#type div#lovtec p.image img {
  width: 100%;
}

div#ceramics div#type div#lovtec dl dt {
  margin: 0 10px 5px;
  font-size: 1.6rem;
  border-bottom: 1px #000 solid;
  font-size: 1.6rem;
  text-align: center;
  letter-spacing: 0.2em;
}

div#ceramics div#type div#lovtec span.initials {
  text-decoration: underline;
}

div#ceramics div#type div#lovtec dd {
  margin: 0 10px 10px;
}

div#ceramics div#type div#lovtec p.detailsButton {
  margin: 0 0 20px;
}

/* ------ nexcera ------ */
div#ceramics div#type div#nexcera p.image {
  margin: 0 0 10px;
}

div#ceramics div#type div#nexcera p.image img {
  width: 100%;
}

div#ceramics div#type div#nexcera dl dt {
  margin: 0 10px 5px;
  border-bottom: 1px #000 solid;
  font-size: 1.6rem;
  text-align: center;
  letter-spacing: 0.2em;
}

div#ceramics div#type div#nexcera dl dd {
  margin: 0 10px 10px;
}

/* ------ nonOxide, oxide, machinable ------ */

/* ====== product ====== */
div#ceramics div#product h2 {
  margin: 0 0 20px;
}

div#ceramics div#product h2::before {
  background-image: url(../image/ceramics_index_product_title_off.svg);
}

/* ------ dl.list ------ */
div#ceramics div#product dl.list {
  margin: 0 0 15px;
}

div#ceramics div#product dl.list dt {
  margin: 0 0 5px;
  text-align: center;
}

div#ceramics div#product dl.list dd {
  margin: 0 10px;
}

/* ------ a.process ------ */
div#ceramics div#type a.process dl {
  width: 230px;
  margin: 20px auto;
  border: 1px #466e9f solid;
}

div#ceramics div#type a.process dl dt {
  height: 77px;
  margin: 1px;
  text-align: center;
  border: 1px #466e9f solid;
  background: #466e9f;
}

div#ceramics div#type a.process dl dt::before {
  content: "";
  display: inline-block;
  width: 0;
  height: 75px;
  vertical-align: middle;
}

div#ceramics div#type a.process dl dt img {
  vertical-align: middle;
}

div#ceramics div#type a.process dl dd {
  text-align: center;
}

/* ------ ul.image ------ */
div#ceramics div#product ul.image {
  margin: 30px 0 0;
}

div#ceramics div#product ul.image li {
  margin: 0 0 15px;
  font-size: 1.6rem;
  text-align: center;
}

div#ceramics div#product ul.image img {
  width: 100%;
  margin: 0 0 5px;
}


/* Pages: Heater, Insulator
----------------------------------------------- */
/* ====== heater, insulator ====== */
div#heater div.contents section:nth-child(2n),
div#insulator div.contents section:nth-child(2n) {
  background: #edf1f2;
}

div#heater div.contents div.product,
div#insulator div.contents div.product {
  padding: 30px 0;
}

div#heater div.contents h2,
div#insulator div.contents h2 {
  margin: 0 0 5px;
  font-size: 1.6rem;
  text-align: center;
}

div#heater div.contents p.image,
div#insulator div.contents p.image {
  margin: 0 0 5px;
}

div#heater div.contents p.image img,
div#insulator div.contents p.image img {
  width: 100%;
}

div#heater div.contents p.text,
div#insulator div.contents p.text {
  margin: 0 10px 10px;
}

/* ====== heater ====== */
div#heater h1#topImage {
  background-image: url(../image/mb_heater_top.jpg);
}

div#heater h1#topImage::before {
  background: #d42800;
}

div#heater h1#topImage::after {
  background: #ff826e;
}

/* ====== insulator ====== */
div#insulator h1#topImage {
  background-image: url(../image/mb_insulator_top.jpg);
}

div#insulator h1#topImage::before {
  background: #242e63;
}

div#insulator h1#topImage::after {
  background: #232d62;
}


/* Pages: details
----------------------------------------------- */
/* ====== sideNav ====== */
div#details > div#sideNav {
  position: relative;
  margin: 10px 10px 30px;
  z-index: 1;
}

div#details > div#sideNav div.wrap,
div#details > div#sideNav div.wrap ul {
  display: none;
}

div#details > div#sideNav div.wrap {
  position: absolute;
  box-sizing: border-box;
  width: 100%;
  border: 1px #436d9f solid;
  border-bottom: none;
  background: #fff;
}

div#details > div#sideNav p.title {
  position: relative;
  padding: 10px 25px 10px 0;
  border-bottom: 1px #436d9f solid;
  color: #fff;
  text-align: center;
  background: #436d9f;
}

div#details > div#sideNav p.title::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  width: 8px;
  height: 8px;
  margin: -6px 20px 0 0;
  border-right: 2px #fff solid;
  border-bottom: 2px #fff solid;
  border-radius: 1px;
}

div#details > div#sideNav p.title.open::after {
  transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
  margin-top: -3px;
}

div#details > div#sideNav div.wrap p.title {
  padding: 0;
  color: inherit;
  background: #fff;
}

div#details > div#sideNav div.wrap p.title::after {
  border-right: 2px #436d9f solid;
  border-bottom: 2px #436d9f solid;
}

div#details > div#sideNav div.wrap p.title.nosub::after {
  content: none;
}

div#details > div#sideNav div.wrap p.title a,
div#details > div#sideNav div.wrap p.title span {
  display: block;
  margin: 0 40px 0 0;
  padding: 0.5em 0;
}

div#details > div#sideNav div.wrap p.title.nosub a {
  margin-right: 0;
  padding-right: 12px;
}

div#details > div#sideNav ul {
  background: #f2f9ff;
}

div#details > div#sideNav li {
  border-bottom: 1px #436d9f solid;
  text-align: center;
}

div#details > div#sideNav a {
  display: block;
  position: relative;
  padding: 0.5em 40px 0.5em 0.5em;
  text-decoration: none;
}

div#details > div#sideNav a::before,
div#details > div#sideNav a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 12px;
}

div#details > div#sideNav a::before {
  margin-top: -13px;
  padding: 12px;
  border: 1px #436d9f solid;
  border-radius: 50%;
}

div#details > div#sideNav a::after {
  width: 0;
  height: 0;
  margin: -7px 7px 0 0;
  border-bottom: 7px transparent solid;
  border-top: 7px transparent solid;
  border-left: 10px #5487c4 solid;
}

/* ====== contents ====== */
div#details > div.contents h1 {
  line-height: 1.2;
  margin: 0 0 5px;
  border-bottom: 2px #466f9f solid;
  font-size: 2rem;
  text-align: center;
}

div#details > div.contents h2 {
  line-height: 1.2;
  margin: 0 5px 5px;
  border-bottom: 2px #466f9f dotted;
  font-size: 1.8rem;
}


/* ------ ellipse title => ------ */
div#details > div.contents h2.ellipse {
  position: relative;
  line-height: 1;
  margin: 0 5px 10px;
  padding: 0.6em 0 0.4em 15px;
  border: none;
  border-radius: 30px;
  color: #fff;
  font-size: 1.6rem;
  background: #ff4d4d;
}

div#details > div.contents h2.ellipse::before {
  content: "";
  display: block;
  position: absolute;
  top: 1px;
  right: 1px;
  width: 40%;
  height: 1.88em;
  border-radius: 28px;
  background: #fff;
}

div#details > div.contents h2.ellipse > sup {
  position: relative;
  bottom: 1ex;
  height: 0;
  line-height: 1;
  vertical-align: baseline;
}

div#details > div.contents h2.ellipse > span {
  position: absolute;
  left: 0;
  width: 100%;
  box-sizing: border-box;
  padding: 0.1em 0 0 45%;
  color: #000;
  font-size: 1.4rem;
  text-align: center;
}
/* ------ <= ellipse title ------ */

div#details > div.contents h3.belt {
  line-height: 1;
  margin: 0 5px 5px;
  padding: 6px 0 4px;
  color: #fff;
  text-align: center;
  background: #2b8aa5;
}

div#details > div.contents h3.diamond {
  margin: 0 5px 5px;
  font-size: 1.5rem;
}

div#details > div.contents h3.diamond::before {
  content: "\0025c6";
}

div#details > div.contents h4.circle {
  line-height: 1.2;
  margin: 0 5px 5px;
  border-bottom: 1px #2b8aa5 solid;
  font-size: 1.6rem;
}

div#details > div.contents h4.circle::before {
  content: "\0025cf";
}

div#details > div.contents h5.ellipse {
  display: table;
  line-height: 1.4;
  margin: 0 auto 15px;
  padding: 6px 30px 4px;
  border-radius: 48% / 50%;
  box-shadow: 1px 1px 2px 0px #ccc;
  font-size: 1.6rem;
}

div#details > div.contents h5.ellipse.yellow {
  background: #ffd800;
}

div#details > div.contents h5.ellipse.blue {
  color: #fff;
  background: #466e9f;
}

/* ------ information ------ */
div#details > div.contents div.information {
  margin: 0 0 40px;
}

div#details > div.contents div.information p.text {
  margin: 0 10px 10px;
}

div#details > div.contents p.information {
  margin: 0 10px 40px;
}

div#details > div.contents div.half,
div#details > div.contents div.product,
div#details > div.contents div.material {
  margin: 0 0 40px;
}

div#details > div.contents p.topImage img {
  width: 100%;
  margin: 0 0 10px;
}

div#details > div.contents p.image {
  margin: 0 0 10px;
}

div#details > div.contents p.image img,
div#details > div.contents ul.imageDouble img {
  max-width: 100%;
  margin: 0 auto;
}

div#details > div.contents p.detailsButton {
  margin: 0 0 10px;
}

div#details > div.contents p.attention {
  margin: 0 10px;
}

div#details > div.contents div.half p.image,
div#details > div.contents div.product p.image,
div#details > div.contents div.material p.image {
  margin: 0 10px 10px;
}

div#details > div.contents div.material p.text,
div#details > div.contents div.product p.text {
  margin: 0 10px 10px;
}

/* ------ dl.feature => ------ */
div#details > div.contents dl.feature dt {
  margin: 0 5px 2px;
  border-bottom: 1px #466f9f dotted;
}

div#details > div.contents dl.feature dt::before {
  content: "\0025c6";
  margin: 0 2px 0 0;
  color: #e81a1a;
}

div#details > div.contents dl.feature dd {
  margin: 0 10px 10px 1em;
}
/* ------ <= dl.feature ------ */

/* ------ physicality table ------ */
div#details > div.contents table.physicality,
div#details > div.contents table.spec {
  display: none;
}

/* ------ physicality table (仮) */
div#details > div.contents table.noMb {
  display: table;
  margin: 0 10px;
}

div#details > div.contents table.noMb th,
div#details > div.contents table.noMb td {
  border: 1px #000 solid;
}

div#details > div.contents table.noMb th,
div#details > div.contents table.noMb td {
  padding: 2px 5px 1px;
}

div#details > div.contents table.noMb th {
  font-weight: normal;
  background: #ccedff;
}

div#details > div.contents table.noMb thead th:first-child,
div#details > div.contents table.noMb tbody th {
  text-align: left;
}

div#details > div.contents table.noMb tr.noUnit th:first-child {
  border-right: none;
}

div#details > div.contents table.noMb tr.noUnit th:first-child + th {
  border-left: none;
}

div#details > div.contents table.noMb td {
  text-align: center;
}
/* physicality table (仮) ------ */

div#details > div.contents div.mbTable {
  margin: 0 10px 5px;
}

div#details > div.contents div.mbTable table,
div#details > div.contents div.mbTable table thead,
div#details > div.contents div.mbTable table tbody,
div#details > div.contents div.mbTable table tr,
div#details > div.contents div.mbTable table th,
div#details > div.contents div.mbTable table td {
  display: block;
}

div#details > div.contents div.mbTable table {
  margin: 40px 0 0;
  border-top: 1px #466f9f solid;
}

div#details > div.contents div.mbTable table:first-child {
  margin-top: 0;
}

div#details > div.contents div.mbTable table th,
div#details > div.contents div.mbTable table td {
  padding: 0.2em 0;
  text-align: center;
}

div#details > div.contents div.mbTable table th {
  border-bottom: 1px #466f9f dotted;
  font-weight: bold;
  background: #ccedff;
}

div#details > div.contents div.mbTable table thead th + th {
  border-bottom: 1px #466f9f solid;
  font-weight: normal;
  background: none;
}

div#details > div.contents div.mbTable table td {
  border-bottom: 1px #466f9f solid;
}

/* ------ table.lineup ------ */
div#details > div.contents table.lineup {
  margin: 0 auto 10px;
  font-size: 1.4rem;
}

div#details > div.contents table.lineup th,
div#details > div.contents table.lineup td {
  padding: 2px 5px 1px;
  border: 1px #000 solid;
}

div#details > div.contents table.lineup th {
  background: #ccedff;
}

div#details > div.contents table.lineup tbody th {
  text-align: left;
}

div#details > div.contents table.lineup td {
  text-align: center;
}

/* ====== [Page] Sialon, SiC, B4C, AlN ====== */
div#details div#sialon h1,
div#details div#sic h1,
div#details div#b4c h1,
div#details div#aln h1 {
  margin: 0 0 20px;
}

div#details div#sialon ol.number,
div#details div#sic ol.number,
div#details div#b4c ol.number,
div#details div#aln ol.number {
  margin: 0 10px;
}

div#details div#sialon ol.number dd {
  margin: 0 0 0 1em;
}

div#details div#sialon p.image,
div#details div#sic p.image,
div#details div#b4c p.image,
div#details div#aln p.image {
  text-align: center;
}

div#details div#sialon p.image img,
div#details div#sic p.image img,
div#details div#b4c p.image img,
div#details div#aln p.image img {
  max-width: 300px;
}

div#details div#sialon ul.imageDouble {
  margin: 0 10px 40px;
  text-align: center;
}

div#details div#sialon ul.imageDouble li {
  margin: 0 0 10px;
}

img[src$="ceramics_sialon_table_alpha.jpg"] {
  max-width: 358px;
}

img[src$="ceramics_sialon_table_E.jpg"] {
  max-width: 375px;
}

div#details p.attention + p.detailsButton {
  margin-top: 20px;
}

/* ------ ul.mark ------ */
ul.mark {
  margin: 0 10px 30px;
}

ul.mark li {
  padding: 0 0 0 1em;
  text-indent: -1em;
}

/* ------ ul.diamond ------ */
div#details > div.contents ul.diamond {
  margin: 0 10px 30px;
}

div#details > div.contents ul.diamond li {
  margin: 0 0 0 1em;
  text-indent: -1em;
}

div#details > div.contents ul.diamond li::before {
  content: "\0025c6";
}

/* ====== [Page] NEXCERA ====== */
div#details div#nexcera p.introduction {
  box-sizing: border-box;
  margin: 0 5px 10px;
  padding: 5px 8px;
  border: 1px solid #466e9f;
  border-radius: 3px;
  text-align: center;
  background: #f2f9ff;
}

/* ====== [Page] Process ====== */
div#details div#process ol.process {
  margin: 20px 0 0;
}

div#details div#process ol.process > li {
  margin: 0 0 10px;
  padding: 0 0 80px;
  background: url(../image/quality_process_arrow.svg) no-repeat center bottom;
}

div#details div#process ol.process > li:last-child {
  margin: 0;
  padding: 0;
  background: none;
}

div#details div#process dl {
  padding: 0 0 2px;
  background: #fff;
}

div#details div#process dl dt {
  margin: 0 0 5px;
  padding: 5px 0;
  color: #fff;
  font-size: 1.6rem;
  text-align: center;
  background: #466f9f;
}

div#details div#process dl dt.short {
  text-indent: 1em;
  letter-spacing: 1em;
}

div#details div#process dl dd {
  margin: 0 10px 10px;
}

div#details div#process dl li::before {
  content: "\0030fb";
}

div#details div#process dl dd.image {
  text-align: center;
}

div#details div#process dl dd.image img {
  max-width: 100%;
}

/* ====== [Page] Machinable Ceramics ====== */
div#details div#machinable ul.attention {
  margin: 0 10px 10px;
}

/* ====== [Page] Standard ====== */
div#details div#standard img {
  max-width: 100%;
}

div#details div#standard ul {
  margin: 0 10px 10px;
}

div#details div#standard ul li {
  margin: 0 0 0 0.6em;
  text-indent: -0.6em;
}

div#details div#standard dl.imageBox,
div#details div#standard dl.image {
  margin: 0 10px;
}

div#details div#standard dl.image dt:first-child {
  margin: 0 0 10px;
}

div#details div#standard dl.imageBox dd,
div#details div#standard dl.image dd {
  margin: 0 0 30px;
  text-align: center;
}


/* ====== [Page] Mirror ====== */
div#details div#mirror img {
  max-width: 100%;
}

/* ------ ol.flow1 ------ */
div#details div#mirror ol.flow1 {
  margin: 0 10px 30px;
}

div#details div#mirror ol.flow1 li {
  text-align: center;
}

div#details div#mirror ol.flow1 li.process {
  width: 196px;
  height: 74px;
  overflow: hidden;
  margin: 10px auto;
}

div#details div#mirror ol.flow1 li.process::before {
  content: url(../image/mb_ceramics_mirror_flow1_processing01.svg);
  display: block;
}

div#details div#mirror ol.flow1 li.result {
  position: relative;
  margin: 0 0 40px;
}

div#details div#mirror ol.flow1 li.result::after {
  content: url(../image/mb_ceramics_mirror_arrow_curve.svg);
  position: absolute;
  top: 105px;
  right: 8px;
}

/* ------ ol.flow1 ------ */
div#details div#mirror ol.flow2 {
  margin: 0 10px 30px;
}

div#details div#mirror ol.flow2 li {
  text-align: center;
}

div#details div#mirror ol.flow2 li.process {
  width: 120px;
  height: 45px;
  overflow: hidden;
  margin: 10px auto;
}

div#details div#mirror ol.flow2 li.process::before {
  content: url(../image/mb_ceramics_mirror_flow2_processing01.svg);
  display: block;
}

div#details div#mirror ol.flow2 li.result {
  position: relative;
  margin: 20px 0 0;
  padding: 10px 108px 5px 10px;
  border: 1px #ccc solid;
  background: #e6e6e6;
}

div#details div#mirror ol.flow2 li.result::after {
  content: url(../image/ceramics_mirror_border.svg);
  position: absolute;
  top: 42%;
  right: 5px;
  margin: -7% 0 0;
}

div#details div#mirror ol.flow2 li.result p {
  margin: 0 -58px 0 0;
}

/* ------ stability ------ */
div#details div#mirror div.stability div.half {
  margin: 0 0 10px;
}

div#details div#mirror div.stability p.sample {
  margin: 0 10px;
  text-align: center;
}

div#details div#mirror div.stability ol.data {
  margin: 0 10px 20px;
}

div#details div#mirror div.stability ol.data li {
  text-align: right;
}

div#details div#mirror div.stability ol.data li:first-child {
  margin: 0 0 10px;
  padding: 0 0 55px;
  background: url(../image/mb_ceramics_mirror_arrow_down_blue_s.svg) no-repeat center bottom;
}

div#details div#mirror div.stability p.value {
  margin: 0 10px 20px;
  padding: 5px 10px 3px;
  border: 1px #ccc solid;
  color: #f00;
  background: #deebf7;
}

div#details div#mirror div.stability p.result {
  margin: 0 10px 30px;
  padding: 55px 0 0;
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  background: url(../image/mb_ceramics_mirror_arrow_down_red_s.svg) no-repeat center top;
}


/* ====== [Page] Electrostatic Chuck ====== */
div#details div#electrostaticChuck p.information {
  margin-bottom: 10px;
}

div#details div#electrostaticChuck p.image {
  margin: 0 10px 40px;
  text-align: center;
}

div#details div#electrostaticChuck ul {
  margin: 0 10px 10px;
}

/* ====== [Page] AdsorptionChuck Chuck ====== */
div#details div#adsorptionChuck ul.notes {
  margin: 0 10px;
}

div#details div#adsorptionChuck ul.notes li {
  margin: 0 0 10px;
}

div#details div#adsorptionChuck p.attention {
  margin-bottom: 10px;
}

div#details div#adsorptionChuck p.image {
  text-align: center;
}

div#details div#adsorptionChuck div.product ul.mark.space > li {
  margin-bottom: 1em;
}

div#details div#adsorptionChuck div.product ul.mark.space > li.noMark {
  text-indent: 0;
}

/* ====== [Page] Probe Card ====== */
div#details div#probecard p.imageNotes {
  margin: -5px 5px 10px;
  font-size: 1.3rem;
}

div#details div#probecard ul.diamond {
  margin: 0 10px 30px;
}

div#details div#probecard ul.diamond li::before {
  content: "\0025c6";
}

div#details div#probecard div.half {
  margin-bottom: 10px;
}

div#details div#probecard p.image {
  text-align: center;
}

div#details div#probecard p.image img {
  max-width: 100%;
}


/* ====== [Page] Air Stage ====== */
div#details div#airStage ul {
  margin: 0 10px;
}

div#details div#airStage ul.image li {
  margin: 0 0 10px;
  text-align: center;
}

div#details div#airStage ul.image img {
  max-width: 100%;
}

div#details div#airStage div.mbTable table th:empty {
  display: none;
}

div#details div#airStage div.mbTable table th {
  background: #f2f9ff;
}

div#details div#airStage div.mbTable table th:first-child {
  background: #ccedff;
}


/* ====== [Page] Ultrasonic Alignment ====== */
div#details div#ultrasonicAlignment div.list {
  margin: 0 0 40px;
}

div#details div#ultrasonicAlignment div.list dl {
  margin: 0 0 20px;
}

div#details div#ultrasonicAlignment div.list dl dt {
  line-height: 1;
  margin: 0 10px 5px;
  padding: 6px 0 4px;
  color: #fff;
  text-align: center;
  background: #2b8aa5;
}

div#details div#ultrasonicAlignment div.list dl dd {
  overflow: hidden; /* float release */
  margin: 0 10px;
}

div#details div#ultrasonicAlignment div.list dl dd span::before {
  content: "\00ff1a";
  margin: 0 0.5em 0 -0.5em;
}


/* ====== [Page] WDS ====== */
div#details div#wds div.information em {
  font-weight: bold;
  text-decoration: underline;
}

div#details div#wds div.characteristic ol.number > li {
  margin: 0 0 10px;
}

div#details div#wds div.characteristic ol.number {
  margin: 0 10px 10px;
}

div#details div#wds div.characteristic ol.number dd {
  margin: 0 10px 0 1em;
}

div#details div#wds p.image {
  text-align: center;
}

div#details div#wds p.image img,
div#details div#wds p.centerImage img {
  max-width: 100%;
}


/* ====== [Page] Insulating Ring ====== */
div#details div#insulatingRing table.physicality ul {
  overflow: hidden; /* float release */
  text-align: left;
}

div#details div#insulatingRing table.physicality li {
  float: left;
  margin: 0 0 0 1em;
}


/* ====== [Page] Mica Heater ====== */
div#details div#micaHeater div.material table.physicality th[colspan] {
  text-align: center;
}

div#details div#micaHeater div.material table.physicality th:not([colspan]) {
  background: #f2f9ff;
}


/* ====== [Page] AlN HotPlate ====== */
div#details div#alnHotPlate div.product div.half {
  margin: 0 10px;
}

div#details div#alnHotPlate div.product div.half h3.belt {
  margin: 0 0 5px;
}

div#details div#alnHotPlate div.product div.half table.physicality {
  width: 100%;
  margin: 0 0 20px;
}


/* ====== [Page] Jacket Heater ====== */
div#details div#jacketHeater div.feature ol.feature > li {
  margin: 0 10px 20px;
}
div#details div#jacketHeater div.feature ol.feature ul.mark {
  margin-bottom: 5px;
}

div#details div#jacketHeater div.feature ul.notes {
  position: relative;
  margin: 0 5px;
  padding: 2px 5px;
  border: 1px #ccc solid;
  background: #e6e6e6;
}

div#details div#jacketHeater div.half p.notes {
  margin: 0 10px;
}

div#details div#jacketHeater div.half + p.image {
  margin-top: -30px;
}

div#details div#jacketHeater p.positionImage {
  margin: 0 10px;
}

div#details div#jacketHeater p.positionImage img {
  max-width: 100%;
}

div#details div#jacketHeater div.controller > p.text {
  margin: 0 10px 10px;
}

div#details div#jacketHeater div.controller > ol.list {
  margin: 0 10px;
}

div#details div#jacketHeater div.controller > ol.list p.text {
  margin: 0 0 0 1em;
}

div#details div#jacketHeater div.controller > ol.list ul.notes {
  margin: 5px 0 20px;
}

div#details div#jacketHeater div.introBox div.intro ol.point li {
  position: relative;
  margin: 0 10px 30px;
  padding: 3px 5px 2px;
  line-height: 1.4;
  border: 1px #000 solid;
  box-shadow: 0 0 0 1px #fff inset;
  color: #f31717;
  text-align: center;
  background: #e7e7e7;
}

div#details div#jacketHeater div.introBox div.intro ol.point li::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 0;
  height: 0;
  margin: -24px 0 0 -8px;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 18px solid #f31717;
}

div#details div#jacketHeater div.introBox div.intro ol.point li:first-child::before {
  content: none;
}

div#details div#jacketHeater div.introBox div.intro ol.point + p.notes {
  margin: -20px 10px 30px;
  text-align: right;
}

div#details div#jacketHeater div.introBox div.intro p.notes {
  margin: 0 10px 30px;
}

div#details div#jacketHeater div.introBox ol.mark {
  margin: 0 10px;
}

div#details div#jacketHeater div.example ol.importation li {
  position: relative;
  margin: 0 10px 30px;
  line-height: 1.4;
  text-align: center;
}

div#details div#jacketHeater div.example ol.importation li::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 0;
  height: 0;
  margin: -24px 0 0 -8px;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 18px solid #f31717;
}

div#details div#jacketHeater div.example ol.importation li:first-child::before {
  content: none;
}
div#details div#jacketHeater div.example ol.example li {
  box-sizing: border-box;
  margin: 0 10px 10px;
  padding: 5px 8px;
  border: 1px #466e9f solid;
  background: #f2f9ff;
}

div#details div#jacketHeater div.example ol.example p.title {
  text-decoration: underline;
}

div#details div#jacketHeater div.example ol.example p.text {
  margin: 0 0 0 1em;
}

div#details div#jacketHeater div.example ol.example + p.notes {
  margin: -5px 10px 0;
}

div#details div#jacketHeater div.jacket dl.ellipse dt {
  display: table;
  width: 200px;
  line-height: 1.4;
  margin: 0 auto 5px;
  padding: 6px 0 4px;
  border-radius: 10% / 50%;
  box-shadow: 1px 1px 2px 0px #ccc;
  color: #fff;
  font-size: 1.6rem;
  text-align: center;
  background: #ff7271;
}

div#details div#jacketHeater div.jacket dl.ellipse dd {
  margin: 0 10px 20px;
  text-align: center;
}

div#details div#jacketHeater div.jacket p.notes {
  margin: 0 10px 30px;
  font-size: 1.3rem;
  text-align: right;
}

div#details div#jacketHeater div.jacket ol.example li {
  position: relative;
  margin: 0 10px 35px;
  text-align: center;
}

div#details div#jacketHeater div.jacket ol.example li::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 0;
  height: 0;
  margin: -25px 0 0 -15px;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 18px solid #466e9f;
}

div#details div#jacketHeater div.jacket ol.example li:first-child::before {
  content: none;
}


/* ====== [Page] Setter ====== */
div#details div#setter h1 span {
  display: table;
  margin: 0 auto 5px;
  padding: 5px 10px 4px;
  color: #fff;
  font-size: 1.5rem;
  background: #002060;
}

div#details div#setter p.information {
  margin: 20px 0;
  font-size: 2rem;
  text-align: center;
}

div#details div#setter div.platect > p.text {
  margin: 0 10px 10px;
}

div#details div#setter div.platect > p.image,
div#details div#setter div.platect div.box > p.image,
div#details div#setter div.platect div.box > p.text {
  margin: 0 10px 10px;
}

div#details div#setter div.platect div.element {
  margin: 0 5px 30px;
  padding: 10px 5px;
  border: 1px #fe6464 solid;
  border-radius: 14px;
  box-shadow: 0 0 0 1px #fff inset;
  background: #ffe6e7;
}

div#details div#setter div.platect div.element h3 {
  margin: 0 10px 10px 5px;
}

div#details div#setter div.platect div.element h3 img {
  width: 100%;
}

div#details div#setter div.platect div.element p.rightImage {
  margin: 0 0 5px;
}

div#details div#setter div.platect div.element p.rightImage img {
  width: 100%;
}

div#details div#setter div.half {
  margin: 0 0 10px;
}

div#details div#setter div.half p.title,
div#details div#setter div.half > ul {
  margin: 0 10px;
}



/* ====== [Page] Office ====== */
div#details div#office {
  position: relative;
}

div#details div#office div.map {
  padding: 330px 0 0;
  background: url(../image/mb_quarity_office.svg) no-repeat center top;
}

div#details div#office dl {
  line-height: 1.4;
  margin: 0 10px 20px;
  text-shadow: 1px 0 0 #fff, 0 1px 0 #fff, -1px 0 0 #fff, 0 -1px 0 #fff;
}

div#details div#office dl dt {
  font-weight: bold;
}

div#details div#office dl dd {
  margin: 0 0 0 1em;
}

div#details div#office dl.office {
  color: #0068b7;
}


div#details div#office ul.type {
  position: absolute;
  top: 350px;
  right:0;
  line-height: 1.2;
}

div#details div#office ul.type li {
  margin: 0 10px;
  font-size: 1.2rem;
  text-align: right;
}

div#details div#office ul.type li.office {
  color: #0068b7;
}

div#details div#office img[src$="quality_office_link_ariake.jpg"] {
  width: 233px;
  margin: 2px 0 0;
}


/* Pages: Contact
----------------------------------------------- */
/* ------ index ------ */
div#contact h1#topImage {
  margin: 10px 0 30px;
  background: url(../image/header_officeLogo.svg) no-repeat center top;
  background-size: auto 100%;
}

div#contact > div.contents ul.list li {
  margin: 0 10px 20px;
}

div#contact > div.contents ul.list li a {
  display: block;
  position: relative;
  line-height: 1.4;
  margin: 0 5px;
  padding: 5px 5px 5px 20px;
  border: 1px #ffb400 solid;
  border-radius: 3px;
  box-shadow: 0 0 0 1px #fff inset;
  color: inherit;
  text-align: left;
  text-decoration: none;
  background: #fc0;
}

div#contact > div.contents ul.list li a::before {
  content: "";
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 0;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  width: 6px;
  height: 6px;
  margin: -4px 0 0 5px;
  border-right: 2px solid #000;
  border-top: 2px solid #000;
}

/* ------ page ------ */
div#contact p.information,
div#contact p.attention {
  margin: 5px 10px 1em;
}

div#contact p.caution,
div#contact span.caution {
  color: #f00;
  font-weight: bold;
}

div#contact ul.error li,
div#contact p.caution {
  position: relative;
  padding: 0 0 0 14px;
  color: #f00;
}

div#contact ul.error li:before,
div#contact p.caution:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 0;
  margin: 0.4em 0 0 1px;
  border-bottom: 5px solid transparent;
  border-top: 5px solid transparent;
  border-left: 7px solid #f00;
}

div#contact ul.error li {
  margin: 0 10px 5px;
}

div#contact dl.form {
  margin: 30px 0 0;
}

div#contact dl.form dt {
  margin: 0 10px 5px;
  padding: 0.2em 0;
  border-top: 1px #466f9f solid;
  border-bottom: 1px #466f9f dotted;
  font-weight: bold;
  text-align: center;
  background: #f2f9ff;
}

div#contact dl.form dt span[lang="en"] {
  margin: 0 0 0 1em;
  font-size: 1.2rem;
  font-weight: normal;
}

div#contact dl.form dd {
  margin: 0 10px 1em;
}

div#contactForm div.innerBox dl.form dt {
  margin: 0 0 5px;
}

div#contactForm div.innerBox dl.form dd {
  margin: 0 0 1em;
}

div#contact dl.form input[type="text"],
div#contact dl.form textarea {
  width: 100%;
  min-height: 44px;
  box-sizing: border-box;
  padding: 2px;
}

div#contact dl.form textarea {
  height: 6em;
}

div#contact input[type="radio"],
div#contact input[type="checkbox"] {
  position: relative;
  top: 1px;
  margin: 0 4px 0 0;
}

div#contact ul.button {
  text-align: center;
}

div#contact ul.button li {
  margin: 0 0 10px;
}

div#contact ul.link li {
  margin: 0 10px 1em;
}

/* Pages: Use
----------------------------------------------- */
div#use > div.contents {
  margin: 20px 0 0;
}

div#use h1 {
  margin-bottom: 30px;
}

div#use h3 {
  position: relative;
  margin: 0 5px 5px;
  border-bottom: 1px #466f9f solid;
}

div#use h3::before {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  margin: 0 5px 0 0;
  border-bottom: 5px transparent solid;
  border-top: 5px transparent solid;
  border-left: 7px #466f9f solid;
}

div#use p.text {
  margin: 0 5px 30px 10px;
}

div#use ul.notes {
  margin: 0 15px 30px;
  font-size: 1.3rem;
}

div#use p.text + ul.notes {
  margin-top: -20px;
}

div#use ul.icon {
  margin-top: -20px;
}

div#use ul.icon li {
  margin: 0 10px 10px;
  text-align: center;
}

/* Pages: Cookie
----------------------------------------------- */
div#cookie > div.contents {
  margin: 20px 0 0;
}

div#cookie h1 {
  margin-bottom: 30px;
}

div#cookie h2.separation {
  margin-top: 2em;
  padding-top: 1em;
  border-top: 2px #466f9f solid;
}

div#cookie p.text {
  margin: 0 5px 30px 10px;
  word-break: break-all;
}

/* Pages: News
----------------------------------------------- */
div#news h1 {
  margin: 0 0 20px;
}

 div#news > div.contents {
  padding: 20px 0 0;
}

div#news > div.contents dl.news {
  margin: 0 10px;
}

div#news > div.contents dt[id] {
  margin: -155px 0 0;
  padding: 155px 0 0;
}

div#news > div.contents dl.news dd.title {
  position: relative;
  margin: 0 0 10px;
  padding: 0 0 2px 12px;
  border-bottom: 1px #466f9f dotted;
}

div#news > div.contents dl.news dd.title::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  width: 0;
  height: 0;
  margin: -4px 0 0;
  border-bottom: 5px transparent solid;
  border-top: 5px transparent solid;
  border-left: 7px #1e1e24 solid;
}

div#news > div.contents dl.news dd.details {
  margin: 0 0 20px;
  border-bottom: 1px #466f9f solid;
}