@charset "UTF-8";
/* Josh's Custom CSS Reset
   https://www.joshwcomeau.com/css/custom-css-reset/
*/
@import "./page-a.css";
@import "./page-k.css";
*, *::before, *::after {
  box-sizing: border-box;
}

*:not(dialog) {
  margin: 0;
}

/*@media (prefers-reduced-motion: no-preference) {
  html {
    interpolate-size: allow-keywords;
  }
}
html.is-fixed {
  height: 100%;
  overflow: hidden;
}
*/
body {
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
}

input, button, textarea, select {
  font: inherit;
}

p, h1, h2, h3, h4, h5, h6 {
  overflow-wrap: break-word;
}

p {
  text-wrap: pretty;
}

/*h1, h2, h3, h4, h5, h6 {
  text-wrap: balance;
}*/
#root, #__next {
  isolation: isolate;
}

ul {
  list-style: none;
  padding: 0;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

dl {
  margin-block-start: 0;
  margin-block-end: 0;
}

a {
  text-decoration: none;
}

@font-face {
  font-family: "YakuHanJPs";
  font-style: normal;
  font-weight: 700;
  src: url("../font/YakuHanJPs-Bold.woff2") format("woff2");
}
@font-face {
  font-family: "YakuHanJPs";
  font-style: normal;
  font-weight: 400;
  src: url("../font/YakuHanJPs-Regular.woff2") format("woff2");
}
@font-face {
  font-family: "YakuHanJPs";
  font-style: normal;
  font-weight: 500;
  src: url("../font/YakuHanJPs-Medium.woff2") format("woff2");
}
@font-face {
  font-family: "YakuHanJPs";
  font-style: normal;
  font-weight: 300;
  src: url("../font/YakuHanJPs-Light.woff2") format("woff2");
}
.pc {
  display: block !important;
}

@media screen and (max-width: 767px) {
  .pc {
    display: none !important;
  }
}
.sp {
  display: none !important;
}

@media screen and (max-width: 767px) {
  .sp {
    display: block !important;
  }
}
.pc-inline {
  display: inline-block !important;
}

@media screen and (max-width: 767px) {
  .pc-inline {
    display: none !important;
  }
}
.sp-inline {
  display: none !important;
}

@media screen and (max-width: 767px) {
  .sp-inline {
    display: inline-block !important;
  }
}
.c-scrolltop {
  display: block;
  position: fixed;
  right: 40px;
  bottom: 40px;
  width: 50px;
  height: 5px;
  cursor: pointer;
  opacity: 0;
  background: url(../img/common/scroll-btn.svg) center center/100% 100% no-repeat;
}
html {
  scroll-padding-top: 120px;
}
@media screen and (max-width: 767px) {
  .c-scrolltop {
    right: 10px;
    bottom: 15px;
    width: 36px;
    height: 36px;
  }
  html {
  scroll-padding-top: 40px;
}
}

/*/////////////// COMMON /////////////////////////////*/
body {
  font-family: "YakuHanJPs", "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  line-height: 1;
  font-size: 16px;
  box-sizing: border-box;
}

/*///////////////////// HEADER /////////////////////////////*/
.c-header {
  width: 100%;
  padding: 0 0 0 20px;
  border-bottom: 6px solid #00AEBB;
  position: fixed;
  top: 0;
  left: 0;
  background-color: #FFF;
  z-index: 10;
}

@media screen and (max-width: 767px) {
  .c-header {
    padding: 0 0 0 10px;
  }
}
@media screen and (max-width: 767px) {
  .c-header .c-header_menu {
    width: 24px;
    position: fixed;
    top: 5px;
    right: 10px;
  }
  .c-header .c-header_menu span {
    display: block;
    border-bottom: 3px solid #00AEBB;
    margin-top: 6px;
  }
  .c-header .c-header_menu.active span:first-of-type {
    transform: rotate(45deg);
    position: relative;
    top: 10px;
  }
  .c-header .c-header_menu.active span:nth-of-type(2) {
    display: none;
  }
  .c-header .c-header_menu.active span:last-of-type {
    transform: rotate(-45deg);
    position: relative;
    bottom: 0px;
  }
}
.c-header .l-container {
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 980px) {
  .c-header .l-container {
    align-items: center;
  }
}
.c-header .l-container .cabistaBlock {
  max-width: 300px;
}

@media screen and (max-width: 980px) {
  .c-header .l-container .cabistaBlock {
    max-width: 250px;
  }
}
@media screen and (max-width: 868px) {
  .c-header .l-container .cabistaBlock {
    max-width: 220px;
  }
}
.c-header .l-container .cabistaBlock .cabista_logo {
  display: flex;
  align-items: center;
  padding: 10px 0 5px;
}

.c-header .l-container .cabistaBlock .cabista_logo .logo {
  margin-right: 15px;
}

@media screen and (max-width: 767px) {
  .c-header .l-container .cabistaBlock .cabista_logo .logo {
    width: 100px;
  }
}
@media screen and (max-width: 767px) {
  .c-header .l-container .cabistaBlock .cabista_logo figure:nth-of-type(2) {
    display: none;
  }
}
.c-header .l-container .nittoBlock {
  display: flex;
}

@media screen and (max-width: 868px) {
  .c-header .l-container .nittoBlock {
    justify-content: end;
  }
}
@media screen and (max-width: 767px) {
  .c-header .l-container .nittoBlock {
    display: block;
    width: calc(100% - 100px);
  }
}
.c-header .l-container .nittoBlock .naviArea {
  width: 520px;
}

@media screen and (max-width: 980px) {
  .c-header .l-container .nittoBlock .naviArea {
    width: 480px;
  }
}
@media screen and (max-width: 868px) {
  .c-header .l-container .nittoBlock .naviArea {
    width: 398px;
  }
}
@media screen and (max-width: 767px) {
  .c-header .l-container .nittoBlock .naviArea {
    width: 100%;
  }
}
.c-header .l-container .nittoBlock .naviArea .blockTop {
  display: flex;
  align-items: end;
  margin: 10px 0;
}

@media screen and (max-width: 767px) {
  .c-header .l-container .nittoBlock .naviArea .blockTop {
    display: block;
    text-align: right;
    width: -moz-fit-content;
    width: fit-content;
  }
}
.c-header .l-container .nittoBlock .naviArea .blockTop figure {
  margin-right: 45px;
}

@media screen and (max-width: 980px) {
  .c-header .l-container .nittoBlock .naviArea .blockTop figure {
    margin-right: 30px;
    width: 150px;
  }
}
@media screen and (max-width: 868px) {
  .c-header .l-container .nittoBlock .naviArea .blockTop figure {
    margin-right: 20px;
    width: 130px;
  }
}
@media screen and (max-width: 767px) {
  .c-header .l-container .nittoBlock .naviArea .blockTop figure {
    width: 120px;
    margin-right: 50px;
  }
}
.c-header .l-container .nittoBlock .naviArea .blockTop .top_navi {
  display: flex;
}

@media screen and (max-width: 767px) {
  .c-header .l-container .nittoBlock .naviArea .blockTop .top_navi {
    display: none;
  }
}
.c-header .l-container .nittoBlock .naviArea .blockTop .top_navi li {
  margin-right: 20px;
  font-size: 14px;
}

@media screen and (max-width: 980px) {
  .c-header .l-container .nittoBlock .naviArea .blockTop .top_navi li {
    margin-right: 16px;
    font-size: 13px;
  }
}
@media screen and (max-width: 868px) {
  .c-header .l-container .nittoBlock .naviArea .blockTop .top_navi li {
    margin-right: 14px;
    font-size: 12px;
  }
}
.c-header .l-container .nittoBlock .naviArea .blockTop .top_navi li:last-of-type {
  margin-right: 0;
}

.c-header .l-container .nittoBlock .naviArea .blockTop .top_navi li a {
  color: #000;
}

.c-header .l-container .nittoBlock .naviArea .blockTop .top_navi li a:hover {
  text-decoration: underline;
}

.c-header .l-container .nittoBlock .naviArea .bottom_navi {
  display: flex;
  width: 520px;
}

@media screen and (max-width: 980px) {
  .c-header .l-container .nittoBlock .naviArea .bottom_navi {
    width: 480px;
  }
}
@media screen and (max-width: 868px) {
  .c-header .l-container .nittoBlock .naviArea .bottom_navi {
    width: 440px;
  }
}
@media screen and (max-width: 767px) {
  .c-header .l-container .nittoBlock .naviArea .bottom_navi {
    display: none;
  }
}
.c-header .l-container .nittoBlock .naviArea .bottom_navi li {
  width: 24%;
  text-align: center;
}

@media screen and (max-width: 868px) {
  .c-header .l-container .nittoBlock .naviArea .bottom_navi li {
    width: auto;
  }
}
.c-header .l-container .nittoBlock .naviArea .bottom_navi li a {
  display: block;
  font-size: 13px;
  border-left: 1px solid #00AEBB;
  border-top: 1px solid #00AEBB;
  background-color: #E6F7F8;
  padding: 10px 5px;
  font-weight: 700;
  color: #00AEBB;
}

@media screen and (max-width: 868px) {
  .c-header .l-container .nittoBlock .naviArea .bottom_navi li a {
    font-size: 11px;
  }
}
.c-header .l-container .nittoBlock .naviArea .bottom_navi li a:hover {
  opacity: 0.7;
}

.c-header .l-container .nittoBlock .naviArea .bottom_navi li a.laser {
  border-left: 1px solid #1A96D5;
  border-top: 1px solid #1A96D5;
  color: #1A96D5;
  background-color: #E8F5FB;
}

.c-header .l-container .nittoBlock .naviArea .bottom_navi li a.manning {
  border-left: 1px solid #3F82DE;
  border-top: 1px solid #3F82DE;
  color: #3F82DE;
  background-color: #EBF2FC;
}

.c-header .l-container .nittoBlock .naviArea .bottom_navi li:first-of-type a {
  background-color: #FFF;
}

.c-header .l-container .nittoBlock .naviArea .bottom_navi li:nth-of-type(2) {
  width: 28%;
}

.c-header .l-container .nittoBlock .naviArea .bottom_navi li:nth-of-type(2) a span {
  font-weight: 700;
  display: inline-block;
  transform: rotate(90deg);
  margin-left: 1em;
  font-size: 0.9em;
  position: relative;
  top: 4px;
}

.c-header .l-container .nittoBlock .naviArea .bottom_navi li .subMenu {
  visibility: hidden;
  position: absolute;
  top: 84px;
  left: 0;
  width: 100%;
  background-color: #fff;
  padding: 28px 0;
  transition: all 0.5s;
  opacity: 0;
  z-index: 999;
  box-shadow: 3px 3px 20px 0px rgba(0, 0, 0, 0.2);
}

.c-header .l-container .nittoBlock .naviArea .bottom_navi li .subMenu .subWrap {
  width: 680px;
  margin: 0 auto;
  display: flex;
  align-items: center;
}

.c-header .l-container .nittoBlock .naviArea .bottom_navi li .subMenu .subWrap .image {
  margin-right: 10px;
}

.c-header .l-container .nittoBlock .naviArea .bottom_navi li .subMenu .subWrap .topLink {
  text-align: left;
  line-height: 1.4;
  font-size: 14px;
  font-weight: 700;
  border-right: 1px solid #1A96D5;
  padding-right: 50px;
  display: inline-block;
}

.c-header .l-container .nittoBlock .naviArea .bottom_navi li .subMenu .subWrap .topLink a {
  color: #00AEBB;
  background-color: #FFF;
  border: 0px;
  display: inline-block;
  position: relative;
}

.c-header .l-container .nittoBlock .naviArea .bottom_navi li .subMenu .subWrap .topLink a:after {
  content: "";
  background-image: url(../img/common/header_arrow.svg);
  display: block;
  width: 24px;
  height: 24px;
  position: absolute;
  right: -30px;
  top: 16px;
}

.c-header .l-container .nittoBlock .naviArea .bottom_navi li .subMenu .subWrap .sub_sMenu {
  display: flex;
  width: 440px;
  padding-left: 20px;
}

.c-header .l-container .nittoBlock .naviArea .bottom_navi li .subMenu .subWrap .sub_sMenu li {
  width: 50%;
}

.c-header .l-container .nittoBlock .naviArea .bottom_navi li .subMenu .subWrap .sub_sMenu li a {
  background-color: #FFF;
  border: 0px;
  text-align: left;
  color: #000;
}

.c-header .l-container .nittoBlock .naviArea .bottom_navi li .subMenu .subWrap .sub_sMenu li a:before {
  content: url(../img/common/arrow_sub.svg);
  display: inline-block;
  margin-right: 0.5em;
}

.c-header .l-container .nittoBlock .naviArea .bottom_navi li .subMenu .subWrap .sub_sMenu li:last-of-type a {
  font-weight: 400;
}

.c-header .l-container .nittoBlock .contactArea {
  background: #00AEBB;
  background: linear-gradient(180deg, rgb(0, 174, 187) 0%, rgb(26, 150, 213) 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
  text-align: center;
}

@media screen and (max-width: 980px) {
  .c-header .l-container .nittoBlock .contactArea {
    padding: 0 6px;
    font-size: 14px;
  }
}
@media screen and (max-width: 767px) {
  .c-header .l-container .nittoBlock .contactArea {
    display: none;
  }
}
.c-header .l-container .nittoBlock .contactArea a {
  color: #FFF45E;
  font-size: 14px;
  line-height: 1.6;
  font-weight: 700;
}

.c-header .l-container .nittoBlock .contactArea a:hover {
  opacity: 0.6;
}

.c-header .l-container .nittoBlock .naviArea .bottom_navi li:nth-of-type(2):hover .subMenu {
  visibility: visible;
  opacity: 1;
}

.top_menu {
  display: flex;
  padding-right: 20px;
  border-right: 1px solid #00AEBB;
}

/*///////////////////// FOOTER /////////////////////////////*/
.btLogin {
  margin-top: 15px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .btLogin {
    display: block;
  }
}
.btLogin a {
  display: inline-block;
  padding: 25px 70px 25px 20px;
  border: 3px solid #00AEBB;
  border-radius: 50px;
  background-color: #FFF45E;
  font-size: 22px;
  font-weight: 700;
  transition: all 0.2s linear;
  color: #000;
  position: relative;
}

@media screen and (max-width: 767px) {
  .btLogin a {
    font-size: 16px;
    font-weight: 700;
    background-color: rgb(255, 244, 94);
    color: rgb(0, 0, 0);
    position: relative;
    letter-spacing: 0.1em;
    padding: 18px 50px 18px 25px;
    border-width: 2px;
    border-style: solid;
    border-color: rgb(0, 174, 187);
    -o-border-image: initial;
    border-image: initial;
    border-radius: 30px;
  }
}
.btLogin a small {
  font-size: 0.8em;
  font-weight: 500;
}

.btLogin a:after {
  position: absolute;
  top: calc(50% - 16px);
  right: 30px;
  content: "";
  background: url(../img/common/header_arrow.svg) center center/100% 100% no-repeat;
  width: 32px;
  height: 32px;
  display: block;
}

@media screen and (max-width: 767px) {
  .btLogin a:after {
    content: "";
    width: 24px;
    height: 24px;
    background: url(../img/index/index-arrow.svg) center center/100% 100% no-repeat;
    position: absolute;
    top: calc(50% - 12px);
    right: 20px;
  }
}
.btLogin a:hover {
  transform: scale(1.05, 1.05);
  background-color: #FFF;
}

.Block {
  text-align: center;
}

.Block .btTop_txt {
  margin-top: 100px;
  display: inline-block;
}

@media screen and (max-width: 767px) {
  .Block .btTop_txt {
    margin-top: 50px;
  }
}
.Block .btTop_txt::before {
  content: "＼";
  margin-right: 0.5em;
}

.Block .btTop_txt:after {
  content: "／";
  margin-left: 0.5em;
}

.c-footer {
  text-align: center;
}

.c-footer .footerMenuBlock {
  padding-top: 70px;
  border-top: 1px solid #00AEBB;
}

.c-footer .footerMenuBlock .MenuWrap {
  max-width: 1000px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 1298px) {
  .c-footer .footerMenuBlock .MenuWrap {
    max-width: 800px;
  }
}
@media screen and (max-width: 1098px) {
  .c-footer .footerMenuBlock .MenuWrap {
    max-width: 700px;
  }
}
@media screen and (max-width: 960px) {
  .c-footer .footerMenuBlock .MenuWrap {
    flex-wrap: wrap;
    justify-content: center;
  }
}
@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap {
    display: none;
    position: fixed;
    top: 52px;
    left: 0;
    background-color: #FFF;
    z-index: 10;
    height: calc(100vh - 52px);
    overflow: scroll;
    width: 100%;
    padding: 15px 0 30px;
    text-align: left;
    /*opacity: 0;*/
  }
  .c-footer .footerMenuBlock .MenuWrap.active {
    transition: opacity 0.5s ease-in-out;
    display: block;
    opacity: 1;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea {
  display: inline-block;
}

@media screen and (max-width: 960px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea:first-of-type {
    width: 40%;
  }
}
@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea:first-of-type {
    margin: 0 auto;
    width: 100%;
  }
}
@media screen and (max-width: 960px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea:nth-of-type(3) {
    width: 80%;
  }
}
@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea:nth-of-type(3) {
    margin: 0 auto;
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea {
    width: 100%;
    margin: 0 auto;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea .title {
  font-weight: 700;
  margin-bottom: 15px;
}

@media screen and (max-width: 996px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .title {
    font-size: 14px;
    text-align: left;
  }
}
@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .title {
    padding-left: 25px;
    text-align: left;
    position: relative;
    margin-bottom: 0;
    font-size: 15px;
  }
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .title:before {
    content: url(../img/common/arrow_SP_menuS.svg);
    position: relative;
    top: 4px;
    margin-right: 0.25em;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea .title:after {
  content: url(../img/smartorder/green-arrow.svg);
  margin-left: 8px;
  position: relative;
  top: 3px;
}

@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .title:after {
    display: none;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea .title .spMenu-p1 {
  display: none;
}

@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .title .spMenu-p1 {
    color: #000;
    font-size: 18px;
    position: absolute;
    right: 20px;
    top: calc(50% - 8px);
    display: block;
    width: 16px;
    height: 16px;
    font-style: normal;
  }
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .title .spMenu-p1 strong {
    display: none;
  }
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .title .spMenu-p1.close span {
    display: none;
  }
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .title .spMenu-p1.close strong {
    display: block;
    font-weight: 400;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea .title a {
  color: #00AEBB;
  transition: all 0.2s linear;
}

@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .title a {
    color: #000;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea .title a:hover {
  opacity: 0.6;
}

.c-footer .footerMenuBlock .MenuWrap .MenuArea .title_blue {
  color: #00AEBB;
  font-size: 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid #00AEBB;
  text-align: left;
}

@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .title_blue {
    display: none;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea .title_blue.blue2 {
  border-color: #1A96D5;
  color: #1A96D5;
}

@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .title_blue.blue2 {
    color: #FFF;
    margin-top: 20px;
    border-color: #FFF;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea h2 {
  position: relative;
}

.c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a {
  font-size: 15px;
  font-weight: 700;
  background-color: #E8F5FB;
  border: 2px solid #1A96D5;
  padding: 4px 22px 8px 12px;
  border-radius: 20px;
  margin-top: 12px;
  transition: all 0.2s linear;
  position: relative;
  display: block;
}

@media screen and (max-width: 996px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a {
    font-size: 14px;
  }
}
@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a {
    background-color: transparent;
    border: none;
    padding: 0;
    font-size: 15px;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a span {
  display: inline-block;
  color: #1A96D5;
}

.c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a span:after {
  position: relative;
  top: 4px;
  left: 10px;
  content: url(../img/smartorder/blue-arrow.svg);
}

@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a span:after {
    display: none;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a.green {
  background-color: #E6F7F8;
  border: 2px solid #00AEBB;
}

@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a.green {
    padding-left: 25px;
    text-align: left;
    position: relative;
    border-left: none;
    border-right: none;
    border-bottom: none;
    border-top: 1px solid #D9D9D9;
    background-color: transparent;
    border-radius: 0;
    padding-top: 10px;
    color: #00AEBB;
    font-weight: 700;
    display: block;
  }
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a.green:before {
    content: url(../img/common/arrow_SP_menuS.svg);
    position: relative;
    top: 4px;
    margin-right: 0.25em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a.green:before {
    top: 4px;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a.green span {
  color: #00AEBB;
  display: inline-block;
}

@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a.green span {
    font-size: 16px;
    color: #00AEBB;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a.green span:after {
  position: relative;
  top: 4px;
  left: 10px;
  content: url(../img/common/footarrow01.svg);
}

@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a.green span:after {
    display: none;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a.blue2 {
  background-color: #E8F5FB;
}

.c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a.blue2 span {
  color: #1A96D5;
}

.c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a.blue2 span:after {
  content: url(../img/common/footarrow02.svg);
}

.c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a.blue3 {
  background-color: #EBF2FC;
  border-color: #3F82DE;
}

@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a.blue3 {
    padding-left: 25px;
    text-align: left;
    position: relative;
    border-left: none;
    border-right: none;
    border-bottom: none;
    border-top: 1px solid #D9D9D9;
    background-color: transparent;
    border-radius: 0;
    padding-top: 10px;
    color: #00AEBB;
    font-weight: 700;
  }
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a.blue3:before {
    content: url(../img/common/arrow_SP_menuM.svg);
    position: relative;
    top: 4px;
    margin-right: 0.25em;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a.blue3 span {
  color: #3F82DE;
}

@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a.blue3 span {
    color: #3F82DE;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a.blue3 span:after {
  content: url(../img/common/footarrow03.svg);
}

@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a.blue3 span:after {
    display: none;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a:hover {
  opacity: 0.6;
}

@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a.laser-c {
    padding-left: 25px;
    text-align: left;
    position: relative;
    border-left: none;
    border-right: none;
    border-bottom: none;
    border-top: 1px solid #D9D9D9;
    background-color: transparent;
    border-radius: 0;
    padding-top: 10px;
    color: #00AEBB;
    font-weight: 700;
  }
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 a.laser-c:before {
    content: url(../img/common/arrow_SP_menuL.svg);
    position: relative;
    top: 4px;
    margin-right: 0.25em;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea h2 .spMenu-p2 {
  display: none;
}

@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 .spMenu-p2 {
    color: #000;
    font-size: 18px;
    position: absolute;
    right: 20px;
    top: calc(50% - 4px);
    display: block;
    width: 16px;
    height: 16px;
    font-style: normal;
  }
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 .spMenu-p2 strong {
    display: none;
  }
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 .spMenu-p2.close span {
    display: none;
  }
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 .spMenu-p2.close strong {
    display: block;
    font-weight: 400;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea h2 .spMenu-p3 {
  display: none;
}

@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 .spMenu-p3 {
    color: #000;
    font-size: 18px;
    position: absolute;
    right: 20px;
    top: calc(50% - 4px);
    display: block;
    width: 16px;
    height: 16px;
    font-style: normal;
    z-index: 1;
  }
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 .spMenu-p3 strong {
    display: none;
  }
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 .spMenu-p3.close span {
    display: none;
  }
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 .spMenu-p3.close strong {
    display: block;
    font-weight: 400;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea h2 .spMenu-p4 {
  display: none;
}

@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 .spMenu-p4 {
    color: #000;
    font-size: 18px;
    position: absolute;
    right: 20px;
    top: calc(50% - 8px);
    display: block;
    width: 16px;
    height: 16px;
    font-style: normal;
  }
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 .spMenu-p4 strong {
    display: none;
  }
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 .spMenu-p4.close span {
    display: none;
  }
  .c-footer .footerMenuBlock .MenuWrap .MenuArea h2 .spMenu-p4.close strong {
    display: block;
    font-weight: 400;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenuWrap {
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 1298px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenuWrap {
    display: block;
  }
}
@media screen and (max-width: 960px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenuWrap {
    display: flex;
  }
}
@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenuWrap {
    display: block;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea .inWrap:last-of-type {
  margin-left: 20px;
}

@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .inWrap:last-of-type {
    margin-left: 0;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenu {
  margin-top: 5px;
  text-align: left;
}

@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenu {
    padding: 0 20px;
    display: none;
  }
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenu.in {
    display: block;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenu li {
  margin-top: 10px;
  font-size: 14px;
}

@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenu li {
    color: #000;
    box-sizing: border-box;
    padding-left: 28px;
  }
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenu li:before {
    content: ">";
    margin-right: 0.5em;
    font-size: 0.9em;
    position: relative;
    color: #00AEBB;
    top: 0;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenu li a {
  color: #000;
  line-height: 1.4;
}

@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenu li a {
    color: #000;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenu li a:hover {
  text-decoration: underline;
}

@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenu li.bold {
    padding-left: 28px;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenu li.bold a {
  font-weight: 700;
  color: #00AEBB;
}

@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenu li.bold a {
    color: #00AEBB;
  }
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenu li.bold a:before {
    content: ">";
    margin-right: 0.5em;
    font-size: 0.9em;
    position: relative;
    color: #00AEBB;
    font-weight: 400;
    top: 0;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenu li.bold:before {
  color: #00AEBB;
}

@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenu li.bold:before {
    color: #FFF;
    font-weight: 400;
    display: none;
  }
}
@media screen and (max-width: 960px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenu.deopen {
    margin-bottom: 30px;
  }
}
@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenu.deopen {
    margin-bottom: 0;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenu.open2 {
  margin-right: 1em;
}

@media screen and (max-width: 960px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenu.open2 {
    margin-right: 0;
    margin-bottom: 30px;
  }
}
@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenu.open2 {
    margin-bottom: 0;
  }
}
.c-footer .footerMenuBlock .MenuWrap .MenuArea .footerMenu.deopen {
  display: block;
}

@media screen and (max-width: 767px) {
  .c-footer .footerMenuBlock .MenuWrap .underMENU {
    margin-top: 10px;
    padding-top: 5px;
    border-top: 1px solid #D9D9D9;
  }
  .c-footer .footerMenuBlock .MenuWrap .underMENU .menu-U {
    margin-top: 10px;
    font-size: 14px;
    margin-left: 25px;
  }
  .c-footer .footerMenuBlock .MenuWrap .underMENU .menu-U:first-of-type {
    margin-top: 20px;
  }
  .c-footer .footerMenuBlock .MenuWrap .underMENU .menu-U a {
    color: #000;
  }
  .c-footer .footerMenuBlock .MenuWrap .underMENU .bt-login-SP {
    display: block;
    margin-top: 35px;
    text-align: center;
  }
  .c-footer .footerMenuBlock .MenuWrap .underMENU .bt-login-SP a {
    display: inline-block;
    padding: 18px 50px 18px 25px;
    font-size: 16px;
    font-weight: 700;
    background-color: #FFF45E;
    color: #000;
    border: 2px solid #00AEBB;
    position: relative;
    border-radius: 30px;
    letter-spacing: 0.1em;
    transition: all 0.2s linear;
  }
  .c-footer .footerMenuBlock .MenuWrap .underMENU .bt-login-SP a span {
    font-size: 0.9em;
  }
  .c-footer .footerMenuBlock .MenuWrap .underMENU .bt-login-SP a:after {
    content: "";
    width: 24px;
    height: 24px;
    background: url(../img/index/index-arrow.svg) center center/100% 100% no-repeat;
    position: absolute;
    top: calc(50% - 12px);
    right: 20px;
  }
  .c-footer .footerMenuBlock .MenuWrap .underMENU .footerMenu {
    display: block;
  }
}
@media screen and (max-width: 960px) {
  .c-footer .footerMenuBlock .MenuWrap {
    flex-wrap: wrap;
  }
}
.c-footer .footerContactBlock {
  margin-top: 55px;
}

@media screen and (max-width: 767px) {
  .c-footer .footerContactBlock {
    margin-top: 0;
  }
}
.c-footer .footerContactBlock .Btfaq a {
  display: inline-block;
  padding: 10px 50px 10px 15px;
  border-radius: 20px;
  background-color: #FF205F;
  border: 2px solid #FF205F;
  color: #FFF;
  text-align: left;
  letter-spacing: 0.1em;
  font-weight: 700;
  position: relative;
  transition: all 0.2s;
}

.c-footer .footerContactBlock .Btfaq a:after {
  content: "";
  width: 20px;
  height: 20px;
  background: url(../img/common/faq_arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  top: calc(50% - 10px);
  right: 15px;
}

.c-footer .footerContactBlock .Btfaq a:hover {
  background-color: #FFF;
  color: #FF205F;
}

.c-footer .footerContactBlock .footLogo {
  width: 240px;
  margin: 20px auto 0;
  display: block;
}

.c-footer .footerContactBlock .footLogo img {
  width: 100%;
  height: auto;
}

.c-footer .footerContactBlock .underWrap {
  margin: 30px 30px 0 30px;
  display: flex;
  justify-content: space-between;
}

.c-footer .footerContactBlock .underWrap .footCabista {
  font-size: 14px;
  color: #00AEBB;
  text-align: left;
}

.c-footer .footerContactBlock .underWrap .footCabista span {
  font-size: 16px;
  margin-left: 1em;
  font-weight: 700;
}

@media screen and (max-width: 767px) {
  .c-footer .footerContactBlock .underWrap {
    justify-content: center;
  }
  .c-footer .footerContactBlock .underWrap .footCabista span {
    margin-left: 0;
    display: block;
    margin-top: 8px;
  }
  .c-footer .footerContactBlock .underWrap .footCabista {
    text-align: center;
  }
}
.c-footer .footerContactBlock .underWrap .underLink {
  display: flex;
  width: 310px;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .c-footer .footerContactBlock .underWrap .underLink {
    display: none;
  }
}
.c-footer .footerContactBlock .underWrap .underLink li {
  display: inline-block;
}

.c-footer .footerContactBlock .underWrap .underLink li a {
  font-size: 14px;
  color: #4C4948;
  display: block;
}

.c-footer .footerContactBlock .underWrap .underLink li a:hover {
  opacity: 0.8;
  text-decoration: underline;
}

.c-footer .c-footer__copyright {
  margin-top: 30px;
  color: #FFF;
  background-color: #00AEBB;
  font-size: 12px;
  padding: 25px 0;
}

.order-placement-note {
  font-size: 20px;
  font-weight: 700;
  text-align: center;
  color: #FF205F;
  margin-top: 55px;
}

.s-note {
  margin-top: 15px;
  text-align: center;
  font-weight: 500;
}

.confirmation-note {
  margin-top: 40px;
  font-weight: 700;
  size: 14px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .confirmation-note {
    line-height: 1.6;
  }
}
.regarding-orderBtn {
  text-align: center;
}

.regarding-orderBtn a {
  font-size: 16px;
  font-weight: 700;
  display: inline-block;
  padding: 10px 45px 10px 15px;
  border: 2px solid #00AEBB;
  border-radius: 10px;
  margin-top: 20px;
  color: #00AEBB;
  position: relative;
  transition: all 0.2s linear;
}

.regarding-orderBtn a:after {
  content: "";
  width: 24px;
  height: 24px;
  background: url(../img/index/Pricing-Structure-arrow01.svg) center center/100% 100% no-repeat;
  position: absolute;
  top: calc(50% - 12px);
  right: 15px;
}

.regarding-orderBtn a:hover {
  opacity: 0.6;
}

/*///////////////////// CONTENTS /////////////////////////////*/
main {
  padding-bottom: 100px;
  margin-top: 84px;
}

@media screen and (max-width: 868px) {
  main {
    margin-top: 78px;
  }
}
@media screen and (max-width: 767px) {
  main {
    margin-top: 46px;
  }
}
main .productTitle {
  background-color: #00AEBB;
  padding: 10px 20px;
}

main .productTitle p {
  font-size: 14px;
  font-weight: 700;
  color: #FFF;
  display: inline-block;
  position: relative;
}

main .in_wrap {
  max-width: 1140px;
  margin: 0 auto;
}

@media screen and (max-width: 1180px) {
  main .in_wrap {
    margin: 0 20px;
  }
}
main .in_wrap.fl-box {
  display: flex;
  align-items: center;
}

main .productsTitleArea {
  margin-top: 1px;
  background-color: #00AEBB;
  padding: 50px 0 20px;
}

@media screen and (max-width: 767px) {
  main .productsTitleArea {
    padding: 20px 0;
  }
}
main .productsTitleArea h1 {
  font-size: 32px;
  font-weight: 700;
  color: #FFF;
}

@media screen and (max-width: 767px) {
  main .productsTitleArea h1 {
    font-size: 28px;
    line-height: 1.5;
  }
}
main .breadcrumbs {
  margin-top: 15px;
  font-size: 12px;
}

@media screen and (max-width: 1240px) {
  main .breadcrumbs {
    padding: 0 20px;
  }
}
@media screen and (max-width: 767px) {
  main .breadcrumbs {
    line-height: 1.4 !important;
    font-size: 11px !important;
  }
}
main .breadcrumbs span {
  margin: 0 0.5em;
  font-size: 0.8em;
}

main .breadcrumbs a {
  color: #00AEBB;
}

main .hidden {
  display: none;
}

/* ////////////////////////////// INDEX ////////////////////////////*/
.index {
  /*overflow-y: hidden;*/
  position: relative;
}

.index .vertical-ruler {
  width: 32px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  pointer-events: none;
}

@media screen and (max-width: 767px) {
  .index .vertical-ruler {
    display: none;
  }
}
.index .diagonally-ruler {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

@media screen and (max-width: 767px) {
  .index .diagonally-ruler {
    width: 60%;
  }
}
.index .diagonally-ruler figure {
  pointer-events: none;
}

.index .diagonally-ruler .textBlock {
  position: absolute;
  top: 80px;
  left: 60px;
}

@media screen and (max-width: 767px) {
  .index .diagonally-ruler .textBlock {
    top: 168px;
    left: 0;
    width: 165%;
  }
}
.index .diagonally-ruler .textBlock h1 {
  font-size: 40px;
  line-height: 1.6;
  color: #FFF;
  font-weight: 900;
  letter-spacing: 0.025em;
}

@media screen and (max-width: 767px) {
  .index .diagonally-ruler .textBlock h1 {
    font-size: 32px;
    margin-left: 30px;
    text-shadow: 0px 2px 30px rgba(0, 0, 0, 0.4);
    letter-spacing: 0;
    white-space: nowrap;
  }
}
.index .diagonally-ruler .textBlock .bt-login {
  margin-top: 30px;
}

.index .diagonally-ruler .textBlock .bt-login a {
  display: inline-block;
  padding: 20px 60px 20px 30px;
  font-size: 16px;
  font-weight: 700;
  background-color: #FFF45E;
  color: #000;
  border: 2px solid #00AEBB;
  position: relative;
  border-radius: 30px;
  letter-spacing: 0.1em;
  transition: all 0.2s linear;
}

.index .diagonally-ruler .textBlock .bt-login a:after {
  content: "";
  width: 24px;
  height: 24px;
  background: url(../img/index/index-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  top: calc(50% - 12px);
  right: 20px;
}

.index .diagonally-ruler .textBlock .bt-login a:hover {
  transform: scale(1.05, 1.05);
  background-color: #FFF;
}

.index .diagonally-ruler .textBlock .bt-login a span {
  font-size: 0.9em;
}

@media screen and (max-width: 767px) {
  .index .diagonally-ruler .textBlock .bt-login {
    display: none;
  }
}
.index .diagonally-ruler .textBlock .bt-login-SP {
  display: none;
}

@media screen and (max-width: 767px) {
  .index .diagonally-ruler .textBlock .bt-login-SP {
    display: block;
    margin-top: 20px;
    text-align: center;
    width: 100%;
  }
  .index .diagonally-ruler .textBlock .bt-login-SP a {
    display: inline-block;
    padding: 18px 50px 18px 25px;
    font-size: 16px;
    font-weight: 700;
    background-color: #FFF45E;
    color: #000;
    border: 2px solid #00AEBB;
    position: relative;
    border-radius: 30px;
    letter-spacing: 0.1em;
    transition: all 0.2s linear;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .index .diagonally-ruler .textBlock .bt-login-SP a {
    margin: 0 auto;
  }
}
@media screen and (max-width: 767px) {
  .index .diagonally-ruler .textBlock .bt-login-SP a:after {
    content: "";
    width: 24px;
    height: 24px;
    background: url(../img/index/index-arrow.svg) center center/100% 100% no-repeat;
    position: absolute;
    top: calc(50% - 12px);
    right: 20px;
  }
  .index .diagonally-ruler .textBlock .bt-login-SP a:hover {
    opacity: 0.6;
  }
  .index .diagonally-ruler .textBlock .bt-login-SP a span {
    font-size: 0.9em;
  }
}
.index .diagonally-ruler .textBlock dl {
  display: flex;
  margin-top: 65px;
}

@media screen and (max-width: 767px) {
  .index .diagonally-ruler .textBlock dl {
    display: block;
    text-align: center;
    width: 100%;
    margin: 60px auto 0;
  }
}
.index .diagonally-ruler .textBlock dl dt {
  display: inline-block;
}

.index .diagonally-ruler .textBlock dl dt p {
  font-size: 18px;
  background-color: #1D1D1D;
  color: #FFF;
  font-weight: 700;
  padding: 10px 20px;
}

.index .diagonally-ruler .textBlock dl dd {
  margin-left: 15px;
  display: inline-block;
  width: 150px;
}

@media screen and (max-width: 767px) {
  .index .diagonally-ruler .textBlock dl dd {
    margin: 15px auto 0;
    width: 220px;
  }
}
.index .MainVisual {
  height: 600px;
  background-color: rgba(0, 0, 0, 0.3);
  position: relative;
}

.index .MainVisual video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
}

@media screen and (max-width: 767px) {
  .index .MainVisual video {
    height: 400px;
  }
}
.index .MainVisual .SP-img {
  display: none;
}

@media screen and (max-width: 767px) {
  .index .MainVisual .SP-img {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    display: block;
  }
  .index .MainVisual .SP-img img {
    width: 100%;
    height: auto;
  }
}
.index .index-menu {
  border-bottom: 1px solid #00AEBB;
  border-top: 1px solid #00AEBB;
  display: flex;
  justify-content: center;
  position: sticky;
  top: 83px;
  z-index: 8;
}

@media screen and (max-width: 868px) {
  .index .index-menu {
    top: 76px;
  }
}
@media screen and (max-width: 767px) {
  .index .index-menu {
    display: none;
  }
}
.index .index-menu li {
  display: inline-block;
  margin: 0;
  border-left: 1px solid #00AEBB;
  background-color: #FFF;
}

.index .index-menu li a {
  color: #00AEBB;
  font-weight: 700;
  padding: 10px 20px;
  display: block;
  transition: all 0.2s linear;
}

@media screen and (max-width: 878px) {
  .index .index-menu li a {
    padding: 10px 10px;
    font-size: 15px;
  }
}
.index .index-menu li a:after {
  position: relative;
  margin-left: 20px;
  content: url(../img/index/index-menu-arrow.svg);
}

.index .index-menu li a:hover {
  background-color: #f4fafb;
}

.index .index-menu li:last-of-type {
  border-right: 1px solid #00AEBB;
}

.index .index-menu li:last-of-type a:after {
  content: url(../img/index/index-menu-arrow-up.svg);
}

.index h2.mainTxt {
  text-align: center;
  font-size: 32px;
  font-weight: 400;
  background: linear-gradient(90deg, rgb(0, 174, 187) 0%, rgb(26, 150, 213) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-top: 60px;
}

@media screen and (max-width: 1028px) {
  .index h2.mainTxt {
    font-size: 3vw;
  }
}
@media screen and (max-width: 767px) {
  .index h2.mainTxt {
    font-size: 24px;
    line-height: 1.6;
    margin-top: 45px;
  }
}
.index h2.mainTxt span {
  margin: 0 15px;
  -webkit-background-clip: text;
  background-color: #99DFE4;
  font-size: 0.6em;
  position: relative;
  bottom: 4px;
}

@media screen and (max-width: 767px) {
  .index h2.mainTxt span {
    margin: 0 8px;
  }
}
.index .available-courses {
  margin-top: 90px;
  text-align: center;
}

@media screen and (max-width: 980px) {
  .index .available-courses {
    padding: 0 20px;
  }
}
@media screen and (max-width: 767px) {
  .index .available-courses {
    margin-top: 60px;
    padding: 0;
  }
}
.index .available-courses h3 {
  font-size: 22px;
  font-weight: 500;
}

.index .available-courses .txt {
  margin-top: 15px;
}

@media screen and (max-width: 970px) {
  .index .available-courses .txt {
    line-height: 1.6;
    margin-left: 1em;
  }
}
@media screen and (max-width: 767px) {
  .index .available-courses .txt {
    padding: 0 20px;
    line-height: 1.6;
    text-align: left;
    margin-left: 0;
  }
}
.index .available-courses .courses-list {
  max-width: 1000px;
  margin: 60px auto 0;
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .index .available-courses .courses-list {
    display: block;
    padding: 0 20px;
  }
}
.index .available-courses .courses-list .left {
  width: 48%;
}

@media screen and (max-width: 960px) {
  .index .available-courses .courses-list .left {
    width: 40%;
  }
}
@media screen and (max-width: 767px) {
  .index .available-courses .courses-list .left {
    width: 100%;
  }
}
.index .available-courses .courses-list .right {
  width: 50%;
}

@media screen and (max-width: 960px) {
  .index .available-courses .courses-list .right {
    width: 58%;
  }
}
@media screen and (max-width: 767px) {
  .index .available-courses .courses-list .right {
    width: 100%;
    margin-top: 50px;
  }
}
.index .available-courses .courses-list .list-wrap {
  padding: 0 15px;
}

@media screen and (max-width: 960px) {
  .index .available-courses .courses-list .list-wrap {
    padding: 0 5px;
  }
}
@media screen and (max-width: 767px) {
  .index .available-courses .courses-list .list-wrap {
    padding: 0;
  }
}
.index .available-courses .courses-list .list-wrap li {
  padding: 16px 0 16px 50px;
  width: 100%;
  font-size: 22px;
  font-weight: 700;
  background-color: #E6F7F8;
  position: relative;
  border-radius: 40px;
  text-align: left;
}

@media screen and (max-width: 980px) {
  .index .available-courses .courses-list .list-wrap li {
    padding: 16px 0 16px 20px;
    font-size: 1.8vw;
  }
}
@media screen and (max-width: 767px) {
  .index .available-courses .courses-list .list-wrap li {
    padding: 12px 0 12px 20px;
    font-size: 17px;
  }
}
.index .available-courses .courses-list .list-wrap li:after {
  content: "";
  width: 26px;
  height: 15px;
  background: url(../img/index/tr-arrow01.svg) center center/100% 100% no-repeat;
  position: absolute;
  bottom: -13px;
  left: calc(50% - 13px);
}

.index .available-courses .courses-list .list-wrap li.last {
  background-color: #D1EAF7;
}

.index .available-courses .courses-list .list-wrap li.last:after {
  background: url(../img/index/tr-arrow02.svg) center center/100% 100% no-repeat;
}

.index .available-courses .courses-list .list-wrap li .illust01 {
  position: absolute;
  right: 15px;
  bottom: -12px;
}

@media screen and (max-width: 960px) {
  .index .available-courses .courses-list .list-wrap li .illust01 {
    width: 90px;
  }
}
@media screen and (max-width: 767px) {
  .index .available-courses .courses-list .list-wrap li .illust01 {
    width: 98px;
    right: 5px;
  }
}
.index .available-courses .courses-list .list-wrap li .illust02 {
  position: absolute;
  right: 40px;
  bottom: -5px;
}

@media screen and (max-width: 960px) {
  .index .available-courses .courses-list .list-wrap li .illust02 {
    width: 100px;
  }
}
@media screen and (max-width: 767px) {
  .index .available-courses .courses-list .list-wrap li .illust02 {
    width: 124px;
    right: 20px;
  }
}
.index .available-courses .order {
  margin-top: 30px;
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .index .available-courses .order {
    margin-top: 15px;
  }
}
.index .available-courses .order li {
  width: 100%;
  border: 2px solid #1D1D1D;
  background-color: #1A96D5;
  color: #FFF;
  box-shadow: 6px 6px 0px 0px #cccccc;
  position: relative;
}

.index .available-courses .order li:after {
  position: absolute;
  content: "";
  width: 24px;
  height: 24px;
  background: url(../img/index/corse-arrow01.svg) center center/100% 100% no-repeat;
  bottom: 15px;
  right: 15px;
}

@media screen and (max-width: 767px) {
  .index .available-courses .order li:after {
    bottom: 8px;
    right: 8px;
    width: 18px;
    height: 18px;
  }
}
.index .available-courses .order li.one {
  width: 48%;
}

.index .available-courses .order li:last-of-type {
  background-color: #3F82DE;
}

.index .available-courses .order li:last-of-type:after {
  background: url(../img/index/corse-arrow03.svg) center center/100% 100% no-repeat;
}

.index .available-courses .order li:first-of-type:after {
  background: url(../img/index/corse-arrow02.svg) center center/100% 100% no-repeat;
}

.index .available-courses .order li.smart-color {
  background-color: #00AEBB;
}

.index .available-courses .order li.smart-color:after {
  background: url(../img/index/corse-arrow01.svg) center center/100% 100% no-repeat;
}

.index .available-courses .order li .titleBox {
  font-size: 15px;
  font-weight: 700;
  background-color: #1D1D1D;
  padding: 10px 0;
}

@media screen and (max-width: 826px) {
  .index .available-courses .order li .titleBox {
    font-size: 13px;
  }
}
@media screen and (max-width: 767px) {
  .index .available-courses .order li .titleBox {
    font-size: 14px;
    padding: 10px;
    line-height: 1.4;
    padding: 8px 0;
    height: 55px;
  }
  .index .available-courses .order li .titleBox.smt {
    padding-top: 18px;
  }
}
@media screen and (max-width: 767px) {
  .index .available-courses .order li.smart-color .titleBox {
    height: auto;
  }
}

.index .available-courses .order li .orderWrap {
  display: flex;
  align-items: center;
  flex-direction: column;
  padding: 20px 0;
}

.index .available-courses .order li .orderWrap h4 {
  font-size: 28px;
  line-height: 1.2;
  margin-bottom: 12px;
}

@media screen and (max-width: 767px) {
  .index .available-courses .order li .orderWrap h4 {
    font-size: 24px;
  }
}
.index .available-courses .order li .orderWrap .subwrap {
  display: inline-block;
  text-align: left;
}

.index .available-courses .order li .orderWrap .subwrap .order-sub {
  font-size: 15px;
  font-weight: 500;
  line-height: 1.8;
}

@media screen and (max-width: 767px) {
  .index .available-courses .order li .orderWrap .subwrap .order-sub {
    font-size: 13px;
    padding: 0 10px;
    margin-left: 1.25em;
    text-indent: -1.25em;
  }
}
.index .available-courses .order li .orderWrap .subwrap .order-sub .head-c {
  margin-right: 0.25em;
  opacity: 0.5;
}

.index .available-courses .order li .orderWrap .subwrap .order-sub .yellow {
  font-weight: 700;
  color: #FFF45E;
}

.index .available-courses .order li a {
  color: #FFF;
  transition: all 0.2s linear;
}

.index .available-courses .order li a:hover {
  opacity: 0.5;
}

.index .available-courses .btn-order {
  text-align: center;
  display: inline-block;
  border-radius: 10px;
  border: 2px solid #00AEBB;
  padding: 10px 60px 10px 20px;
  color: #00AEBB;
  font-weight: 700;
  margin-top: 30px;
  position: relative;
  transition: all 0.2s linear;
  cursor: pointer;
}

.index .available-courses .btn-order:after {
  position: absolute;
  content: "";
  width: 24px;
  height: 24px;
  display: block;
  background: url(../img/index/index-arrow.svg) center center/100% 100% no-repeat;
  top: calc(50% - 12px);
  right: 20px;
}

.index .available-courses .btn-order:hover {
  opacity: 0.6;
}

.index .information {
  padding: 35px 0;
  background-color: #F7F7F7;
  margin-top: 50px;
}

.index .information .information-wrap {
  max-width: 670px;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .index .information .information-wrap {
    padding: 0 20px;
  }
}
.index .information .information-wrap h3 {
  font-size: 22px;
  font-weight: 700;
}

@media screen and (max-width: 767px) {
  .index .information .information-wrap h3 {
    text-align: center;
  }
}
.index .information .information-wrap dl a {
  padding-top: 10px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

@media screen and (max-width: 767px) {
  .index .information .information-wrap dl a {
    display: block;
  }
}
.index .information .information-wrap dl a dt {
  width: 32%;
  font-size: 14px;
  color: #4C4948;
  margin-top: 15px;
}

@media screen and (max-width: 767px) {
  .index .information .information-wrap dl a dt {
    width: 100%;
    margin-top: 10px;
  }
}
.index .information .information-wrap dl a dt span {
  display: inline-block;
  padding: 5px;
  width: 100px;
  text-align: center;
  font-size: 12px;
  border: 1px solid #B6B6B6;
  color: #4C4948;
  margin-left: 10px;
  background-color: #FFF;
}

.index .information .information-wrap dl a dd {
  margin-top: 15px;
  font-size: 16px;
  width: 68%;
  color: #000;
}

@media screen and (max-width: 767px) {
  .index .information .information-wrap dl a dd {
    width: 100%;
    line-height: 1.7;
    margin-top: 10px;
  }
}
.index .information .information-wrap dl a:hover {
  opacity: 0.7;
  text-decoration: underline;
}

.index .information .information-wrap dl a:visited {
  color: #000;
}

.index .information .information-wrap .news-btn {
  margin-top: 30px;
  text-align: center;
}

.index .information .information-wrap .news-btn a {
  display: inline-block;
  font-size: 14px;
  font-weight: 700;
  color: #000;
  transition: all 0.2s linear;
}

.index .information .information-wrap .news-btn a:after {
  content: url(../img/index/news-arrow.svg);
  position: relative;
  margin-left: 0.5em;
  top: 5px;
}

.index .information .information-wrap .news-btn a:hover {
  opacity: 0.6;
  color: #000;
}

.index .whats-cabista {
  background-image: url(../img/index/lattice.png);
  padding: 80px 0;
  margin-top: 30px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .index .whats-cabista {
    padding: 80px 20px;
  }
}
.index .whats-cabista .whats-title-toptxt {
  width: 220px;
  margin: 0 auto;
}

.index .whats-cabista h2 {
  font-size: 40px;
  font-weight: 700;
  color: #00AEBB;
  margin-top: 20px;
}

@media screen and (max-width: 767px) {
  .index .whats-cabista h2 {
    font-size: 34px;
  }
}
.index .whats-cabista .whats-txt {
  max-width: 740px;
  margin: 40px auto 0;
  font-size: 16px;
  line-height: 1.7;
  text-align: left;
}

@media screen and (max-width: 820px) {
  .index .whats-cabista .whats-txt {
    max-width: 680px;
  }
}
.index .whats-cabista .whats-img {
  max-width: 660px;
  margin: 10px auto 0;
}

.index .whats-cabista .pageLink {
  max-width: 660px;
  margin: 50px auto 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .index .whats-cabista .pageLink {
    display: block;
  }
}
.index .whats-cabista .pageLink li {
  width: 48.5%;
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .index .whats-cabista .pageLink li {
    width: 100%;
    margin-bottom: 10px;
  }
}
.index .whats-cabista .pageLink li a {
  font-size: 18px;
  font-weight: 700;
  text-align: center;
  padding: 15px 15px 15px 0;
  border: 1px solid #00AEBB;
  border-radius: 8px;
  display: block;
  color: #000;
  transition: all 0.2s linear;
  background: url(../img/index/link-arrow-bottom.svg) right 20px center/13px 8px no-repeat #FFF;
}

.index .whats-cabista .pageLink li a span {
  color: #FF205F;
}

.index .whats-cabista .pageLink li a:hover {
  opacity: 0.6;
}

.index .Explanation {
  background: linear-gradient(90deg, rgb(0, 174, 187) 0%, rgb(26, 150, 213) 100%);
  padding: 90px 0;
}

@media screen and (max-width: 767px) {
  .index .Explanation {
    padding: 20px;
  }
}
.index .Explanation .whiteBlock {
  background-color: #FFF;
  max-width: 1080px;
  margin: 0 auto;
  padding: 90px 150px;
}

@media screen and (max-width: 767px) {
  .index .Explanation .whiteBlock {
    padding: 70px 20px;
  }
}
.index .Explanation .whiteBlock .title-top-img {
  width: 120px;
  margin: 0 auto;
}

.index .Explanation .whiteBlock h2 {
  font-size: 36px;
  font-weight: 900;
  margin-top: 25px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .index .Explanation .whiteBlock h2 {
    font-size: 34px;
    line-height: 1.4;
    letter-spacing: 0;
  }
}
.index .Explanation .whiteBlock h2 span {
  color: #FF205F;
  font-size: 1em;
  margin-left: 0;
  bottom: 0;
}

@media screen and (max-width: 767px) {
  .index .Explanation .whiteBlock h2 span {
    display: block;
  }
  .index .Explanation .whiteBlock h2 span.inline {
    display: inline;
  }
}
.index .Explanation .whiteBlock h2:after {
  content: "";
  width: 40px;
  height: 4px;
  display: block;
  background-color: #00AEBB;
  margin: 15px auto 0;
}

.index .Explanation .whiteBlock .wh-block-txt {
  text-align: center;
  line-height: 1.7;
  font-size: 15px;
  margin-top: 40px;
}

@media screen and (max-width: 767px) {
  .index .Explanation .whiteBlock .wh-block-txt {
    margin-top: 30px;
    text-align: left;
  }
}
.index .Explanation .whiteBlock h3 {
  color: #00AEBB;
  font-size: 24px;
  font-weight: 700;
  margin-top: 50px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .index .Explanation .whiteBlock h3 {
    line-height: 1.6;
  }
}
.index .Explanation .whiteBlock .wBlockimg01 {
  max-width: 680px;
  margin: 30px auto 0;
}

.index .Explanation .whiteBlock .wBlockimg02 {
  max-width: 680px;
  margin: 30px auto 0;
}

.index .Explanation .whiteBlock .pdf-dl-btn {
  margin-top: 20px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .index .Explanation .whiteBlock .pdf-dl-btn {
    text-align: center;
    line-height: 1.4;
    margin-right: 30px;
  }
  .index .Explanation .whiteBlock .pdf-dl-btn small {
    font-size: 0.85em;
    display: block;
  }
}
.index .Explanation .whiteBlock .pdf-dl-btn a {
  display: inline-block;
  transition: all 0.2s linear;
  color: #000;
  font-weight: 700;
  font-size: 14px;
  position: relative;
}

.index .Explanation .whiteBlock .pdf-dl-btn a span {
  display: inline-block;
  width: 20px;
  position: relative;
  left: 4px;
  top: 5px;
}

.index .Explanation .whiteBlock .pdf-dl-btn a:hover {
  opacity: 0.6;
}

.index .Explanation .whiteBlock .pdf-dl-btn a:after {
  content: "";
  width: 20px;
  height: 20px;
  background: url(../img/index/news-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  right: -30px;
  top: -2px;
}

@media screen and (max-width: 767px) {
  .index .Explanation .whiteBlock .pdf-dl-btn a:after {
    top: 5px;
  }
}
.index .Explanation .whiteBlock .pdf-dl-btn a.dl:after {
  top: 7px;
}

.index .Explanation .whiteBlock .wBlockNote {
  margin-top: 8px;
  font-size: 12px;
  line-height: 1.6;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .index .Explanation .whiteBlock .wBlockNote {
    text-align: left;
  }
}
.index .Explanation .whiteBlock .wBlockNote.mt {
  margin-top: 20px;
}

.index .Explanation .whiteBlock .cad-btn {
  margin-top: 40px;
  text-align: center;
}

.index .Explanation .whiteBlock .cad-btn a {
  padding: 25px 60px 32px 30px;
  background: linear-gradient(90deg, rgb(0, 174, 187) 0%, rgb(26, 150, 213) 100%);
  font-size: 18px;
  font-weight: 700;
  color: #FFF;
  display: inline-block;
  border-radius: 50px;
  position: relative;
  transition: all 0.2s linear;
}

@media screen and (max-width: 767px) {
  .index .Explanation .whiteBlock .cad-btn a {
    text-align: left;
    padding: 20px 60px 32px 22px;
  }
}
.index .Explanation .whiteBlock .cad-btn a em {
  color: #FFF45E;
  font-style: normal;
}

@media screen and (max-width: 767px) {
  .index .Explanation .whiteBlock .cad-btn a em {
    display: block;
    margin-bottom: 8px;
  }
}
.index .Explanation .whiteBlock .cad-btn a span {
  font-size: 10px;
  position: absolute;
  right: 60px;
  bottom: 15px;
}

.index .Explanation .whiteBlock .cad-btn a:after {
  content: "";
  width: 24px;
  height: 24px;
  background: url(../img/index/cad-arrow-bottom.svg) center center/100% 100% no-repeat;
  display: block;
  position: absolute;
  top: calc(50% - 12px);
  right: 25px;
}

@media screen and (max-width: 767px) {
  .index .Explanation .whiteBlock .cad-btn a:after {
    right: 20px;
  }
}
.index .Explanation .whiteBlock .cad-btn a:hover {
  opacity: 0.6;
}

.index .Explanation .Reasonable-price {
  border-top: 1px solid #00AEBB;
}

.index .Explanation .Reasonable-price .title-top-img {
  width: 90px;
}

.index .Explanation .Reasonable-price .Reasonable-price-list {
  display: flex;
  margin: 40px auto 0;
  justify-content: space-between;
  max-width: 600px;
}

@media screen and (max-width: 767px) {
  .index .Explanation .Reasonable-price .Reasonable-price-list {
    display: block;
  }
}
.index .Explanation .Reasonable-price .Reasonable-price-list li {
  width: 48.3%;
  text-align: center;
  line-height: 1.4;
}

@media screen and (max-width: 767px) {
  .index .Explanation .Reasonable-price .Reasonable-price-list li {
    width: 100%;
  }
}
.index .Explanation .Reasonable-price .Reasonable-price-list li span {
  color: #FFF45E;
  display: block;
}

@media screen and (max-width: 767px) {
  .index .Explanation .Reasonable-price .Reasonable-price-list li:nth-of-type(2) {
    margin-top: 25px;
  }
}
.index .Explanation .Reasonable-price .Reasonable-price-list li .fukidashi {
  font-size: 18px;
  font-weight: 700;
  color: #FFF;
  padding: 12px 10px;
  background-color: #00AEBB;
  border-radius: 10px;
  position: relative;
}

.index .Explanation .Reasonable-price .Reasonable-price-list li .fukidashi:after {
  content: "";
  position: absolute;
  left: calc(50% - 9px);
  bottom: -14px;
  width: 18px;
  height: 15px;
  background: url(../img/index/triangle01.svg) center center/100% 100% no-repeat;
}

.index .Explanation .Reasonable-price .Reasonable-price-list li figure {
  width: 113px;
  margin: 15px auto 0;
}

@media screen and (max-width: 767px) {
  .index .Explanation .Reasonable-price .Reasonable-price-list li figure {
    width: 130px;
  }
}
.index .Explanation .Reasonable-price .Reasonable-price-list li .alttxt {
  font-size: 15px;
  font-weight: 700;
  color: #00AEBB;
  margin-top: 10px;
}

.index .Explanation .Reasonable-price .Reasonable-price-list li:nth-of-type(2) .fukidashi {
  background-color: #1A96D5;
}

.index .Explanation .Reasonable-price .Reasonable-price-list li:nth-of-type(2) .fukidashi:after {
  background: url(../img/index/triangle02.svg) center center/100% 100% no-repeat;
}

.index .Explanation .Reasonable-price .Reasonable-price-list li:nth-of-type(2) figure {
  width: 139px;
  margin: 35px auto 0;
}

.index .Explanation .Reasonable-price .Reasonable-price-list li:nth-of-type(2) .alttxt {
  color: #1A96D5;
}

.index .Explanation .BlueArea {
  background-color: #E6F7F8;
  padding: 25px;
  margin: 35px auto 0;
  border-radius: 8px;
  max-width: 600px;
}

@media screen and (max-width: 767px) {
  .index .Explanation .BlueArea {
    padding: 20px;
  }
}
.index .Explanation .BlueArea h4 {
  text-align: center;
  font-size: 16px;
}

@media screen and (max-width: 767px) {
  .index .Explanation .BlueArea h4 {
    line-height: 1.4;
  }
}
.index .Explanation .BlueArea .Pricing-Structure {
  display: flex;
  justify-content: space-between;
  margin-top: 15px;
}

@media screen and (max-width: 767px) {
  .index .Explanation .BlueArea .Pricing-Structure {
    display: block;
  }
}
.index .Explanation .BlueArea .Pricing-Structure li {
  width: 31%;
}

@media screen and (max-width: 767px) {
  .index .Explanation .BlueArea .Pricing-Structure li {
    width: 100%;
  }
  .index .Explanation .BlueArea .Pricing-Structure li:nth-of-type(n + 2) {
    margin-top: 10px;
  }
}
.index .Explanation .BlueArea .Pricing-Structure li a {
  padding: 10px;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.2;
  border-radius: 8px;
  border: 2px solid #00AEBB;
  display: block;
  color: #00AEBB;
  position: relative;
  background-color: #FFF;
}

@media screen and (max-width: 890px) {
  .index .Explanation .BlueArea .Pricing-Structure li a {
    padding: 6px;
    font-size: 1.6vw;
  }
}
@media screen and (max-width: 767px) {
  .index .Explanation .BlueArea .Pricing-Structure li a {
    padding: 10px;
    font-size: 15px;
  }
}
.index .Explanation .BlueArea .Pricing-Structure li a:after {
  content: "";
  width: 24px;
  height: 24px;
  background: url(../img/index/Pricing-Structure-arrow01.svg) center center/100% 100% no-repeat;
  position: absolute;
  top: calc(50% - 12px);
  right: 6px;
}

@media screen and (max-width: 890px) {
  .index .Explanation .BlueArea .Pricing-Structure li a:after {
    width: 20px;
    height: 20px;
  }
}
@media screen and (max-width: 767px) {
  .index .Explanation .BlueArea .Pricing-Structure li a:after {
    width: 24px;
    height: 24px;
  }
}
.index .Explanation .BlueArea .Pricing-Structure li a.no2 {
  border: 2px solid #1A96D5;
  color: #1A96D5;
}

.index .Explanation .BlueArea .Pricing-Structure li a.no2:after {
  background: url(../img/index/Pricing-Structure-arrow02.svg) center center/100% 100% no-repeat;
}

.index .Explanation .BlueArea .Pricing-Structure li a.no3 {
  border: 2px solid #3F82DE;
  color: #3F82DE;
}

.index .Explanation .BlueArea .Pricing-Structure li a.no3:after {
  background: url(../img/index/Pricing-Structure-arrow03.svg) center center/100% 100% no-repeat;
}

.index .Explanation .BlueArea .Pricing-Structure li a:hover {
  opacity: 0.6;
}

@media screen and (max-width: 767px) {
  .index .Explanation .BlueArea .Pricing-Structure li span {
    margin-left: 0.5em;
  }
}
.index .Explanation .short-delivery-timeWrap {
  border-top: 1px solid #00AEBB;
}

.index .Explanation .short-delivery-timeWrap .short-delivery-time {
  max-width: 420px;
  display: flex;
  justify-content: space-between;
  margin: 40px auto 0;
}

@media screen and (max-width: 767px) {
  .index .Explanation .short-delivery-timeWrap .short-delivery-time {
    flex-wrap: wrap;
    justify-content: center;
  }
}
.index .Explanation .short-delivery-timeWrap .short-delivery-time li {
  width: 28.6%;
}

@media screen and (max-width: 767px) {
  .index .Explanation .short-delivery-timeWrap .short-delivery-time li {
    width: 48%;
    box-sizing: border-box;
  }
  .index .Explanation .short-delivery-timeWrap .short-delivery-time li:first-of-type {
    margin: 0 40px 20px;
  }
}
.index .Explanation .short-delivery-timeWrap .short-delivery-time li h5 {
  margin-top: 20px;
  font-weight: 700;
  font-size: 15px;
  text-align: center;
  color: #00AEBB;
  white-space: nowrap;
}

.index .Explanation .short-delivery-timeWrap .short-delivery-time li div {
  padding: 15px 10px;
  background-color: #00AEBB;
  text-align: center;
  border-radius: 10px;
  position: relative;
}

.index .Explanation .short-delivery-timeWrap .short-delivery-time li div p {
  color: #FFF;
  font-weight: 700;
}

.index .Explanation .short-delivery-timeWrap .short-delivery-time li div strong {
  font-size: 32px;
  font-weight: 700;
  color: #FFF45E;
  margin-top: 10px;
  display: block;
}

.index .Explanation .short-delivery-timeWrap .short-delivery-time li div strong small {
  font-size: 20px;
}

.index .Explanation .short-delivery-timeWrap .short-delivery-time li div:after {
  content: "";
  position: absolute;
  left: calc(50% - 9px);
  bottom: -14px;
  width: 18px;
  height: 15px;
  background: url(../img/index/triangle01.svg) center center/100% 100% no-repeat;
}

@media screen and (max-width: 767px) {
  .index .Explanation .short-delivery-timeWrap .short-delivery-time li.delivery-time02 {
    margin-right: 4%;
  }
}
.index .Explanation .short-delivery-timeWrap .short-delivery-time li.delivery-time02 div {
  background-color: #1A96D5;
}

.index .Explanation .short-delivery-timeWrap .short-delivery-time li.delivery-time02 div:after {
  background: url(../img/index/triangle02.svg) center center/100% 100% no-repeat;
}

.index .Explanation .short-delivery-timeWrap .short-delivery-time li.delivery-time02 h5 {
  color: #1A96D5;
}

.index .Explanation .short-delivery-timeWrap .short-delivery-time li.delivery-time03 div {
  background-color: #3F82DE;
}

.index .Explanation .short-delivery-timeWrap .short-delivery-time li.delivery-time03 div:after {
  background: url(../img/index/triangle03.svg) center center/100% 100% no-repeat;
}

.index .Explanation .short-delivery-timeWrap .short-delivery-time li.delivery-time03 h5 {
  color: #3F82DE;
}

.index .Explanation .short-delivery-timeWrap .delivery-time-note {
  max-width: 600px;
  margin: 30px auto 0;
  font-size: 12px;
  line-height: 1.6;
  padding-left: 1em;
  text-indent: -1em;
}

.index .Explanation .short-delivery-timeWrap .delivery-time-note.two {
  margin-top: 0;
}

.index .Explanation .short-delivery-timeWrap .on-web-cabista {
  margin: 25px auto 0;
  padding: 25px;
  border: 4px solid #80D6DE;
  max-width: 600px;
}

@media screen and (max-width: 767px) {
  .index .Explanation .short-delivery-timeWrap .on-web-cabista {
    padding: 18px;
    border: 3px solid #80D6DE;
  }
}
.index .Explanation .short-delivery-timeWrap .on-web-cabista .web-cabistaWrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@media screen and (max-width: 767px) {
  .index .Explanation .short-delivery-timeWrap .on-web-cabista .web-cabistaWrap {
    display: block;
  }
}
.index .Explanation .short-delivery-timeWrap .on-web-cabista .web-cabistaWrap .b-title {
  color: #00AEBB;
  font-weight: 700;
  line-height: 1.6;
  width: 220px;
}

@media screen and (max-width: 767px) {
  .index .Explanation .short-delivery-timeWrap .on-web-cabista .web-cabistaWrap .b-title {
    text-align: center;
    width: 100%;
    letter-spacing: 0;
    font-size: 15px;
  }
}
.index .Explanation .short-delivery-timeWrap .on-web-cabista .web-cabistaWrap figure {
  width: 300px;
}

@media screen and (max-width: 767px) {
  .index .Explanation .short-delivery-timeWrap .on-web-cabista .web-cabistaWrap figure {
    width: 100%;
    margin-top: 10px;
  }
}
.index .Explanation .short-delivery-timeWrap .on-web-cabista .note {
  text-align: center;
  font-size: 12px;
  margin-top: 15px;
}

@media screen and (max-width: 767px) {
  .index .Explanation .short-delivery-timeWrap .on-web-cabista .note {
    text-align: left;
    line-height: 1.4;
    padding-left: 1em;
    text-indent: -1em;
  }
}
.index .Explanation .Consistent-quality {
  border-top: 1px solid #00AEBB;
}

.index .Explanation .Consistent-quality .Consistent-quality-img {
  max-width: 660px;
  margin: 36px auto 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

@media screen and (max-width: 767px) {
  .index .Explanation .Consistent-quality .Consistent-quality-img {
    grid-template-columns: 1fr;
    gap: 10px;
  }
}
.index .Explanation .Consistent-quality .photo-note {
  font-size: 15px;
  font-weight: 700;
  text-align: center;
  margin-top: 20px;
}

@media screen and (max-width: 767px) {
  .index .Explanation .Consistent-quality .photo-note {
    line-height: 1.6;
  }
}
.index .btn-txt {
  margin-top: 50px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .index .btn-txt {
    line-height: 1.5;
  }
}
.index .loginBtn {
  margin-top: 15px;
  text-align: center;
}

.index .loginBtn a {
  display: inline-block;
  padding: 15px 50px 15px 20px;
  font-size: 15px;
  font-weight: 700;
  position: relative;
  color: #000;
  background-color: #FFF45E;
  border: 2px solid #00AEBB;
  border-radius: 30px;
  transition: all 0.2s linear;
}

@media screen and (max-width: 767px) {
  .index .loginBtn a {
    text-align: left;
    line-height: 1.4;
  }
}
.index .loginBtn a span {
  font-size: 14px;
  font-weight: 400;
}

.index .loginBtn a:after {
  content: "";
  width: 24px;
  height: 24px;
  background: url(../img/index/index-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  top: calc(50% - 12px);
  right: 15px;
}

.index .loginBtn a:hover {
  transform: scale(1.05, 1.05);
  background-color: #FFF;
}

/*////////////////////////// SMARTORDER ////////////////////////*/
.smartorder .mainimg {
  height: 670px;
  background: url(../img/smartorder/bk-triangle.svg) right bottom no-repeat, linear-gradient(90deg, rgb(0, 174, 187) 0%, rgb(26, 150, 213) 100%);
  padding: 30px 0 20px;
}

@media screen and (max-width: 767px) {
  .smartorder .mainimg {
    height: auto;
  }
}
.smartorder .mainimg .in_wrap {
  max-width: 1056px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 1090px) {
  .smartorder .mainimg .in_wrap {
    padding: 0 20px;
  }
}
@media screen and (max-width: 767px) {
  .smartorder .mainimg .in_wrap {
    display: block;
    padding: 0;
  }
}
.smartorder .mainimg .in_wrap .mainLeft {
  width: 46.1%;
}

@media screen and (max-width: 1140px) {
  .smartorder .mainimg .in_wrap .mainLeft {
    width: 40%;
  }
}
@media screen and (max-width: 767px) {
  .smartorder .mainimg .in_wrap .mainLeft {
    width: 100%;
  }
  .smartorder .mainimg .in_wrap .mainLeft .castam {
    width: 274px;
    margin: 0 auto;
  }
}
.smartorder .mainimg .in_wrap .mainLeft p {
  transform: skewX(-15deg);
  background-color: #000;
  text-align: center;
  font-size: 18px;
  font-weight: 700;
  padding: 8px 0;
  color: #FFF;
  margin-top: 20px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .smartorder .mainimg .in_wrap .mainLeft p {
    width: 80%;
    margin: 20px auto 0;
  }
}
.smartorder .mainimg .in_wrap .mainLeft p span {
  transform: skewX(15deg);
  display: block;
}

.smartorder .mainimg .in_wrap .mainLeft h1 {
  margin-top: 20px;
}

@media screen and (max-width: 767px) {
  .smartorder .mainimg .in_wrap .mainLeft h1 {
    width: 70%;
    margin: 20px auto 0;
  }
}
.smartorder .mainimg .in_wrap .mainRight {
  width: 45.5%;
}

@media screen and (max-width: 1140px) {
  .smartorder .mainimg .in_wrap .mainRight {
    width: 53%;
    margin-right: 3%;
  }
}
@media screen and (max-width: 767px) {
  .smartorder .mainimg .in_wrap .mainRight {
    display: none;
  }
}
.smartorder .mainimg .in_wrap .mainRight .yellowBlock {
  padding: 15px 15px 15px 40px;
  transform: skewX(-15deg);
  background-color: #FFF45E;
  margin-top: 128px;
}

.smartorder .mainimg .in_wrap .mainRight .yellowBlock span {
  display: block;
  font-size: 20px;
  font-weight: 700;
  transform: skewX(15deg);
  line-height: 2;
  color: #00AEBB;
}

.smartorder .mainimg .in_wrap .mainRight .yellowBlock span strong {
  font-size: 28px;
  display: inline-block;
  text-decoration: underline;
  text-decoration-color: #FF205F;
  text-underline-offset: 8px;
}

.smartorder .mainimg .in_wrap .mainRight .yellowBlock span strong small {
  font-size: 20px;
}

.smartorder .mainimg .in_wrap .mainRight .yellowBlock span em {
  font-size: 28px;
  font-style: normal;
}

.smartorder .mainimg .slideimg {
  margin-top: 50px;
}

@media screen and (max-width: 767px) {
  .smartorder .mainimg .slideimg {
    margin-top: 30px;
  }
}
.smartorder .mainimg .slideimg li {
  /*display: flex;
  align-items: baseline;*/
  padding: 0 20px;
  display: inline-block;
}

.smartorder .mainimg .SP-mainRight {
  display: none;
}

@media screen and (max-width: 767px) {
  .smartorder .mainimg .SP-mainRight {
    display: block;
    width: 90%;
    margin: 0 auto;
  }
  .smartorder .mainimg .SP-mainRight .yellowBlock {
    padding: 24px 20px;
    background-color: #FFF45E;
    margin-top: 15px;
    text-align: center;
  }
  .smartorder .mainimg .SP-mainRight .yellowBlock span {
    display: block;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.6;
    color: #00AEBB;
  }
  .smartorder .mainimg .SP-mainRight .yellowBlock span strong {
    font-size: 22px;
    display: inline-block;
    text-decoration: underline;
    text-decoration-color: #FF205F;
    text-underline-offset: 5px;
  }
  .smartorder .mainimg .SP-mainRight .yellowBlock span strong.sp-bottom {
    margin-bottom: 8px;
  }
  .smartorder .mainimg .SP-mainRight .yellowBlock span strong {
    margin-bottom: 8px;
  }
  .smartorder .mainimg .SP-mainRight .yellowBlock span strong small {
    font-size: 18px;
  }
  .smartorder .mainimg .SP-mainRight .yellowBlock span em {
    font-size: 24px;
    font-style: normal;
  }
}
.smartorder .productTitle p:after {
  display: block;
  position: absolute;
  top: -6px;
  right: -54px;
  width: 46px;
  height: 38px;
  background: url(../img/smartorder/smartorder_icon.svg) center center/100% 100% no-repeat;
  content: "";
}

.smartorder .illust {
  margin-right: 20px;
}

@media screen and (max-width: 767px) {
  .smartorder .illust {
    margin-left: 20px;
  }
}
.smartorder .pageNavi {
  background-color: #FFF;
  position: sticky;
  top: 83px;
  z-index: 8;
}

@media screen and (max-width: 767px) {
  .smartorder .pageNavi {
    display: none;
  }
}
.smartorder .pageNavi ul {
  display: flex;
  justify-content: center;
  border-bottom: 1px solid #000;
}

.smartorder .pageNavi ul li {
  display: inline-block;
}

.smartorder .pageNavi ul li a {
  display: block;
  padding: 10px 40px 10px 20px;
  color: #4C4948;
  font-size: 16px;
  font-weight: 700;
  background: url(../img/smartorder/navi-arrow.svg) 92% 15px no-repeat;
  border-right: 1px solid #000;
  transition: all 0.2s linear;
}

@media screen and (max-width: 930px) {
  .smartorder .pageNavi ul li a {
    padding: 10px 30px 10px 10px;
    font-size: 15px;
  }
}
.smartorder .pageNavi ul li a:hover {
  background-color: #E6F7F8;
}

.smartorder .pageNavi ul li:first-of-type a {
  border-left: 1px solid #000;
}

.smartorder .smartorder-main {
  background-color: #E6F7F8;
  background-image: url(../img/smartorder/smartorder-mainBK.svg);
  background-position: bottom 138px right;
  background-repeat: no-repeat;
  padding: 45px 0 100px;
}

@media screen and (max-width: 767px) {
  .smartorder .smartorder-main {
    padding: 45px 0 80px;
    background-position: bottom 180px right;
  }
}
.smartorder .smartorder-main .Features-txt {
  text-align: center;
  font-weight: 700;
  line-height: 1.6;
  color: #00AEBB;
}

@media screen and (max-width: 767px) {
  .smartorder .smartorder-main .Features-txt {
    padding: 0 20px;
    text-align: left;
  }
}
.smartorder .smartorder-main .WhiteBlock {
  background-color: #FFF;
  padding: 60px 118px;
  max-width: 960px;
  margin: 50px auto 0;
  border: 1px solid #00AEBB;
}

@media screen and (max-width: 980px) {
  .smartorder .smartorder-main .WhiteBlock {
    margin: 50px 20px 0;
    padding: 50px 60px;
  }
}
@media screen and (max-width: 767px) {
  .smartorder .smartorder-main .WhiteBlock {
    margin: 40px 20px 0;
    padding: 45px 20px;
    text-align: center;
  }
}
.smartorder .smartorder-main .WhiteBlock h2 {
  font-size: 36px;
  font-weight: 900;
  text-align: center;
  padding-bottom: 8px;
  border-bottom: 4px solid #FFF45E;
  color: #00AEBB;
}

@media screen and (max-width: 767px) {
  .smartorder .smartorder-main .WhiteBlock h2 {
    font-size: 24px;
    line-height: 1.6;
    display: inline-block;
  }
}
.smartorder .smartorder-main .WhiteBlock .WhiteBlockTxt {
  line-height: 1.7;
  margin-top: 35px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .smartorder .smartorder-main .WhiteBlock .WhiteBlockTxt {
    text-align: left;
  }
}
.smartorder .smartorder-main .WhiteBlock .Manufacturing-img {
  margin: 45px auto 0;
  width: 94%;
}

.smartorder .smartorder-main .WhiteBlock .High-quality {
  text-align: center;
  font-size: 18px;
  margin-top: 45px;
  font-weight: 700;
}

@media screen and (max-width: 767px) {
  .smartorder .smartorder-main .WhiteBlock .High-quality {
    line-height: 1.6;
    font-size: 16px;
  }
}
.smartorder .smartorder-main .WhiteBlock .High-quality span {
  font-size: 24px;
  color: #FF205F;
}

@media screen and (max-width: 767px) {
  .smartorder .smartorder-main .WhiteBlock .High-quality span {
    font-size: 20px;
  }
}
.smartorder .smartorder-main h3 {
  font-size: 24px;
  font-weight: 700;
  text-align: center;
  margin-top: 45px;
  color: #1A96D5;
}

@media screen and (max-width: 767px) {
  .smartorder .smartorder-main h3 {
    line-height: 1.6;
  }
}
.smartorder .smartorder-main .Difference {
  font-size: 14px;
  line-height: 1.6;
  margin: 15px auto 0;
  max-width: 690px;
}

@media screen and (max-width: 767px) {
  .smartorder .smartorder-main .Difference {
    text-align: left;
    margin: 15px 20px 0;
  }
}
.smartorder .smartorder-main .btn-order {
  text-align: center;
}

.smartorder .smartorder-main .btn-order a {
  display: inline-block;
  border-radius: 10px;
  border: 2px solid #1A96D5;
  padding: 10px 60px 10px 20px;
  color: #1A96D5;
  font-weight: 700;
  margin-top: 30px;
  position: relative;
  background-color: #FFF;
  transition: all 0.2s linear;
}

.smartorder .smartorder-main .btn-order a:after {
  position: absolute;
  content: "";
  width: 24px;
  height: 24px;
  display: block;
  background: url(../img/smartorder/blue-arrow.svg) center center/100% 100% no-repeat;
  top: calc(50% - 12px);
  right: 20px;
}

.smartorder .smartorder-main .btn-order a:hover {
  opacity: 0.6;
}

.smartorder .smartorder-main .MovieBox {
  margin: 80px auto 0;
  max-width: 600px;
  text-align: center;
}

.smartorder .smartorder-main .MovieBox h4 {
  font-size: 20px;
  font-weight: 700;
}

.smartorder .smartorder-main .MovieBox .MovieWrap {
  width: 640px;
  margin: 18px auto 0;
}

@media screen and (max-width: 767px) {
  .smartorder .smartorder-main .MovieBox .MovieWrap {
    width: 92%;
  }
}
.smartorder .smartorder-main .MovieBox .MovieWrap iframe {
  aspect-ratio: 16/9;
}

@media screen and (max-width: 767px) {
  .smartorder .smartorder-main .MovieBox .MovieWrap iframe {
    height: auto;
  }
}
.smartorder .smartorder-main .MovieBox .movie-txt {
  font-size: 15px;
  font-weight: 700;
  margin: 10px 0 0 0;
}

.smartorder .smartorder-main .MovieBox .movie-txt small {
  font-weight: 400;
  font-size: 13px;
  margin-left: 0.5em;
}

.smartorder .smartorder-main .MovieBox .movie-note {
  text-align: left;
  font-size: 12px;
  line-height: 1.6;
  margin-top: 25px;
  margin-left: 1em;
  text-indent: -1em;
}

@media screen and (max-width: 767px) {
  .smartorder .smartorder-main .MovieBox .movie-note {
    margin: 25px 20px 0;
  }
}
.smartorder .smartorder-main .line-production {
  margin-top: 45px;
}

.smartorder .smartorder-main .line-production li {
  width: 290px;
}

@media screen and (max-width: 767px) {
  .smartorder .smartorder-main .line-production li {
    width: 200px;
  }
}
.smartorder .smartorder-main .line-production-txt {
  text-align: center;
  margin-top: 25px;
  font-size: 15px;
  font-weight: 700;
}

@media screen and (max-width: 767px) {
  .smartorder .smartorder-main .line-production-txt {
    margin: 25px 20px 0;
    text-align: left;
    line-height: 1.6;
  }
}
.smartorder .Target {
  background-color: #E6F7F8;
  padding-bottom: 80px;
}

.smartorder .Target .Target-inwrap {
  max-width: 960px;
  margin: 0 auto;
  text-align: center;
}

.smartorder .Target .Target-inwrap h2 {
  padding: 15px 0;
  font-size: 32px;
  color: #FFF;
  font-weight: 400;
  background-color: #00AEBB;
}

@media screen and (max-width: 767px) {
  .smartorder .Target .Target-inwrap h2 {
    font-size: 24px;
  }
}
.smartorder .Target .Target-inwrap h3 {
  margin-top: 45px;
  font-size: 32px;
  font-weight: 700;
  color: #00AEBB;
}

@media screen and (max-width: 767px) {
  .smartorder .Target .Target-inwrap h3 {
    line-height: 1.6;
    margin-top: 40px;
  }
}
.smartorder .Target .Target-inwrap h3 span {
  color: #FF205F;
}

@media screen and (max-width: 767px) {
  .smartorder .Target .Target-inwrap h3 span {
    display: block;
  }
}
.smartorder .Target .Target-inwrap .Target-txt {
  margin-top: 15px;
  line-height: 1.7;
}

@media screen and (max-width: 767px) {
  .smartorder .Target .Target-inwrap .Target-txt {
    margin: 15px 20px 0;
    text-align: left;
  }
}
.smartorder .Target .Target-inwrap .Table-wrap {
  max-width: 900px;
  margin: 40px auto 0;
}

@media screen and (max-width: 767px) {
  .smartorder .Target .Target-inwrap .Table-wrap {
    width: calc(100% - 40px);
    overflow-x: scroll;
    margin: 15px auto 0;
  }
}
.smartorder .Target .Target-inwrap .Table-wrap .Series-Table {
  border-collapse: separate;
  width: 100%;
  border-spacing: 5px;
  line-height: 1.4;
}

@media screen and (max-width: 914px) {
  .smartorder .Target .Target-inwrap .Table-wrap .Series-Table {
    width: 96%;
    margin: 0 auto;
  }
}
@media screen and (max-width: 767px) {
  .smartorder .Target .Target-inwrap .Table-wrap .Series-Table {
    width: 265%;
  }
}
.smartorder .Target .Target-inwrap .Table-wrap .Series-Table th {
  background-color: #D9D9D9;
  font-size: 13px;
  text-align: center;
  padding: 8px;
  font-weight: 400;
}

@media screen and (max-width: 914px) {
  .smartorder .Target .Target-inwrap .Table-wrap .Series-Table th {
    font-size: 1.5vw;
  }
}
.smartorder .Target .Target-inwrap .Table-wrap .Series-Table th.dark-gray {
  background-color: #6A6A6A;
  color: #FFF;
  font-size: 14px;
  font-weight: 700;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table th small {
  font-size: 12px;
  font-weight: 400;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td {
  padding: 8px;
  font-size: 14px;
  font-weight: 700;
  background-color: #FFF;
  vertical-align: bottom;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td span {
  font-size: 12px;
  font-weight: 400;
  margin-left: 0.3em;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td em {
  font-weight: 400;
  font-style: normal;
  margin-left: 0.5em;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td small {
  font-size: 13px;
  font-weight: 400;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td.Structure {
  background-color: #C4ECEF;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td.co01 {
  background-color: #E08024;
  color: #FFF;
  font-size: 16px;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td.co02 {
  background-color: #3271AE;
  color: #FFF;
  font-size: 16px;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td.co03 {
  background-color: #925E8F;
  color: #FFF;
  font-size: 16px;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td.co04 {
  background-color: #DB5E94;
  color: #FFF;
  font-size: 16px;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td.co05 {
  background-color: #00A3A3;
  color: #FFF;
  font-size: 16px;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td.link a {
  font-size: 14px;
  font-weight: 500;
  transition: all 0.2s linear;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td.link a:after {
  content: url(../img/smartorder/ExternalLink.svg);
  margin-left: 10px;
  position: relative;
  top: 8px;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td.link a:hover {
  opacity: 0.5;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td.co01-b {
  border: 1px solid #E08024;
  padding-top: 0;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td.co01-b a {
  color: #E08024;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td.co02-b {
  border: 1px solid #3271AE;
  padding-top: 0;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td.co02-b a {
  color: #3271AE;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td.co03-b {
  border: 1px solid #925E8F;
  padding-top: 0;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td.co03-b a {
  color: #925E8F;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td.co04-b {
  border: 1px solid #DB5E94;
  padding-top: 0;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td.co04-b a {
  color: #DB5E94;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td.co05-b {
  border: 1px solid #00A3A3;
  padding-top: 0;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td.co05-b a {
  color: #00A3A3;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td img {
  width: 103px;
  margin: 10px auto;
}

.smartorder .Target .Target-inwrap .Table-wrap .Series-Table td.img02 img {
  width: 75px;
}

.smartorder .Target .packinBox {
  box-sizing: border-box;
  max-width: 600px;
  background-color: #FFF;
  padding: 15px 20px;
  display: flex;
  justify-content: space-between;
  margin: 30px 0 0 30px;
}

@media screen and (max-width: 767px) {
  .smartorder .Target .packinBox {
    margin: 30px 20px 0;
    display: block;
  }
}
.smartorder .Target .packinBox dl {
  width: 46.4%;
  display: flex;
  align-items: center;
  justify-content: start;
}

@media screen and (max-width: 767px) {
  .smartorder .Target .packinBox dl {
    width: 100%;
  }
  .smartorder .Target .packinBox dl:nth-of-type(2) {
    margin-top: 20px;
  }
}
.smartorder .Target .packinBox dl dt {
  width: 46.4%;
}

.smartorder .Target .packinBox dl dt p {
  font-size: 14px;
  line-height: 1.6;
  text-align: left;
  margin-left: 1.25em;
  text-indent: -1.25em;
}

.smartorder .Target .packinBox dl dd {
  width: 53.6%;
}

.smartorder .Target .Target-noteTxt {
  max-width: 900px;
  text-align: left;
  font-size: 12px;
  line-height: 1.6;
  margin: 0 auto;
  padding-left: 1.5em;
  text-indent: -1.5em;
}

@media screen and (max-width: 910px) {
  .smartorder .Target .Target-noteTxt {
    margin: 0 20px;
  }
}
.smartorder .Target .Target-noteTxt a {
  display: block;
  padding-left: 1.5em;
  text-decoration: underline;
}

.smartorder .Target .Target-noteTxt.mt {
  margin-top: 15px;
}

.smartorder .CustomMenu {
  background-color: #E6F7F8;
  padding-bottom: 80px;
}

@media screen and (max-width: 767px) {
  .smartorder .CustomMenu {
    padding-bottom: 60px;
  }
}
.smartorder .CustomMenu .CustomMenu-inwrap {
  max-width: 960px;
  margin: 0 auto;
  text-align: center;
}

.smartorder .CustomMenu .CustomMenu-inwrap h2 {
  padding: 15px 0;
  font-size: 32px;
  color: #FFF;
  font-weight: 400;
  background-color: #00AEBB;
}

@media screen and (max-width: 767px) {
  .smartorder .CustomMenu .CustomMenu-inwrap h2 {
    font-size: 24px;
  }
}
.smartorder .CustomMenu h3 {
  margin-top: 45px;
  font-size: 32px;
  font-weight: 700;
  color: #00AEBB;
}

@media screen and (max-width: 767px) {
  .smartorder .CustomMenu h3 {
    line-height: 1.6;
  }
}
.smartorder .CustomMenu h3 span {
  color: #FF205F;
}

.smartorder .CustomMenu .CustomMenu-txt {
  margin-top: 15px;
  line-height: 1.7;
}

@media screen and (max-width: 767px) {
  .smartorder .CustomMenu .CustomMenu-txt {
    text-align: left;
    margin: 15px 20px 0;
  }
}
.smartorder .CustomMenu .Variations {
  max-width: 756px;
  margin: 60px auto 0;
  display: flex;
  align-items: center;
}

@media screen and (max-width: 767px) {
  .smartorder .CustomMenu .Variations {
    margin: 50px 20px 0;
    display: block;
  }
}
.smartorder .CustomMenu .Variations dt {
  width: 47.4%;
  position: relative;
}

@media screen and (max-width: 767px) {
  .smartorder .CustomMenu .Variations dt {
    width: 100%;
  }
}
.smartorder .CustomMenu .Variations dt .abBox {
  width: 150px;
  height: 80px;
  background: url(../img/smartorder/Variations-waku.svg) top left/100% 100% no-repeat;
  color: #FFF;
  font-size: 16px;
  font-weight: 700;
  text-align: center;
  box-sizing: border-box;
  padding-top: 14px;
  position: absolute;
  line-height: 1.2;
  top: -10px;
  right: 28px;
}

.smartorder .CustomMenu .Variations dt ul {
  list-style: none;
  text-align: left;
}

.smartorder .CustomMenu .Variations dt ul li {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.6;
}

.smartorder .CustomMenu .Variations dt ul li:before {
  content: "・";
  color: #00AEBB;
  margin-right: 0.25em;
}

.smartorder .CustomMenu .Variations dd {
  width: 52.6%;
}

@media screen and (max-width: 767px) {
  .smartorder .CustomMenu .Variations dd {
    width: 100%;
    margin-top: 25px;
  }
}
.smartorder .CustomMenu .Variations dd ul li {
  margin-bottom: 18px;
}

.smartorder .CustomMenu .Variations dd ul li a {
  display: block;
  padding: 20px 10px;
  border-radius: 16px;
  border: 3px solid #00AEBB;
  display: flex;
  align-items: center;
  background-color: #FFF;
  position: relative;
  transition: all 0.2s linear;
}

@media screen and (max-width: 767px) {
  .smartorder .CustomMenu .Variations dd ul li a {
    padding: 15px 10px;
  }
}
.smartorder .CustomMenu .Variations dd ul li a:after {
  content: "";
  width: 24px;
  height: 24px;
  background: url(../img/index/Pricing-Structure-arrow01.svg) center center/100% 100% no-repeat;
  position: absolute;
  top: calc(50% - 12px);
  right: 12px;
  display: block;
}

@media screen and (max-width: 767px) {
  .smartorder .CustomMenu .Variations dd ul li a:after {
    width: 22px;
    height: 22px;
    right: 10px;
    top: calc(50% - 11px);
  }
}
.smartorder .CustomMenu .Variations dd ul li a:hover {
  opacity: 0.5;
}

.smartorder .CustomMenu .Variations dd ul li figure {
  width: 21%;
}

@media screen and (max-width: 767px) {
  .smartorder .CustomMenu .Variations dd ul li figure {
    width: 19%;
  }
}
.smartorder .CustomMenu .Variations dd ul li .box {
  width: 79%;
  color: #00AEBB;
  font-size: 14px;
  text-align: left;
}

@media screen and (max-width: 767px) {
  .smartorder .CustomMenu .Variations dd ul li .box {
    width: 80%;
    margin-left: 1%;
    font-size: 13px;
  }
}
.smartorder .CustomMenu .Variations dd ul li .box strong {
  font-size: 20px;
  font-weight: 700;
  display: block;
  margin-top: 10px;
}

@media screen and (max-width: 767px) {
  .smartorder .CustomMenu .Variations dd ul li .box strong {
    font-size: 15px;
  }
}
.smartorder .CustomMenu .Variations-slide {
  margin-top: 40px;
}

.smartorder .CustomMenu .Variations-slide li {
  width: 100px;
}

.smartorder .CustomMenu .slide-bottom-txt {
  font-size: 15px;
  font-weight: 500;
  line-height: 1.6;
  margin-top: 70px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .smartorder .CustomMenu .slide-bottom-txt {
    margin: 60px 20px 0;
    text-align: left;
  }
}
.smartorder .CustomMenu .btn-order {
  text-align: center;
}

.smartorder .CustomMenu .btn-order a {
  display: inline-block;
  border-radius: 10px;
  border: 2px solid #00AEBB;
  padding: 10px 60px 10px 20px;
  color: #00AEBB;
  font-weight: 700;
  margin-top: 30px;
  position: relative;
  background-color: #FFF;
  transition: all 0.2s linear;
}

@media screen and (max-width: 767px) {
  .smartorder .CustomMenu .btn-order a {
    line-height: 1.4;
    text-align: left;
  }
}
.smartorder .CustomMenu .btn-order a:after {
  position: absolute;
  content: "";
  width: 24px;
  height: 24px;
  display: block;
  background: url(../img/index/index-arrow.svg) center center/100% 100% no-repeat;
  top: calc(50% - 12px);
  right: 20px;
}

.smartorder .CustomMenu .btn-order a:hover {
  opacity: 0.6;
}

.smartorder .CustomMenu .LinkList {
  margin-top: 15px;
  display: flex;
  justify-content: center;
}

@media screen and (max-width: 767px) {
  .smartorder .CustomMenu .LinkList {
    margin: 25px auto 0;
    display: block;
    width: 50%;
  }
}
.smartorder .CustomMenu .LinkList li {
  display: inline-block;
  padding-right: 40px;
}

@media screen and (max-width: 767px) {
  .smartorder .CustomMenu .LinkList li {
    display: block;
    margin-bottom: 20px;
    text-align: left;
  }
}
.smartorder .CustomMenu .LinkList li a {
  font-size: 14px;
  font-weight: 700;
  color: #000;
  position: relative;
  transition: all 0.2s linear;
}

@media screen and (max-width: 767px) {
  .smartorder .CustomMenu .LinkList li a {
    line-height: 1.6;
  }
}
.smartorder .CustomMenu .LinkList li a:after {
  position: absolute;
  width: 20px;
  height: 20px;
  content: "";
  background: url(../img/index/news-arrow.svg) center center/100% 100% no-repeat;
  right: -24px;
  top: calc(50% - 10px);
}

@media screen and (max-width: 767px) {
  .smartorder .CustomMenu .LinkList li a:after {
    right: -48px;
  }
}
.smartorder .CustomMenu .LinkList li a:hover {
  opacity: 0.5;
}

.smartorder .CustomMenu .LinkList li:last-of-type {
  padding-right: 0;
}

.smartorder .price {
  background-color: #E6F7F8;
  padding-bottom: 80px;
}

.smartorder .price .price-inwrap {
  max-width: 960px;
  margin: 0 auto;
  text-align: center;
}

.smartorder .price .price-inwrap h2 {
  padding: 15px 0;
  font-size: 32px;
  color: #FFF;
  font-weight: 400;
  background-color: #00AEBB;
}

@media screen and (max-width: 767px) {
  .smartorder .price .price-inwrap h2 {
    font-size: 24px;
  }
}
.smartorder .price .price-inwrap h3 {
  margin-top: 45px;
  font-size: 32px;
  font-weight: 700;
  color: #00AEBB;
}

@media screen and (max-width: 767px) {
  .smartorder .price .price-inwrap h3 {
    line-height: 1.6;
  }
}
.smartorder .price .price-inwrap h3 span {
  color: #FF205F;
}

@media screen and (max-width: 767px) {
  .smartorder .price .price-inwrap h3 span {
    display: block;
  }
}
.smartorder .price .price-inwrap .price-txt {
  margin-top: 15px;
  line-height: 1.7;
}

@media screen and (max-width: 767px) {
  .smartorder .price .price-inwrap .price-txt {
    margin: 15px 20px 0;
    text-align: left;
  }
}
.smartorder .price .price-inwrap .ReasonableBox {
  display: flex;
  justify-content: space-between;
  margin: 116px auto 0;
  max-width: 840px;
}

@media screen and (max-width: 980px) {
  .smartorder .price .price-inwrap .ReasonableBox {
    max-width: 760px;
  }
}
@media screen and (max-width: 767px) {
  .smartorder .price .price-inwrap .ReasonableBox {
    margin: 40px 45px 0;
    display: block;
  }
}
.smartorder .price .price-inwrap .ReasonableBox li {
  padding: 10px 8px 8px;
  border: 2px solid #00AEBB;
  border-radius: 8px;
  background-color: #FFF;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  box-shadow: 3px 3px 6px 0px rgba(100, 100, 100, 0.4);
}

@media screen and (max-width: 767px) {
  .smartorder .price .price-inwrap .ReasonableBox li {
    width: 70%;
    margin: 40px auto 0;
  }
  .smartorder .price .price-inwrap .ReasonableBox li:first-of-type {
    margin-top: 116px;
  }
  .smartorder .price .price-inwrap .ReasonableBox li:nth-of-type(2) {
    margin-top: 116px;
  }
}
.smartorder .price .price-inwrap .ReasonableBox li .mainTxt {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
  color: #00AEBB;
}

.smartorder .price .price-inwrap .ReasonableBox li .subTxt {
  font-size: 16px;
  font-weight: 700;
  color: #FF205F;
  margin-top: 24px;
}

@media screen and (max-width: 767px) {
  .smartorder .price .price-inwrap .ReasonableBox li .subTxt {
    margin-top: 10px;
  }
}
.smartorder .price .price-inwrap .ReasonableBox li .fukidashi01 {
  box-sizing: border-box;
  position: absolute;
  color: #FFF45E;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
  width: 140px;
  height: 77px;
  top: -80px;
  left: calc(50% - 70px);
  background: url(../img/smartorder/Reasonable-fukidashi01.svg) center center/100% auto no-repeat;
  padding-top: 10px;
}

.smartorder .price .price-inwrap .ReasonableBox li .fukidashi01 span {
  color: #FFF;
}

.smartorder .price .price-inwrap .ReasonableBox li .fukidashi02 {
  box-sizing: border-box;
  color: #FFF45E;
  font-size: 19px;
  font-weight: 700;
  line-height: 1.4;
  position: absolute;
  color: #FFF45E;
  width: 170px;
  height: 77px;
  top: -80px;
  left: calc(50% - 85px);
  background: url(../img/smartorder/Reasonable-fukidashi02.svg) center center/100% auto no-repeat;
  padding-top: 10px;
}

.smartorder .price .price-inwrap .ReasonableBox li .fukidashi02 span {
  color: #FFF;
  font-size: 18px;
}

.smartorder .price .price-inwrap .ReasonableBox li .fukidashi02 small {
  font-size: 12px;
  display: block;
  color: #FFF;
}

.smartorder .price .price-inwrap .ReasonableBox li table {
  margin-top: 10px;
  border-top: 1px solid #00AEBB;
  border-right: 1px solid #00AEBB;
}

.smartorder .price .price-inwrap .ReasonableBox li table th {
  border-bottom: 1px solid #00AEBB;
  border-left: 1px solid #00AEBB;
  padding: 5px;
  background-color: #E6F7F8;
  font-size: 14px;
  color: #00AEBB;
  font-weight: 500;
}

.smartorder .price .price-inwrap .ReasonableBox li table td {
  border-bottom: 1px solid #00AEBB;
  border-left: 1px solid #00AEBB;
  padding: 5px;
  font-size: 15px;
  font-weight: 400;
}

.smartorder .price .price-inwrap .ReasonableBox li .noteTxt {
  font-size: 14px;
  line-height: 1.6;
  margin-top: 15px;
}

@media screen and (max-width: 767px) {
  .smartorder .price .price-inwrap .ReasonableBox li .noteTxt {
    margin-top: 10px;
  }
}
.smartorder .price .price-inwrap .ReasonableBox li.pd {
  padding: 10px 20px 8px;
}

.smartorder .price .price-inwrap .ReasonableBox li:after {
  content: "＋";
  position: absolute;
  right: -43px;
  font-size: 24px;
  font-weight: 700;
  top: calc(50% - 12px);
  color: #00AEBB;
}

@media screen and (max-width: 980px) {
  .smartorder .price .price-inwrap .ReasonableBox li:after {
    right: -32px;
  }
}
@media screen and (max-width: 767px) {
  .smartorder .price .price-inwrap .ReasonableBox li:after {
    right: calc(50% - 12px);
    top: calc(100% + 10px);
  }
}
.smartorder .price .price-inwrap .ReasonableBox li:last-of-type:after {
  display: none;
}

.smartorder .price .price-inwrap .wrap {
  margin-top: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .smartorder .price .price-inwrap .wrap {
    justify-content: start;
    margin-left: 20px;
  }
}

.smartorder .price .price-inwrap .txt {
  margin-top: 6px;
}

.smartorder .price .price-inwrap .txt em {
  font-style: normal;
  font-size: 12px;
  margin-right: 10px;
}

.smartorder .price .pdf-dl-btn {
  text-align: center;
}

@media screen and (max-width: 767px) {
  .smartorder .price .pdf-dl-btn {
    text-align: center;
    line-height: 1.4;
  }
}
.smartorder .price .pdf-dl-btn a {
  display: inline-block;
  transition: all 0.2s linear;
  color: #000;
  font-weight: 700;
  font-size: 14px;
  position: relative;
}

.smartorder .price .pdf-dl-btn a span {
  display: inline-block;
  width: 20px;
  position: relative;
  left: 4px;
  top: 5px;
}

.smartorder .price .pdf-dl-btn a:after {
  content: "";
  width: 20px;
  height: 20px;
  background: url(../img/index/news-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  right: -30px;
  top: 7px;
}

@media screen and (max-width: 767px) {
  .smartorder .price .pdf-dl-btn a:after {
    top: 10px;
  }
}
.smartorder .price .pdf-dl-btn a em {
  font-size: 12px;
  font-weight: 400;
  font-style: normal;
  margin-right: 1em;
}

@media screen and (max-width: 767px) {
  .smartorder .price .pdf-dl-btn a em {
    display: block;
  }
}
.smartorder .price .pdf-dl-btn a:hover {
  opacity: 0.5;
}

.smartorder .price .partsBox {
  background-color: #FFF;
  padding: 35px 120px;
  margin-top: 45px;
}

@media screen and (max-width: 980px) {
  .smartorder .price .partsBox {
    padding: 30px 60px;
    margin: 40px 20px 0;
  }
}
@media screen and (max-width: 767px) {
  .smartorder .price .partsBox {
    padding: 30px 20px;
  }
}
.smartorder .price .partsBox .partsTitleTxt {
  text-align: center;
  font-weight: 500;
}

@media screen and (max-width: 890px) {
  .smartorder .price .partsBox .partsTitleTxt {
    line-height: 1.6;
  }
}
.smartorder .price .partsBox ul {
  margin-top: 22px;
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .smartorder .price .partsBox ul {
    display: block;
  }
}
.smartorder .price .partsBox ul li {
  width: 45%;
}

@media screen and (max-width: 767px) {
  .smartorder .price .partsBox ul li {
    width: 100%;
  }
}
.smartorder .price .partsBox ul li dl {
  display: flex;
  justify-content: space-between;
}

.smartorder .price .partsBox ul li dl dt {
  width: 96px;
}

@media screen and (max-width: 767px) {
  .smartorder .price .partsBox ul li dl dt {
    width: 90px;
  }
}
.smartorder .price .partsBox ul li dl dd {
  width: 210px;
  text-align: left;
  padding-top: 10px;
}

@media screen and (max-width: 767px) {
  .smartorder .price .partsBox ul li dl dd {
    width: calc(100% - 100px);
    margin-left: 10px;
  }
}
.smartorder .price .partsBox ul li dl dd h3 {
  font-size: 18px;
  font-weight: 700;
  border-bottom: 1px solid #4C4948;
  padding-bottom: 10px;
  margin: 0;
}

.smartorder .price .partsBox ul li dl dd h3.black {
  color: #4C4948;
}

.smartorder .price .partsBox ul li dl dd p {
  font-size: 15px;
  line-height: 1.7;
  margin-top: 10px;
}

.smartorder .price .partsBox ul li dl dd p span {
  text-decoration: underline;
}

.smartorder .price .partsBox ul li dl dd .small {
  display: block;
  margin-top: 15px;
  font-size: 13px;
}

.smartorder .price .partsBox ul li dl dd img {
  width: 34px;
  margin: 5px auto;
}

.smartorder .price .partsBox ul li dl dd .strong {
  display: block;
  font-size: 15px;
  font-weight: 700;
}

@media screen and (max-width: 767px) {
  .smartorder .price .partsBox ul li dl dd .strong {
    line-height: 1.6;
  }
}
.smartorder .price .partsBox ul li dl dd .strong em {
  color: #FF205F;
  font-style: normal;
}

@media screen and (max-width: 767px) {
  .smartorder .price .partsBox ul li dl dd .strong em {
    display: block;
  }
}
.smartorder .price .partsBox ul li:nth-of-type(2) h3 {
  border-bottom: 1px solid #00AEBB;
}

@media screen and (max-width: 767px) {
  .smartorder .price .partsBox ul li:nth-of-type(2):nth-of-type(2) {
    margin-top: 15px;
  }
}
.smartorder .price .Btn {
  margin: 40px auto 0;
  width: 398px;
}

@media screen and (max-width: 767px) {
  .smartorder .price .Btn {
    margin: 40px 20px 0;
    width: auto;
  }
}
.smartorder .price .Btn a {
  display: block;
  padding: 20px 10px;
  border-radius: 16px;
  border: 3px solid #00AEBB;
  display: flex;
  align-items: center;
  background-color: #FFF;
  position: relative;
  transition: all 0.2s linear;
}

@media screen and (max-width: 767px) {
  .smartorder .price .Btn a {
    padding: 10px;
  }
}
.smartorder .price .Btn a:after {
  content: "";
  width: 24px;
  height: 24px;
  background: url(../img/index/Pricing-Structure-arrow01.svg) center center/100% 100% no-repeat;
  position: absolute;
  top: calc(50% - 12px);
  right: 12px;
  display: block;
}

@media screen and (max-width: 767px) {
  .smartorder .price .Btn a:after {
    width: 22px;
    height: 22px;
    top: calc(50% - 11px);
    right: 10px;
  }
}
.smartorder .price .Btn a:hover {
  opacity: 0.5;
}

.smartorder .price .Btn figure {
  width: 21%;
}

@media screen and (max-width: 767px) {
  .smartorder .price .Btn figure {
    width: 18%;
  }
}
.smartorder .price .Btn .box {
  width: 79%;
  color: #00AEBB;
  font-size: 14px;
  text-align: left;
}

@media screen and (max-width: 767px) {
  .smartorder .price .Btn .box {
    width: 81%;
    margin-left: 1%;
    font-size: 13px;
  }
}
.smartorder .price .Btn .box strong {
  font-size: 20px;
  font-weight: 700;
  display: block;
  margin-top: 10px;
}

@media screen and (max-width: 767px) {
  .smartorder .price .Btn .box strong {
    font-size: 16px;
  }
}
.smartorder .ProductionExamples {
  background-color: #E6F7F8;
  padding-bottom: 80px;
}

.smartorder .ProductionExamples .ProductionExamplesBox {
  background-color: #FFF;
  padding: 50px 60px 70px;
  max-width: 1080px;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .smartorder .ProductionExamples .ProductionExamplesBox {
    padding: 40px 20px;
  }
}
.smartorder .ProductionExamples .ProductionExamplesBox h2 {
  border-top: 1px solid #00AEBB;
  border-bottom: 1px solid #00AEBB;
  padding: 25px 0;
  font-size: 40px;
  color: #00AEBB;
  text-align: center;
  font-weight: 400;
}

.smartorder .ProductionExamples .ProductionExamplesBox h2 span {
  font-size: 20px;
  font-weight: 700;
  display: block;
  margin-bottom: 20px;
}

.smartorder .ProductionExamples .ProductionExamplesBox .ProductionExamplesTxt {
  text-align: center;
  margin-top: 25px;
}

@media screen and (max-width: 767px) {
  .smartorder .ProductionExamples .ProductionExamplesBox .ProductionExamplesTxt {
    line-height: 1.6;
    text-align: left;
  }
}
.smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap {
  display: flex;
  justify-content: space-between;
  margin-top: 40px;
}

@media screen and (max-width: 767px) {
  .smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap {
    display: block;
  }
}
.smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox {
  width: 48%;
}

@media screen and (max-width: 767px) {
  .smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox {
    width: 100%;
  }
}
.smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox .no01 {
  width: 110px;
  margin: 0 auto;
}

.smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox .no02 {
  width: 186px;
  margin: 53px auto 0;
}

.smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox h3 {
  text-align: center;
  font-size: 16px;
  font-weight: 700;
  margin: 35px 0 0;
}

.smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox h3 .back-E {
  display: inline-block;
  padding: 5px 0;
  width: 30px;
  text-align: center;
  font-weight: 500;
  font-size: 12px;
  background-color: #3271AE;
  margin-left: 10px;
  color: #FFF;
}

.smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox h3 .back-RA {
  display: inline-block;
  padding: 3px 0;
  width: 30px;
  text-align: center;
  font-weight: 500;
  font-size: 12px;
  background-color: #E08024;
  margin-left: 10px;
  color: #FFF;
}

.smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox table {
  margin-top: 24px;
  border-bottom: 1px solid #6A6A6A;
}

.smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox table th {
  padding: 8px;
  background-color: #00AEBB;
  color: #FFF;
  font-size: 15px;
  font-weight: 500;
  border-right: 1px solid #FFF;
}

@media screen and (max-width: 767px) {
  .smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox table th {
    font-size: 14px;
  }
}
.smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox table td {
  padding: 8px;
  font-size: 14px;
  border-right: 1px solid #6A6A6A;
  border-bottom: 1px solid #D9D9D9;
  line-height: 1.5;
}

@media screen and (max-width: 767px) {
  .smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox table td {
    font-size: 14px;
  }
  .smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox table td:nth-of-type(2) {
    white-space: nowrap;
  }
}
.smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox table td.last {
  border-right: none;
}

.smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox table td.TitleBlue {
  border-top: 1px solid #00AEBB;
  border-bottom: 1px solid #00AEBB;
  background-color: #E6F7F8;
  text-align: center;
  color: #00AEBB;
}

.smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox table td.priceBlock {
  text-align: right;
}

.smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox table td.gray {
  background-color: #EBEBEB;
}

.smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox table td.center {
  text-align: center;
}

.smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox table td.blue-bottom {
  border-bottom: 1px solid #00AEBB;
}

.smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox table td span {
  color: #FF205F;
}

.smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox .priceStrong {
  text-align: right;
  margin-top: 15px;
  margin-right: 33px;
  font-size: 18px;
  font-weight: 700;
}

@media screen and (max-width: 767px) {
  .smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox .priceStrong {
    margin-right: 3.5%;
  }
}
.smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox .priceStrong span {
  margin-left: 32px;
}

@media screen and (max-width: 767px) {
  .smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox .priceStrong span {
    margin-left: 8%;
  }
}
.smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox .priceStrong.left-p {
  margin-right: 40px;
}

@media screen and (max-width: 767px) {
  .smartorder .ProductionExamples .ProductionExamplesBox .CabinetWrap .CabinetBox .priceStrong.left-p {
    margin-right: 3.5%;
  }
}
.smartorder .DeliveryDate {
  background-color: #E6F7F8;
  text-align: center;
}

.smartorder .DeliveryDate .DeliveryDate_inwrap {
  max-width: 960px;
  margin: 0 auto;
}

.smartorder .DeliveryDate .DeliveryDate_inwrap h2 {
  padding: 15px 0;
  font-size: 32px;
  color: #FFF;
  font-weight: 400;
  background-color: #00AEBB;
}

@media screen and (max-width: 767px) {
  .smartorder .DeliveryDate .DeliveryDate_inwrap h2 {
    font-size: 24px;
  }
}
.smartorder .DeliveryDate .DeliveryDate_inwrap h3 {
  margin-top: 45px;
  font-size: 32px;
  font-weight: 700;
  color: #00AEBB;
}

.smartorder .DeliveryDate .DeliveryDate_inwrap h3 span {
  color: #FF205F;
}

.smartorder .DeliveryDate .DeliveryDate_inwrap .DeliveryDateTxt {
  margin-top: 15px;
  line-height: 1.7;
}

@media screen and (max-width: 767px) {
  .smartorder .DeliveryDate .DeliveryDate_inwrap .DeliveryDateTxt {
    margin: 15px 20px 0;
    text-align: left;
  }
}
.smartorder .DeliveryDate .SeriesBlock {
  display: flex;
  justify-content: space-between;
  max-width: 376px;
  margin: 35px auto 0;
}

@media screen and (max-width: 767px) {
  .smartorder .DeliveryDate .SeriesBlock {
    margin: 35px 50px 0;
  }
}
.smartorder .DeliveryDate .SeriesBlock li {
  display: inline-block;
}

.smartorder .DeliveryDate .SeriesBlock li .SeriesFukidashi {
  width: 120px;
  text-align: center;
  color: #FFF45E;
  font-size: 32px;
  font-weight: 700;
  text-align: center;
  padding: 14px 0 30px;
  background: url(../img/smartorder/Series-fukidashi.svg) top center/100% auto no-repeat;
  margin: 0 auto;
}

.smartorder .DeliveryDate .SeriesBlock li .SeriesFukidashi span {
  display: block;
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 10px;
  color: #FFF;
}

.smartorder .DeliveryDate .SeriesBlock li .SeriesFukidashi em {
  font-style: normal;
  font-size: 24px;
}

.smartorder .DeliveryDate .SeriesBlock li .SeriesFukidashi small {
  font-size: 20px;
}

.smartorder .DeliveryDate .SeriesBlock li .NoList {
  display: flex;
  justify-content: center;
}

@media screen and (max-width: 767px) {
  .smartorder .DeliveryDate .SeriesBlock li .NoList {
    flex-wrap: wrap;
    width: 93px;
    margin: 0 auto;
  }
}
.smartorder .DeliveryDate .SeriesBlock li .NoList li {
  min-width: 40px;
  padding: 5px 6px 6px;
  box-sizing: border-box;
  text-align: center;
  font-size: 18px;
  font-weight: 500;
  color: #FFF;
  background-color: #E08024;
  margin-right: 5px;
}

.smartorder .DeliveryDate .SeriesBlock li .NoList li:last-of-type {
  margin-right: 0;
}

.smartorder .DeliveryDate .SeriesBlock li .NoList li.blue {
  background-color: #3271AE;
}

.smartorder .DeliveryDate .SeriesBlock li .NoList li.purple {
  background-color: #925E8F;
}

.smartorder .DeliveryDate .SeriesBlock li .NoList li.pink {
  background-color: #DB5E94;
}

@media screen and (max-width: 767px) {
  .smartorder .DeliveryDate .SeriesBlock li .NoList li.pink {
    margin-top: 5px;
  }
}
.smartorder .DeliveryDate .SeriesBlock li .NoList li.green {
  background-color: #00A3A3;
}

@media screen and (max-width: 767px) {
  .smartorder .DeliveryDate .SeriesBlock li .NoList li.green {
    margin-top: 5px;
  }
}
.smartorder .DeliveryDate .SeriesBlock li .SeriesName {
  text-align: center;
  font-size: 15px;
  font-weight: 500;
  margin-top: 8px;
}

.smartorder .DeliveryDate .c-text {
  max-width: 500px;
  margin: 25px auto 0;
}

.smartorder .DeliveryDate .c-text .Series-noteTxt {
  text-align: left;
  font-size: 12px;
  line-height: 1.6;
  margin-left: 1em;
  text-indent: -1em;
}

@media screen and (max-width: 767px) {
  .smartorder .DeliveryDate .c-text .Series-noteTxt {
    margin: 25px 20px 1em;
  }
}
.smartorder .DeliveryDate .c-text .Series-noteTxt.mt0 {
  margin-top: 0;
}

.smartorder .DeliveryDate .btn-order {
  text-align: center;
}

.smartorder .DeliveryDate .btn-order a {
  display: inline-block;
  border-radius: 10px;
  border: 2px solid #00AEBB;
  padding: 10px 60px 10px 20px;
  color: #00AEBB;
  font-weight: 700;
  margin-top: 30px;
  position: relative;
  background-color: #FFF;
  transition: all 0.2s linear;
}

.smartorder .DeliveryDate .btn-order a:after {
  position: absolute;
  content: "";
  width: 24px;
  height: 24px;
  display: block;
  background: url(../img/index/index-arrow.svg) center center/100% 100% no-repeat;
  top: calc(50% - 12px);
  right: 20px;
}

.smartorder .DeliveryDate .btn-order a:hover {
  opacity: 0.6;
}

.smartorder .DeliveryDate .selectionArea {
  display: block;
}

.smartorder .DeliveryDate .selectionArea .calenderList {
  max-width: 774px;
  margin: 40px auto 0;
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .smartorder .DeliveryDate .selectionArea .calenderList {
    display: block;
  }
}
.smartorder .DeliveryDate .selectionArea .calenderList li {
  width: 48%;
}

@media screen and (max-width: 767px) {
  .smartorder .DeliveryDate .selectionArea .calenderList li {
    width: 100%;
  }
}
.smartorder .DeliveryDate .selectionArea .calenderList li .calender-note {
  font-size: 12px;
  margin-top: 10px;
  text-align: left;
}

@media screen and (max-width: 767px) {
  .smartorder .DeliveryDate .selectionArea .calenderList li .calender-note {
    line-height: 1.6;
  }
}
@media screen and (max-width: 767px) {
  .smartorder .DeliveryDate .selectionArea .calenderList li:nth-of-type(2) {
    margin-top: 20px;
  }
}
.smartorder .DeliveryDate .selectionArea .pdf-dl-btn {
  margin: 15px auto 0;
  max-width: 774px;
  padding-right: 28px;
  box-sizing: border-box;
  text-align: right;
}

@media screen and (max-width: 767px) {
  .smartorder .DeliveryDate .selectionArea .pdf-dl-btn {
    text-align: center;
  }
}
.smartorder .DeliveryDate .selectionArea .pdf-dl-btn a {
  display: inline-block;
  transition: all 0.2s linear;
  color: #000;
  font-weight: 700;
  font-size: 14px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .smartorder .DeliveryDate .selectionArea .pdf-dl-btn a {
    line-height: 1.6;
    text-align: left;
  }
}
.smartorder .DeliveryDate .selectionArea .pdf-dl-btn a:after {
  content: "";
  width: 20px;
  height: 20px;
  background: url(../img/index/news-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  right: -30px;
  top: -2px;
}

@media screen and (max-width: 767px) {
  .smartorder .DeliveryDate .selectionArea .pdf-dl-btn a:after {
    top: 12px;
  }
}
.smartorder .DeliveryDate .selectionArea .pdf-dl-btn a:hover {
  opacity: 0.5;
}

.smartorder .DeliveryDate .selectionArea .loginBtn {
  margin: 25px 0 15px;
  text-align: center;
}

.smartorder .DeliveryDate .selectionArea .loginBtn a {
  display: inline-block;
  padding: 15px 50px 15px 20px;
  font-size: 15px;
  font-weight: 700;
  position: relative;
  color: #000;
  background-color: #FFF45E;
  border: 2px solid #00AEBB;
  border-radius: 30px;
  transition: all 0.2s linear;
}

.smartorder .DeliveryDate .selectionArea .loginBtn a:after {
  content: "";
  width: 24px;
  height: 24px;
  background: url(../img/index/index-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  top: calc(50% - 12px);
  right: 15px;
}

.smartorder .DeliveryDate .selectionArea .loginBtn a:hover {
  transform: scale(1.05, 1.05);
  background-color: #FFF;
}

.smartorder .DeliveryDate .cabinetImgList {
  max-width: 904px;
  margin: 50px auto 0;
}

@media screen and (max-width: 767px) {
  .smartorder .DeliveryDate .cabinetImgList {
    margin: 40px 20px 0;
  }
}
.smartorder .Quality-Specifications {
  padding: 100px 0 80px;
}

@media screen and (max-width: 767px) {
  .smartorder .Quality-Specifications {
    padding: 80px 0 0;
  }
}
.smartorder .Quality-Specifications .Quality-SpecificationsWrap {
  max-width: 960px;
  margin: 0 auto;
}

@media screen and (max-width: 980px) {
  .smartorder .Quality-Specifications .Quality-SpecificationsWrap {
    padding: 0 20px;
  }
}
.smartorder .Quality-Specifications .Quality-SpecificationsWrap h2 {
  text-align: center;
  font-size: 32px;
  font-weight: 400;
  padding-bottom: 15px;
  padding-top: 30px;
  border-bottom: 1px solid #000;
}

.smartorder .Quality-Specifications .Quality-SpecificationsWrap h4 {
  font-size: 18px;
  font-weight: 700;
  color: #00AEBB;
}
@media screen and (max-width: 767px) {
  .smartorder .Quality-Specifications .Quality-SpecificationsWrap h4 {
    text-align: center;
  }
}

.smartorder .Quality-Specifications .Quality-SpecificationsWrap h4.mt {
  margin-top: 35px;
}

.smartorder .Quality-Specifications .Quality-SpecificationsWrap .txt01 {
  font-size: 14px;
  line-height: 1.6;
  margin-top: 15px;
}

.smartorder .Quality-Specifications .Quality-SpecificationsWrap .pdf-dl-btn {
  margin-top: 15px;
  text-align: left;
}

.smartorder .Quality-Specifications .Quality-SpecificationsWrap .pdf-dl-btn a {
  display: inline-block;
  transition: all 0.2s linear;
  color: #000;
  font-weight: 700;
  font-size: 14px;
  position: relative;
}

.smartorder .Quality-Specifications .Quality-SpecificationsWrap .pdf-dl-btn a:after {
  content: "";
  width: 20px;
  height: 20px;
  background: url(../img/index/news-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  right: -30px;
  top: 7px;
}

.smartorder .Quality-Specifications .Quality-SpecificationsWrap .pdf-dl-btn a:hover {
  opacity: 0.5;
}

.smartorder .Quality-Specifications .Quality-SpecificationsWrap .pdf-dl-btn a span {
  display: inline-block;
  width: 20px;
  position: relative;
  left: 4px;
  top: 6px;
}

.smartorder .Quality-Specifications .Quality-SpecificationsWrap .pdf-dl-btn.no-pdf {
  margin-top: 23px;
}

.smartorder .Quality-Specifications .Quality-SpecificationsWrap .pdf-dl-btn.no-pdf a:after {
  top: -2px;
}

.smartorder .Quality-Specifications .Quality-SpecificationsWrap .pdf-dlWrap {
  display: flex;
}

@media screen and (max-width: 910px) {
  .smartorder .Quality-Specifications .Quality-SpecificationsWrap .pdf-dlWrap {
    flex-wrap: wrap;
  }
}
@media screen and (max-width: 767px) {
  .smartorder .Quality-Specifications .Quality-SpecificationsWrap .pdf-dlWrap {
    display: block;
    text-align: center;
  }
}
.smartorder .Quality-Specifications .Quality-SpecificationsWrap .pdf-dlWrap .pdf-dl-btn {
  margin-right: 50px;
}

@media screen and (max-width: 767px) {
  .smartorder .Quality-Specifications .Quality-SpecificationsWrap .pdf-dlWrap .pdf-dl-btn {
    margin-right: 0;
    text-align: left;
    line-height: 1.4;
  }
}
.smartorder .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap {
  display: flex;
  margin-top: 40px;
}

@media screen and (max-width: 767px) {
  .smartorder .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap {
    display: block;
    margin-bottom: 40px;
  }
}
.smartorder .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .QualityLeft {
  max-width: 500px;
  margin-right: 50px;
}

@media screen and (max-width: 767px) {
  .smartorder .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .QualityLeft {
    margin-right: 0;
  }
}
.smartorder .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .QualityRight {
  width: 160px;
}

@media screen and (max-width: 767px) {
  .smartorder .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .QualityRight {
    margin: 20px auto 0;
  }
}
.smartorder .Quality-Specifications h3 {
  text-align: center;
  color: #1A96D5;
  font-size: 24px;
  margin-top: 90px;
  background: linear-gradient(#00AEBB, #1A96D5);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.smartorder .Quality-Specifications h3 em {
  font-style: normal;
}

@media screen and (max-width: 767px) {
  .smartorder .Quality-Specifications h3 {
    line-height: 1.6;
  }
}
.smartorder .Quality-Specifications .SystemArea {
  margin-top: 35px;
  border: 5px solid #B5E7EB;
  padding: 50px;
}

@media screen and (max-width: 840px) {
  .smartorder .Quality-Specifications .SystemArea {
    padding: 35px;
  }
}
@media screen and (max-width: 767px) {
  .smartorder .Quality-Specifications .SystemArea {
    padding: 30px 20px;
  }
}
.smartorder .Quality-Specifications .SystemArea .cabistaWrap {
  max-width: 514px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@media screen and (max-width: 767px) {
  .smartorder .Quality-Specifications .SystemArea .cabistaWrap {
    display: block;
  }
}
.smartorder .Quality-Specifications .SystemArea .cabistaWrap .cabistaImg01 {
  width: 24.5%;
}

@media screen and (max-width: 767px) {
  .smartorder .Quality-Specifications .SystemArea .cabistaWrap .cabistaImg01 {
    width: 126px;
    margin: 0 auto;
  }
}
.smartorder .Quality-Specifications .SystemArea .cabistaWrap .cabistaImg02 {
  width: 65.2%;
}

@media screen and (max-width: 767px) {
  .smartorder .Quality-Specifications .SystemArea .cabistaWrap .cabistaImg02 {
    width: 96%;
    margin: 20px auto 0;
  }
}
.smartorder .Quality-Specifications .SystemArea h4 {
  font-size: 20px;
  font-weight: 700;
  color: #000;
  text-align: center;
  margin-top: 30px;
}

@media screen and (max-width: 767px) {
  .smartorder .Quality-Specifications .SystemArea h4 {
    line-height: 1.6;
  }
}
.smartorder .Quality-Specifications .SystemArea .cabistaSystemTxt {
  font-size: 15px;
  line-height: 1.7;
  margin-top: 30px;
  padding: 0 52px;
}

@media screen and (max-width: 767px) {
  .smartorder .Quality-Specifications .SystemArea .cabistaSystemTxt {
    padding: 0;
  }
}
.smartorder .Quality-Specifications .SystemArea .CabistaBtn {
  margin-top: 30px;
  text-align: center;
}

.smartorder .Quality-Specifications .SystemArea .CabistaBtn a {
  background: linear-gradient(90deg, rgb(0, 174, 187) 0%, rgb(26, 150, 213) 100%);
  display: inline-block;
  color: #FFF;
  padding: 20px 55px 20px 25px;
  position: relative;
  border-radius: 30px;
  transition: all 0.2s linear;
}

.smartorder .Quality-Specifications .SystemArea .CabistaBtn a:after {
  content: "";
  width: 24px;
  height: 24px;
  position: absolute;
  right: 20px;
  top: calc(50% - 12px);
  background: url(../img/smartorder/cabista-arrow.svg) center center/100% 100% no-repeat;
}

.smartorder .Quality-Specifications .SystemArea .CabistaBtn a:hover {
  opacity: 0.5;
}

.smartorder .Quality-Specifications .SystemArea .CabistaFukidashi {
  width: 480px;
  height: 83px;
  background: url(../img/smartorder/HoleProcessing-fukidashi.svg) top left/100% auto no-repeat;
  box-sizing: border-box;
  font-size: 22px;
  font-weight: 700;
  padding: 18px 0 0 46px;
  margin: 70px auto 0;
  position: relative;
}

@media screen and (max-width: 980px) {
  .smartorder .Quality-Specifications .SystemArea .CabistaFukidashi {
    width: 100%;
    font-size: 18px;
  }
  .smartorder .Quality-Specifications .SystemArea .CabistaFukidashi.smart {
    width: 480px;
  }
}
@media screen and (max-width: 980px) and (max-width: 980px) {
  .smartorder .Quality-Specifications .SystemArea .CabistaFukidashi.smart {
    width: 100%;
  }
}
@media screen and (max-width: 840px) {
  .smartorder .Quality-Specifications .SystemArea .CabistaFukidashi {
    font-size: 17px;
    padding: 14px 0 0 15px;
  }
}
@media screen and (max-width: 767px) {
  .smartorder .Quality-Specifications .SystemArea .CabistaFukidashi {
    font-size: 16px;
    padding: 18px 0 32px 20px;
    width: 100%;
    height: auto;
    background: url(../img/smartorder/SP-HoleProcessing-fukidashi.svg) top left/100% auto no-repeat;
  }
}
.smartorder .Quality-Specifications .SystemArea .CabistaFukidashi .img {
  width: 156px;
  position: absolute;
  right: 60px;
  top: -14px;
}

@media screen and (max-width: 980px) {
  .smartorder .Quality-Specifications .SystemArea .CabistaFukidashi .img {
    width: 120px;
  }
}
@media screen and (max-width: 840px) {
  .smartorder .Quality-Specifications .SystemArea .CabistaFukidashi .img {
    width: 100px;
  }
}
@media screen and (max-width: 767px) {
  .smartorder .Quality-Specifications .SystemArea .CabistaFukidashi .img {
    right: 5px;
  }
}
.smartorder .Quality-Specifications .SystemArea .HoleProcessing {
  width: 100%;
  margin-top: 10px;
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .smartorder .Quality-Specifications .SystemArea .HoleProcessing {
    display: block;
  }
}
.smartorder .Quality-Specifications .SystemArea .HoleProcessing li {
  width: 49.4%;
  border: 2px solid #1D1D1D;
  background-color: #1A96D5;
  position: relative;
}

@media screen and (max-width: 767px) {
  .smartorder .Quality-Specifications .SystemArea .HoleProcessing li {
    width: 100%;
  }
}
.smartorder .Quality-Specifications .SystemArea .HoleProcessing li .TitleTxt {
  text-align: center;
  background-color: #1D1D1D;
  font-size: 14px;
  color: #FFF;
  padding: 10px 0;
}

@media screen and (max-width: 767px) {
  .smartorder .Quality-Specifications .SystemArea .HoleProcessing li:nth-of-type(2) {
    margin-top: 20px;
  }
}
.smartorder .Quality-Specifications .SystemArea .HoleProcessing li .inpdd {
  color: #FFF;
  padding: 35px 0 30px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

.smartorder .Quality-Specifications .SystemArea .HoleProcessing li .inpdd h4 {
  color: #FFF;
  font-size: 28px;
  font-weight: 900;
  width: 100%;
  margin: 0;
}

.smartorder .Quality-Specifications .SystemArea .HoleProcessing li .inpdd .Hole-p-txt {
  font-size: 15px;
  line-height: 1.4;
  margin-top: 20px;
  display: inline-block;
}

.smartorder .Quality-Specifications .SystemArea .HoleProcessing li .inpdd .Hole-p-txt span {
  opacity: 0.6;
}

.smartorder .Quality-Specifications .SystemArea .HoleProcessing li .HoleProcessingArrow {
  width: 24px;
  height: 24px;
  position: absolute;
  right: 20px;
  bottom: 20px;
}

.smartorder .Quality-Specifications .SystemArea .HoleProcessing li a {
  transition: all 0.2s linear;
}

.smartorder .Quality-Specifications .SystemArea .HoleProcessing li a:hover {
  opacity: 0.5;
}

.smartorder .Quality-Specifications .SystemArea .HoleProcessing li:last-of-type {
  background-color: #3F82DE;
}

.smartorder .Quality-Specifications .btn-txt {
  margin-top: 50px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .smartorder .Quality-Specifications .btn-txt {
    line-height: 1.5;
  }
}
.smartorder .Quality-Specifications .loginBtn {
  margin-top: 15px;
  text-align: center;
}

.smartorder .Quality-Specifications .loginBtn a {
  display: inline-block;
  padding: 15px 50px 15px 20px;
  font-size: 15px;
  font-weight: 700;
  position: relative;
  color: #000;
  background-color: #FFF45E;
  border: 2px solid #00AEBB;
  border-radius: 30px;
  transition: all 0.2s linear;
}

.smartorder .Quality-Specifications .loginBtn a span {
  font-size: 14px;
  font-weight: 400;
}

.smartorder .Quality-Specifications .loginBtn a:after {
  content: "";
  width: 24px;
  height: 24px;
  background: url(../img/index/index-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  top: calc(50% - 12px);
  right: 15px;
}

.smartorder .Quality-Specifications .loginBtn a:hover {
  transform: scale(1.05, 1.05);
  background-color: #FFF;
}

.smartorder {
  /*//////////////////////////////////////////////////////////////////////////////////*/
}

.smartorder .selectionArea {
  border: 4px solid #80D6DE;
  padding: 10px 40px 25px;
  display: flex;
  justify-content: space-between;
  margin-top: 40px;
}

@media screen and (max-width: 980px) {
  .smartorder .selectionArea {
    padding: 10px 25px 25px;
    margin: 40px 20px 0;
  }
}
@media screen and (max-width: 767px) {
  .smartorder .selectionArea {
    border: 3px solid #80D6DE;
    padding: 40px 20px 25px;
    margin: 40px 20px 0;
    display: block;
  }
}
.smartorder .selectionArea dt {
  width: 48.2%;
}

@media screen and (max-width: 767px) {
  .smartorder .selectionArea dt {
    width: 100%;
  }
}
.smartorder .selectionArea dt {
  text-align: left;
}

.smartorder .selectionArea dt .selectionTitle {
  margin: 35px 0 0;
  font-size: 18px;
  color: #000;
}

@media screen and (max-width: 980px) {
  .smartorder .selectionArea dt .selectionTitle {
    line-height: 1.4;
  }
}
@media screen and (max-width: 767px) {
  .smartorder .selectionArea dt .selectionTitle {
    margin: 0;
  }
}
.smartorder .selectionArea dt p {
  font-size: 15px;
  line-height: 1.7;
  margin-top: 20px;
}

.smartorder .selectionArea dt .loginBtn {
  margin-top: 30px;
  text-align: left;
}

@media screen and (max-width: 767px) {
  .smartorder .selectionArea dt .loginBtn {
    text-align: center;
  }
}
.smartorder .selectionArea dt .loginBtn a {
  display: inline-block;
  padding: 15px 50px 15px 20px;
  font-size: 15px;
  font-weight: 700;
  position: relative;
  color: #000;
  background-color: #FFF45E;
  border: 2px solid #00AEBB;
  border-radius: 30px;
  transition: all 0.2s linear;
}

@media screen and (max-width: 767px) {
  .smartorder .selectionArea dt .loginBtn a {
    text-align: left;
    line-height: 1.4;
  }
}
.smartorder .selectionArea dt .loginBtn a span {
  font-size: 14px;
  font-weight: 400;
}

.smartorder .selectionArea dt .loginBtn a:after {
  content: "";
  width: 24px;
  height: 24px;
  background: url(../img/index/index-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  top: calc(50% - 12px);
  right: 15px;
}

.smartorder .selectionArea dt .loginBtn a:hover {
  transform: scale(1.05, 1.05);
  background-color: #FFF;
}

.smartorder .selectionArea dd {
  width: 43.3%;
}

@media screen and (max-width: 767px) {
  .smartorder .selectionArea dd {
    width: 100%;
    margin-top: 15px;
  }
}
.smartorder .selectionArea .Confirmation-DeliveryDates {
  font-size: 18px;
  margin: 20px 0 0;
  font-weight: 700;
  text-align: center;
  color: #000;
}

@media screen and (max-width: 900px) {
  .smartorder .selectionArea .Confirmation-DeliveryDates {
    line-height: 1.8;
    margin: 0;
    text-align: left;
  }
}
.smartorder .selectionArea .Confirmation-DeliveryDates .red {
  color: #FF205F;
}

.smartorder .selectionArea .Confirmation-DeliveryDates .UL {
  text-decoration: underline;
  text-underline-offset: 8px;
}

@media screen and (max-width: 767px) {
  .smartorder .selectionArea .Confirmation-DeliveryDates .UL {
    text-underline-offset: 5px;
  }
}
/*////////////////////////// SMARTORDER SEARCH ////////////////////////*/
main.smartorder.search.menusearch {
  margin-top: 84px;
}

main.smartorder.search.menusearch .MethodBox {
  margin-bottom: 40px;
}

main.smartorder.search.menusearch .MethodBox p {
  line-height: 1.8;
  font-size: 16px;
  color: #00AEBB;
  font-weight: 500;
}

main.smartorder.search.menusearch .MethodBox p small {
  font-size: 0.8em;
  position: relative;
  top: -4px;
}

@media screen and (max-width: 767px) {
  .smartorder.search {
    margin-top: 52px;
  }
  .smartorder.search.menusearch .loginBtn {
    margin-bottom: 40px;
  }
}
.smartorder.search .serchBlock {
  width: 640px;
  margin: 40px auto 0;
}

@media screen and (max-width: 767px) {
  .smartorder.search .serchBlock {
    width: calc(100% - 40px);
  }
}
.smartorder.search .serchBlock h2 {
  font-size: 24px;
  font-weight: 700;
}

.smartorder.search .serchBlock h2 span {
  color: #80D6DE;
}

.smartorder.search .serchBlock em {
  font-style: normal;
  text-align: right;
  width: 100%;
  display: block;
}

@media screen and (max-width: 767px) {
  .smartorder.search .serchBlock em {
    margin-top: 15px;
  }
}
.smartorder.search .serchBlock em a {
  font-size: 14px;
  transition: all 0.2s;
  display: inline-block;
  color: #000;
  font-weight: 700;
  position: relative;
  padding-right: 25px;
}

.smartorder.search .serchBlock em a:after {
  width: 20px;
  height: 20px;
  content: "";
  background: url(../img/index/news-arrow.svg) center center/100% 100% no-repeat;
  display: block;
  position: absolute;
  right: 0px;
  top: calc(50% - 10px);
}

.smartorder.search .serchBlock em a:hover {
  opacity: 0.6;
}

.smartorder.search .serchBlock .spinner {
  border-top-color: #3498db;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
.smartorder.search .serchBlock .dimensionsWrap {
  display: flex;
  justify-content: space-between;
  margin-top: 20px;
}

@media screen and (max-width: 767px) {
  .smartorder.search .serchBlock .dimensionsWrap {
    display: block;
  }
}
.smartorder.search .serchBlock .dimensionsWrap div {
  width: 31%;
}

@media screen and (max-width: 767px) {
  .smartorder.search .serchBlock .dimensionsWrap div {
    width: 80%;
    margin: 0 auto 15px;
  }
  .smartorder.search .serchBlock .dimensionsWrap div:last-of-type {
    margin-bottom: 0;
  }
}
.smartorder.search .serchBlock .dimensionsWrap .label {
  font-weight: 500;
  display: block;
}

.smartorder.search .serchBlock .dimensionsWrap .label small {
  font-size: 0.7em;
  margin-left: 0.5em;
}

.smartorder.search .serchBlock .dimensionsWrap .select {
  width: 100%;
  border: 2px solid #B6B6B6;
  border-radius: 4px;
  padding: 10px 12px;
  font-size: 15px;
  margin-top: 10px;
  color: #333;
}

.smartorder.search .text-xs {
  font-size: 12px;
  margin-top: 15px;
  padding-bottom: 20px;
  border-bottom: 1px solid #EBEBEB;
  margin-bottom: 25px;
}

.smartorder.search .Series-Block {
  margin: 20px auto 0;
  text-align: left;
  max-width: 660px;
}

.smartorder.search .Series-Block .flex-wrap {
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .smartorder.search .Series-Block .flex-wrap {
    flex-wrap: wrap;
    justify-content: flex-start;
  }
}
.smartorder.search .Series-Block .LinkBtn {
  margin-left: 25px;
}

.smartorder.search .Series-Block .LinkBtn a {
  display: inline-block;
  padding: 10px 10px 10px 20px;
  border: 1px solid #00AEBB;
  color: #00AEBB;
  border-radius: 30px;
  font-size: 13px;
  text-decoration: none;
  transition: all 0.2s linear;
}

.smartorder.search .Series-Block .LinkBtn a:hover {
  color: #FFF;
  background-color: #00AEBB;
}

.smartorder.search button {
  cursor: pointer;
  padding: 10px 0 0;
  border-radius: 4px;
  font-size: 20px;
  font-weight: 700;
  color: #FFF;
  width: 18.8%;
  border: none;
  transition: all 0.2s linear;
}

.smartorder.search button:hover {
  transform: scale(1.05);
}

.smartorder.search button:disabled {
  pointer-events: none;
}

@media screen and (max-width: 767px) {
  .smartorder.search button {
    width: 31%;
    margin-right: 3.5%;
    margin-top: 15px;
  }
  .smartorder.search button:nth-of-type(3n) {
    margin-right: 0;
  }
}
.smartorder.search button p {
  pointer-events: none;
  font-size: 11px;
  font-weight: 400;
  padding: 7px 0 6px;
  border-bottom: 1px dotted #FFF;
}

.smartorder.search button p small {
  position: relative;
  top: -4px;
}

.smartorder.search button p:last-of-type {
  border-bottom: none;
}

.smartorder.search button.ra {
  background-color: #E08024;
}

.smartorder.search button.e {
  background-color: #3271AE;
}

.smartorder.search button.oe {
  background-color: #925E8F;
}

.smartorder.search button.soe {
  background-color: #DB5E94;
}

.smartorder.search button.bj {
  background-color: #00A3A3;
}

.smartorder.search button.single {
  font-size: 20px;
  border: 2px solid #00AEBB;
  color: #00AEBB;
  padding: 10px 30px;
  border-radius: 30px;
  margin-top: 20px;
  margin-right: 20px;
  background-color: #E6F7F8;
}

@media screen and (max-width: 767px) {
  .smartorder.search button.single {
    width: 40%;
  }
}
.smartorder.search button.single:disabled {
  border: 2px solid #DDD;
  background-color: #DDD;
  color: #FFF;
}

.smartorder.search button.double {
  font-size: 20px;
  border: 2px solid #00AEBB;
  color: #00AEBB;
  padding: 10px 30px;
  border-radius: 30px;
  margin-top: 20px;
  background-color: #E6F7F8;
}

@media screen and (max-width: 767px) {
  .smartorder.search button.double {
    width: 40%;
  }
}
.smartorder.search button.double:disabled {
  border: 2px solid #DDD;
  background-color: #DDD;
  color: #FFF;
}

.smartorder.search button.btn-reset {
  color: #FFF;
  font-size: 13px;
  font-weight: 700;
  padding: 12px 20px;
  background-color: #6A6A6A;
  margin-left: auto;
  border: none;
  border-radius: 25px;
}

.smartorder.search button:disabled {
  background-color: #D9D9D9;
  opacity: 0.9;
  cursor: default;
}

.smartorder.search .Series-Block {
  padding-bottom: 20px;
  border-bottom: 1px solid #EBEBEB;
  margin-bottom: 25px;
}

.smartorder.search .Series-Block .search-note {
  font-size: 12px;
  margin-top: 10px;
  text-align: right;
}

.smartorder.search .reset {
  text-align: right;
  margin-top: 20px;
}

.smartorder.search .result {
  background-color: #F7F7F7;
  padding: 40px 0;
  margin: 40px auto 0;
  max-width: 950px;
}

@media screen and (max-width: 767px) {
  .smartorder.search .result {
    padding: 30px 20px;
  }
}
.smartorder.search .result.hidden {
  display: block;
}

.smartorder.search .result .resultWrap {
  width: 540px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .smartorder.search .result .resultWrap {
    width: 100%;
    display: block;
  }
}
.smartorder.search .result .resultWrap .wrap {
  width: 44.5%;
}

@media screen and (max-width: 767px) {
  .smartorder.search .result .resultWrap .wrap {
    margin: 0 auto;
    width: 80%;
  }
}
.smartorder.search .result .resultWrap .wrap h3 {
  font-size: 22px;
  padding-bottom: 10px;
  border-bottom: 2px solid #000;
}

.smartorder.search .result .resultWrap .wrap h3 small {
  font-size: 0.6em;
  font-weight: 500;
  position: relative;
  top: -9px;
}

.smartorder.search .result .resultWrap .wrap h3 span {
  font-size: 0.7em;
  margin-left: 0.25em;
  font-weight: 500;
}

.smartorder.search .result .resultWrap .wrap .smallTxt {
  font-size: 12px;
  margin-top: 10px;
}

.smartorder.search .result .resultWrap .wrap .price {
  text-align: right;
  font-size: 32px;
  font-weight: 700;
  color: #FF205F;
  margin-top: 15px;
  background-color: transparent;
  padding-bottom: 0;
}

@media screen and (max-width: 767px) {
  .smartorder.search .result .resultWrap .wrap .price {
    margin: 0 0 10px;
  }
}
.smartorder.search .result .resultWrap .wrap dl {
  margin-top: 10px;
  flex-wrap: wrap;
  line-height: 2;
  display: flex;
  border-bottom: 1px solid #4C4948;
}

.smartorder.search .result .resultWrap .wrap dl dt {
  width: 62.5%;
  margin-bottom: 5px;
}

.smartorder.search .result .resultWrap .wrap dl dd {
  width: 37.5%;
  text-align: right;
  margin-bottom: 5px;
}

.smartorder.search .result .resultWrap .wrap #result-weight-total {
  text-align: right;
  font-size: 20px;
  font-weight: 700;
  margin-top: 10px;
}

.smartorder.search .result .text {
  width: 540px;
  margin: 30px auto 0;
  text-align: center;
  font-size: 12px;
}

@media screen and (max-width: 767px) {
  .smartorder.search .result .text {
    padding: 0 20px;
    box-sizing: border-box;
    width: 100%;
    margin-left: 1em;
    text-indent: -1em;
    text-align: left;
  }
}
.smartorder.search .Min-configuration {
  width: 770px;
  margin: 50px auto 0;
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .smartorder.search .Min-configuration {
    width: 100%;
    display: block;
    margin: 40px auto 0;
    box-sizing: border-box;
    padding: 0 20px;
  }
}
.smartorder.search .Min-configuration .glaf-table {
  width: 50%;
}

@media screen and (max-width: 767px) {
  .smartorder.search .Min-configuration .glaf-table {
    width: 100%;
  }
}
.smartorder.search .Min-configuration .glaf-table h3 {
  font-weight: 700;
}

.smartorder.search .Min-configuration .glaf-table h3 small {
  position: relative;
  top: -6px;
  font-size: 0.7em;
}

.smartorder.search .Min-configuration table {
  margin-top: 10px;
  width: 100%;
  border-bottom: 1px solid #4C4948;
}

.smartorder.search .Min-configuration table tr:first-of-type th {
  border-right: 1px solid #4C4948;
}

.smartorder.search .Min-configuration table tr:first-of-type th:last-of-type {
  border-right: none;
}

.smartorder.search .Min-configuration table tr th {
  background-color: #EBEBEB;
  padding: 6px 10px;
  font-size: 15px;
  font-weight: 500;
  text-align: left;
  border-top: 1px solid #4C4948;
}

@media screen and (max-width: 767px) {
  .smartorder.search .Min-configuration table tr th {
    font-size: 13px;
    line-height: 1.25;
  }
}
.smartorder.search .Min-configuration table tr th.RA {
  color: #E08024;
  font-size: 16px;
  font-weight: 700;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .smartorder.search .Min-configuration table tr th.RA {
    font-size: 14px;
  }
}
.smartorder.search .Min-configuration table tr th.E {
  color: #3271AE;
  font-size: 16px;
  font-weight: 700;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .smartorder.search .Min-configuration table tr th.E {
    font-size: 14px;
  }
}
.smartorder.search .Min-configuration table tr th.OE {
  color: #925E8F;
  font-size: 16px;
  font-weight: 700;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .smartorder.search .Min-configuration table tr th.OE {
    font-size: 14px;
  }
}
.smartorder.search .Min-configuration table tr th.SOE {
  color: #DB5E94;
  font-size: 16px;
  font-weight: 700;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .smartorder.search .Min-configuration table tr th.SOE {
    font-size: 14px;
  }
}
.smartorder.search .Min-configuration table tr th.BJ {
  color: #00A3A3;
  font-size: 16px;
  font-weight: 700;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .smartorder.search .Min-configuration table tr th.BJ {
    font-size: 14px;
  }
}
.smartorder.search .Min-configuration table tr td {
  padding: 6px 10px;
  border-top: 1px solid #4C4948;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .smartorder.search .Min-configuration table tr td {
    padding: 6px 8px;
  }
}
.smartorder.search .Min-configuration table tr td:nth-of-type(2n) {
  background-color: #F7F7F7;
}

.smartorder.search .Min-configuration .note {
  width: 44%;
  font-size: 12px;
  line-height: 1.6;
  margin-left: 1em;
  text-indent: -1em;
}

@media screen and (max-width: 767px) {
  .smartorder.search .Min-configuration .note {
    width: 100%;
    margin-top: 15px;
  }
}
.smartorder.search .search-linkArea {
  display: flex;
  justify-content: center;
  margin-top: 40px;
}

@media screen and (max-width: 767px) {
  .smartorder.search .search-linkArea {
    display: block;
    padding: 0 20px;
    text-align: center;
  }
}
.smartorder.search .search-linkArea li {
  display: inline-block;
}

.smartorder.search .search-linkArea li:first-of-type {
  margin-right: 30px;
}

@media screen and (max-width: 767px) {
  .smartorder.search .search-linkArea li:first-of-type {
    margin-right: 0;
  }
}
.smartorder.search .search-linkArea li a {
  display: inline-block;
  border-radius: 10px;
  border: 2px solid #00AEBB;
  padding: 10px 60px 10px 20px;
  color: #00AEBB;
  font-weight: 700;
  margin-top: 40px;
  position: relative;
  transition: all 0.2s linear;
}

@media screen and (max-width: 767px) {
  .smartorder.search .search-linkArea li a {
    line-height: 1.4;
    margin-top: 20px;
  }
}
.smartorder.search .search-linkArea li a:after {
  position: absolute;
  content: "";
  width: 24px;
  height: 24px;
  display: block;
  background: url(../img/index/index-arrow.svg) center center/100% 100% no-repeat;
  top: calc(50% - 12px);
  right: 20px;
}

.smartorder.search .search-linkArea li a:hover {
  opacity: 0.6;
}

.smartorder.search .error-message {
  font-weight: 700;
  font-size: 16px;
}

.block {
  display: block;
  margin-top: 15px;
  font-size: 13px;
  font-weight: 400;
  color: #E08024;
  margin-bottom: 20px;
}

/*////////////////////////////// Compatible with integration /////////////////////////////////////*/
.CooperationArea {
  padding: 95px 0;
  background-color: #E8F4FB;
}

.CooperationArea .CooperationWrap {
  max-width: 800px;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap {
    padding: 0 20px;
  }
}
.CooperationArea .CooperationWrap h2 {
  font-size: 36px;
  font-weight: 700;
  color: #1A96D5;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap h2 {
    line-height: 1.6;
  }
}
.CooperationArea .CooperationWrap .note-list {
  max-width: 350px;
  margin: 25px auto 0;
  display: flex;
  justify-content: space-between;
}

.CooperationArea .CooperationWrap .note-list li {
  width: 31.4%;
  padding: 8px;
  background-color: #FFF;
  color: #1A96D5;
  border: 2px solid #1A96D5;
  border-radius: 30px;
  text-align: center;
  font-weight: 500;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .note-list li {
    font-size: 15px;
  }
}
.CooperationArea .CooperationWrap .Cooperation-txt {
  margin-top: 35px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .Cooperation-txt {
    line-height: 1.6;
  }
}
.CooperationArea .CooperationWrap .smart-o-note {
  max-width: 730px;
  margin: 20px auto 0;
  padding: 5px;
  background-color: #FFF;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
}

@media screen and (max-width: 820px) {
  .CooperationArea .CooperationWrap .smart-o-note {
    max-width: 680px;
    font-size: 11px;
  }
}
@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .smart-o-note {
    display: none;
  }
}
.CooperationArea .CooperationWrap .smart-o-note span {
  font-weight: 400;
}

.CooperationArea .CooperationWrap .smart-o-note span a {
  text-decoration: underline;
  color: #0000EE;
}

.CooperationArea .CooperationWrap .smart-o-note span a:hover {
  color: #666;
}

.CooperationArea .CooperationWrap .SP-smart-o-note {
  display: none;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .SP-smart-o-note {
    display: flex;
    flex-wrap: wrap;
    margin: 20px auto 0;
    padding: 7px;
    background-color: #FFF;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.6;
    text-align: left;
  }
  .CooperationArea .CooperationWrap .SP-smart-o-note dt {
    width: 9em;
  }
  .CooperationArea .CooperationWrap .SP-smart-o-note dd {
    width: calc(100% - 9em);
  }
  .CooperationArea .CooperationWrap .SP-smart-o-note dd span {
    font-weight: 400;
  }
  .CooperationArea .CooperationWrap .SP-smart-o-note dd span a {
    text-decoration: underline;
  }
  .CooperationArea .CooperationWrap .SP-smart-o-note dd span a:hover {
    color: #1B96D5;
  }
}
.CooperationArea .CooperationWrap .Data-Integration {
  display: flex;
  justify-content: space-between;
  max-width: 730px;
  margin: 35px auto 0;
}

@media screen and (max-width: 820px) {
  .CooperationArea .CooperationWrap .Data-Integration {
    max-width: 680px;
  }
}
@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .Data-Integration {
    display: block;
  }
}
.CooperationArea .CooperationWrap .Data-Integration li {
  width: 46.6%;
  position: relative;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .Data-Integration li {
    width: 100%;
  }
}
.CooperationArea .CooperationWrap .Data-Integration li .Integration-title {
  text-align: center;
  font-size: 14px;
  margin-bottom: 10px;
}

.CooperationArea .CooperationWrap .Data-Integration li:first-of-type {
  margin-bottom: 50px;
}

.CooperationArea .CooperationWrap .Data-Integration li:first-of-type:after {
  content: "";
  display: block;
  width: 42px;
  height: 41px;
  background: url(../img/index/blue-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  top: 50%;
  right: -42px;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .Data-Integration li:first-of-type:after {
    transform: rotate(90deg);
    top: 100%;
    right: calc(50% - 20px);
  }
}
.CooperationArea .CooperationWrap .photo-note {
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  margin-top: 15px;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .photo-note {
    line-height: 1.6;
  }
}
.CooperationArea .CooperationWrap .cadBlock {
  width: 730px;
  margin: 45px auto 0;
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 820px) {
  .CooperationArea .CooperationWrap .cadBlock {
    max-width: 680px;
  }
}
@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .cadBlock {
    width: 100%;
    display: block;
  }
}
.CooperationArea .CooperationWrap .cadBlock .cadBox {
  width: 46.6%;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .cadBlock .cadBox {
    width: 100%;
  }
  .CooperationArea .CooperationWrap .cadBlock .cadBox:nth-of-type(2) {
    margin-top: 40px;
  }
}
.CooperationArea .CooperationWrap .cadBlock .cadBox h3 {
  color: #1A96D5;
  font-size: 28px;
  font-weight: 700;
  display: flex;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .cadBlock .cadBox h3 {
    text-align: center;
    display: block;
  }
}
.CooperationArea .CooperationWrap .cadBlock .cadBox h3 figure {
  display: block;
  width: 230px;
  margin-left: 10px;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .cadBlock .cadBox h3 figure {
    margin: 10px 0 0;
  }
}
.CooperationArea .CooperationWrap .cadBlock .cadBox .txt {
  margin-top: 10px;
  line-height: 1.7;
  font-size: 15px;
}

.CooperationArea .CooperationWrap .cadBlock .cadBox .txt a {
  text-decoration: underline;
}

.CooperationArea .CooperationWrap .cadBlock .cadBox .sm-txt {
  font-size: 12px;
  line-height: 1.6;
  margin-top: 10px;
  margin-left: 1em;
  text-indent: -1em;
}

.CooperationArea .CooperationWrap .cadBlock .cadBox .sm-txt a {
  text-decoration: underline;
}

.CooperationArea .CooperationWrap .cadBlock .cadBox .pdf-dl-btn {
  margin-top: 15px;
  text-align: left;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .cadBlock .cadBox .pdf-dl-btn {
    text-align: center;
    margin-right: 30px;
  }
}
.CooperationArea .CooperationWrap .cadBlock .cadBox .pdf-dl-btn a {
  display: inline-block;
  transition: all 0.2s linear;
  color: #000;
  font-weight: 700;
  font-size: 14px;
  position: relative;
}

.CooperationArea .CooperationWrap .cadBlock .cadBox .pdf-dl-btn a span {
  display: inline-block;
  width: 20px;
  position: relative;
  left: 4px;
  top: 5px;
}

.CooperationArea .CooperationWrap .cadBlock .cadBox .pdf-dl-btn a:hover {
  opacity: 0.6;
}

.CooperationArea .CooperationWrap .cadBlock .cadBox .pdf-dl-btn a:after {
  content: "";
  width: 20px;
  height: 20px;
  background: url(../img/index/news-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  right: -30px;
  top: -2px;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .cadBlock .cadBox .pdf-dl-btn a:after {
    top: 5px;
  }
}
.CooperationArea .CooperationWrap .cadBlock .cadBox .pdf-dl-btn a.dl:after {
  top: 7px;
}

.CooperationArea .CooperationWrap .w-window {
  background-color: #FFF;
  margin: 50px auto 0;
  padding: 35px 55px;
  border-radius: 8px;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .w-window {
    padding: 25px 20px;
    margin: 40px auto 0;
  }
}
.CooperationArea .CooperationWrap .w-window .SP-title {
  display: none;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .w-window .SP-title {
    display: block;
    text-align: center;
    margin-top: 25px;
  }
}
.CooperationArea .CooperationWrap .w-window h2 {
  font-size: 20px;
  text-align: center;
  padding-bottom: 10px;
  border-bottom: 1px solid #D9D9D9;
  margin: 0;
  color: #000;
}

.CooperationArea .CooperationWrap .w-window h2 span {
  color: #FF205F;
  font-size: 20px;
  bottom: 0;
  margin: 0;
}

.CooperationArea .CooperationWrap .w-window .SP-titleList {
  display: none;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .w-window .SP-titleList {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
  }
  .CooperationArea .CooperationWrap .w-window .SP-titleList li {
    width: 48%;
    text-align: center;
    font-size: 16px;
    color: #000;
    font-weight: 400;
  }
  .CooperationArea .CooperationWrap .w-window .SP-titleList li:last-of-type {
    color: #1A96D5;
  }
}
.CooperationArea .CooperationWrap .w-window dl {
  margin-top: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.CooperationArea .CooperationWrap .w-window dl:nth-of-type(2) {
  margin-top: 10px;
}

.CooperationArea .CooperationWrap .w-window dl:nth-of-type(3) {
  margin-top: 10px;
}

.CooperationArea .CooperationWrap .w-window dl dt {
  width: 12.2%;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .w-window dl dt {
    display: none;
  }
}
.CooperationArea .CooperationWrap .w-window dl dd {
  width: 37.7%;
  padding: 12px;
  text-align: center;
  position: relative;
  background-color: #EBEBEB;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .w-window dl dd {
    width: 46%;
    font-size: 14px;
    line-height: 1.5;
  }
}
.CooperationArea .CooperationWrap .w-window dl dd:nth-of-type(2) {
  background-color: #D1EAF7;
}

.CooperationArea .CooperationWrap .w-window dl dd:first-of-type:after {
  content: "";
  width: 16px;
  height: 16px;
  display: block;
  background: url(../img/index/cad-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  top: calc(50% - 8px);
  right: -30px;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .w-window dl dd:first-of-type:after {
    right: -19px;
  }
}
.CooperationArea .CooperationWrap .w-window dl dd span {
  font-size: 0.8em;
  display: block;
  margin-top: 8px;
}

.CooperationArea .CooperationWrap .w-window dl dd em {
  font-style: normal;
  font-weight: 700;
  color: #FF205F;
}

.CooperationArea .CooperationWrap .w-window dl:first-of-type dd {
  padding: 0;
  background-color: transparent;
}

.CooperationArea .CooperationWrap .w-window dl:first-of-type dd:last-of-type {
  color: #1A96D5;
}

.CooperationArea .CooperationWrap .w-window dl:first-of-type dd:after {
  display: none;
}

.CooperationArea .CooperationWrap .w-window .cad-note {
  font-size: 12px;
  line-height: 1.6;
  margin-top: 25px;
}

.CooperationArea .CooperationWrap .w-window .cad-note li {
  margin-left: 1em;
  text-indent: -1em;
}

.CooperationArea .CooperationWrap .red-txt {
  color: #FF205F;
  margin-top: 45px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .red-txt {
    line-height: 1.6;
  }
}
.CooperationArea .CooperationWrap .cad-txt {
  text-align: center;
  font-size: 12px;
  margin-top: 15px;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .cad-txt {
    line-height: 1.6;
  }
}
.CooperationArea .CooperationWrap .pdf-dl-btn {
  margin-top: 20px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .pdf-dl-btn {
    text-align: center;
    line-height: 1.4;
    margin-right: 30px;
  }
}
.CooperationArea .CooperationWrap .pdf-dl-btn a {
  display: inline-block;
  transition: all 0.2s linear;
  color: #000;
  font-weight: 700;
  font-size: 14px;
  position: relative;
}

.CooperationArea .CooperationWrap .pdf-dl-btn a span {
  display: inline-block;
  width: 20px;
  position: relative;
  left: 4px;
  top: 5px;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .pdf-dl-btn a small {
    display: block;
  }
}
.CooperationArea .CooperationWrap .pdf-dl-btn a:hover {
  opacity: 0.6;
}

.CooperationArea .CooperationWrap .pdf-dl-btn a:after {
  content: "";
  width: 20px;
  height: 20px;
  background: url(../img/index/news-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  right: -30px;
  top: -2px;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .pdf-dl-btn a:after {
    top: 10px;
  }
}
.CooperationArea .CooperationWrap .s-note {
  margin-top: 20px;
  text-align: center;
  font-weight: 500;
}

@media screen and (max-width: 767px) {
  .CooperationArea .CooperationWrap .s-note {
    font-size: 15px;
  }
}
/*//////////////////// お知らせ /////////////////////////////////////*/
.topics .contents {
  max-width: 960px;
  margin: 80px auto 0;
}

@media screen and (max-width: 968px) {
  .topics .contents {
    margin: 80px 20px 0;
  }
}
@media screen and (max-width: 767px) {
  .topics .contents {
    margin: 60px auto 0;
    padding: 0 20px;
  }
}
.topics .contents .cywrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@media screen and (max-width: 767px) {
  .topics .contents .cywrap {
    display: block;
  }
}
.topics .contents .cywrap .CategoryMenu {
  display: flex;
}

@media screen and (max-width: 767px) {
  .topics .contents .cywrap .CategoryMenu {
    flex-wrap: wrap;
  }
}
.topics .contents .cywrap .CategoryMenu li {
  display: inline-block;
}

@media screen and (max-width: 767px) {
  .topics .contents .cywrap .CategoryMenu li {
    box-sizing: border-box;
    width: 50%;
    margin-bottom: 15px;
  }
}
.topics .contents .cywrap .CategoryMenu li span {
  padding: 4px 20px;
  border-right: 1px solid #B6B6B6;
  font-size: 15px;
  color: #000;
  cursor: pointer;
}

@media screen and (max-width: 767px) {
  .topics .contents .cywrap .CategoryMenu li span {
    display: block;
    text-align: center;
  }
}
.topics .contents .cywrap .CategoryMenu li span.active {
  background-color: #00AEBB;
  color: #FFF;
}

.topics .contents .cywrap .CategoryMenu li span:hover {
  background-color: #00AEBB;
  color: #FFF;
  opacity: 0.7;
}

.topics .contents .cywrap .CategoryMenu li:first-of-type span {
  border-left: 1px solid #B6B6B6;
}

.topics .contents .cywrap .year select {
  width: 120px;
  text-align: left;
  margin: 0;
  padding: 8px 0 8px 10px;
  border: #333 solid 1px;
  border-radius: 4px;
}

@media screen and (max-width: 767px) {
  .topics .contents .cywrap .year select {
    margin-top: 20px;
  }
}
.topics .contents .newsList {
  margin-top: 40px;
  border-top: 1px solid #B6B6B6;
}

.topics .contents .newsList a {
  color: #000;
}

.topics .contents .newsList a:hover {
  opacity: 0.5;
  text-decoration: underline;
}

.topics .contents .newsList dt {
  padding: 40px 0 20px;
  color: #4C4948;
  font-size: 14px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .topics .contents .newsList dt {
    padding: 25px 0 20px;
  }
}
.topics .contents .newsList dt span {
  display: inline-block;
  width: 118px;
  text-align: center;
  padding: 5px 0;
  border: 1px solid #B6B6B6;
  margin-left: 15px;
  font-size: 12px;
}

.topics .contents .newsList dt:after {
  content: "";
  width: 24px;
  height: 24px;
  background: url(../img/index/news-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  top: 55px;
  right: 0;
}

@media screen and (max-width: 767px) {
  .topics .contents .newsList dt:after {
    top: auto;
    bottom: -15px;
  }
}
.topics .contents .newsList dd {
  padding: 0 0 40px;
  border-bottom: 1px solid #B6B6B6;
}

@media screen and (max-width: 767px) {
  .topics .contents .newsList dd {
    padding: 0 45px 25px 0;
  }
}
.topics .contents .newsList dd a {
  color: #000;
}

@media screen and (max-width: 767px) {
  .topics .contents .newsList dd a {
    line-height: 1.6;
  }
}
.topics .contents .newsList dd a:hover {
  text-decoration: underline;
}

.topics .contents .Totop {
  text-align: left;
}

@media screen and (max-width: 767px) {
  .topics .contents .Totop {
    text-align: center;
  }
}
.topics .contents .Totop a {
  display: inline-block;
  border-radius: 10px;
  border: 2px solid #00AEBB;
  padding: 10px 60px 10px 20px;
  color: #00AEBB;
  font-weight: 700;
  margin-top: 40px;
  position: relative;
  transition: all 0.2s linear;
}

.topics .contents .Totop a:after {
  position: absolute;
  content: "";
  width: 24px;
  height: 24px;
  display: block;
  background: url(../img/index/index-arrow.svg) center center/100% 100% no-repeat;
  top: calc(50% - 12px);
  right: 20px;
}

.topics .contents .Totop a:hover {
  opacity: 0.6;
}

.topics .contents .date {
  font-size: 14px;
}

.topics .contents .date span {
  font-size: 12px;
  display: inline-block;
  width: 118px;
  text-align: center;
  padding: 5px 0;
  border: 1px solid #B6B6B6;
  margin-left: 15px;
}

.topics .contents h2 {
  font-size: 24px;
  font-weight: 700;
  margin-top: 15px;
  padding-bottom: 10px;
  border-bottom: 1px solid #6A6A6A;
}

@media screen and (max-width: 767px) {
  .topics .contents h2 {
    line-height: 1.6;
    word-break: break-all;
  }
}
.topics .contents .entry {
  margin-top: 55px;
  line-height: 1.7;
}

@media screen and (max-width: 767px) {
  .topics .contents .entry {
    margin-top: 40px;
  }
}
.topics .contents .pdf-dl-btn {
  margin-top: 80px;
  text-align: left;
}

@media screen and (max-width: 767px) {
  .topics .contents .pdf-dl-btn {
    text-align: center;
    margin-right: 30px;
  }
}
.topics .contents .pdf-dl-btn a {
  display: inline-block;
  transition: all 0.2s linear;
  color: #000;
  font-weight: 700;
  font-size: 16px;
  position: relative;
}

.topics .contents .pdf-dl-btn a:hover {
  opacity: 0.6;
}

.topics .contents .pdf-dl-btn a:after {
  content: "";
  width: 20px;
  height: 20px;
  background: url(../img/index/news-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  right: -30px;
  top: -2px;
}

@media screen and (max-width: 767px) {
  .topics .contents .pdf-dl-btn a:after {
    top: -2px;
  }
}
/*////////////////////////// 共通 //////////////////////////////*/
.headTitle {
  padding: 20px 0 30px;
  background-color: #F2FBFC;
}

.headTitle .in_wrap {
  max-width: 1180px;
  margin: 0 auto;
}

@media screen and (max-width: 1240px) {
  .headTitle .in_wrap {
    padding: 0 20px;
  }
}
.headTitle .breadcrumbs {
  font-size: 12px;
  margin: 0;
}

@media screen and (max-width: 767px) {
  .headTitle .breadcrumbs {
    padding: 0 20px;
    line-height: 1.4 !important;
    font-size: 11px !important;
  }
  .headTitle .breadcrumbs span {
    font-size: 0.8em;
  }
}
.headTitle .breadcrumbs a {
  color: #00AEBB;
}

.headTitle h1 {
  color: #4C4948;
  font-size: 32px;
  font-weight: 700;
  margin-top: 45px;
}

@media screen and (max-width: 767px) {
  .headTitle h1 {
    font-size: 28px;
    padding: 0 20px;
  }
}
/*////////////////////////// END 共通 //////////////////////////////*/
.regarding-orders .headTitle {
  padding: 15px 0 30px;
  border-bottom: 4px solid #80D6DE;
  background-color: transparent;
}

.regarding-orders .headTitle .in_wrap {
  text-align: left;
  padding: 0;
}

.regarding-orders .headTitle h1 {
  color: #00AEBB;
}

@media screen and (max-width: 767px) {
  .regarding-orders .headTitle h1 {
    margin: 45px 0 0;
    text-align: left;
  }
}
.regarding-orders .headTitle h1 span {
  font-size: 0.8em;
  margin-left: 0.25em;
}

@media screen and (max-width: 767px) {
  .regarding-orders .headTitle h1 span {
    display: block;
    margin: 10px 0 0;
  }
}
.regarding-orders .contents .in_wrap {
  max-width: 960px;
  margin: 0 auto;
}

@media screen and (max-width: 960px) {
  .regarding-orders .contents .in_wrap {
    padding: 0 20px;
  }
}
.regarding-orders .contents .How-to-Order {
  padding: 40px 0 85px;
}

@media screen and (max-width: 767px) {
  .regarding-orders .contents .How-to-Order {
    padding: 40px 0 60px;
  }
}
.regarding-orders .contents .How-to-Order h2 {
  color: #FF205F;
  font-size: 18px;
  font-weight: 700;
}

@media screen and (max-width: 767px) {
  .regarding-orders .contents .How-to-Order h2 {
    line-height: 1.6;
  }
}
.regarding-orders .contents .How-to-Order .order-txt {
  line-height: 1.7;
  margin-top: 20px;
}

@media screen and (max-width: 767px) {
  .regarding-orders .contents .How-to-Order .order-txt {
    font-size: 15px;
    line-height: 1.6;
  }
}
.regarding-orders .contents .How-to-Order h3 {
  padding: 10px 15px;
  background-color: #EBEBEB;
  font-size: 18px;
  font-weight: 700;
  margin-top: 40px;
}

@media screen and (max-width: 767px) {
  .regarding-orders .contents .How-to-Order h3 {
    line-height: 1.6;
  }
}
.regarding-orders .contents .How-to-Order dl {
  display: flex;
  justify-content: space-between;
  margin-top: 25px;
}

@media screen and (max-width: 767px) {
  .regarding-orders .contents .How-to-Order dl {
    display: block;
  }
}
.regarding-orders .contents .How-to-Order dl dt {
  width: 43.8%;
}

@media screen and (max-width: 767px) {
  .regarding-orders .contents .How-to-Order dl dt {
    width: 100%;
  }
}
.regarding-orders .contents .How-to-Order dl dt .imgTxt {
  font-size: 15px;
  font-weight: 500;
  margin-bottom: 15px;
}

.regarding-orders .contents .How-to-Order dl dd {
  width: 51%;
}

@media screen and (max-width: 767px) {
  .regarding-orders .contents .How-to-Order dl dd {
    width: 100%;
  }
}
.regarding-orders .contents .How-to-Order dl dd .OrderNumberTitle {
  font-size: 14px;
  margin-top: 26px;
}

.regarding-orders .contents .How-to-Order dl dd .OrderNumber {
  margin-top: 10px;
  padding: 10px 0;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  display: inline-block;
}

@media screen and (max-width: 767px) {
  .regarding-orders .contents .How-to-Order dl dd .OrderNumber {
    line-height: 1.6;
  }
}
.regarding-orders .contents .How-to-Order .orderList {
  margin-top: 25px;
}

.regarding-orders .contents .How-to-Order .orderList li {
  line-height: 1.7;
  margin-left: 1em;
  text-indent: -1em;
}

.regarding-orders .contents .How-to-Order .orderList li:first-of-type {
  color: #FF205F;
}

.regarding-orders .contents .How-to-Order h4 {
  font-weight: 700;
  margin-top: 30px;
}

.regarding-orders .contents .How-to-Order .retention-period {
  line-height: 1.7;
  margin-top: 20px;
}

.regarding-orders .contents .How-to-Order .retention-period span {
  color: #FF205F;
}

.regarding-orders .JustLine {
  padding: 35px 0;
  background-color: #E6F7F8;
}

@media screen and (max-width: 767px) {
  .regarding-orders .JustLine {
    padding: 30px 20px;
  }
}
.regarding-orders .JustLine .JustLineWrap {
  display: flex;
  justify-content: space-between;
  max-width: 900px;
  margin: 0 auto;
}

@media screen and (max-width: 920px) {
  .regarding-orders .JustLine .JustLineWrap {
    padding: 0 20px;
  }
}
@media screen and (max-width: 767px) {
  .regarding-orders .JustLine .JustLineWrap {
    display: block;
  }
}
.regarding-orders .JustLine .JustLineWrap .comparison {
  width: 55.6%;
}

@media screen and (max-width: 767px) {
  .regarding-orders .JustLine .JustLineWrap .comparison {
    width: 100%;
  }
}
.regarding-orders .JustLine .JustLineWrap .comparison table {
  margin-top: 15px;
}

.regarding-orders .JustLine .JustLineWrap .comparison table tr {
  border-bottom: 1px solid #00AEBB;
  font-size: 14px;
}

@media screen and (max-width: 767px) {
  .regarding-orders .JustLine .JustLineWrap .comparison table tr {
    font-size: 13px;
    line-height: 1.4;
  }
}
.regarding-orders .JustLine .JustLineWrap .comparison table tr th {
  padding: 10px 10px 10px 20px;
  background-color: #FFF;
  text-align: left;
  font-weight: 400;
}

.regarding-orders .JustLine .JustLineWrap .comparison table tr td {
  padding: 10px;
  background-color: #FFF;
  text-align: center;
}

.regarding-orders .JustLine .JustLineWrap .comparison table tr td.just {
  background-color: #E6F7F8;
}

.regarding-orders .JustLine .JustLineWrap .comparison table tr td .title {
  font-size: 12px;
  font-weight: 700;
  color: #EE0043;
  margin-bottom: 10px;
}

.regarding-orders .JustLine .JustLineWrap .comparison table tr td .title .pc-line {
  display: inline-block;
}

@media screen and (max-width: 884px) {
  .regarding-orders .JustLine .JustLineWrap .comparison table tr td .title .pc-line {
    display: none;
  }
}
.regarding-orders .JustLine .JustLineWrap .comparison table tr td .title .sp-line {
  display: none;
}

@media screen and (max-width: 884px) {
  .regarding-orders .JustLine .JustLineWrap .comparison table tr td .title .sp-line {
    display: inline-block;
  }
}
.regarding-orders .JustLine .JustLineWrap .comparison table tr td .title .tb {
  display: none;
}

@media screen and (max-width: 884px) {
  .regarding-orders .JustLine .JustLineWrap .comparison table tr td .title .tb {
    display: block;
  }
}
@media screen and (max-width: 884px) {
  .regarding-orders .JustLine .JustLineWrap .comparison table tr td .title {
    line-height: 1.25;
  }
}
@media screen and (max-width: 767px) {
  .regarding-orders .JustLine .JustLineWrap .comparison table tr td .title {
    line-height: 1.4;
  }
}
.regarding-orders .JustLine .JustLineWrap .comparison table tr td span {
  color: #EE0043;
  position: relative;
  font-size: 0.9em;
  margin-left: 0.2em;
  top: -4px;
}

.regarding-orders .JustLine .JustLineWrap .comparison table tr td h4 {
  font-size: 15px;
}

.regarding-orders .JustLine .JustLineWrap .comparison table tr td .Official {
  width: 96px;
  background-color: #00AEBB;
  color: #FFF;
  padding: 8px;
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  margin: 6px auto 0;
  border-radius: 30px;
}

.regarding-orders .JustLine .JustLineWrap .comparison table tr td .ntec {
  width: 96px;
  background-color: #6A6A6A;
  color: #FFF;
  padding: 8px;
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  margin: 6px auto 0;
  border-radius: 30px;
}

@media screen and (max-width: 767px) {
  .regarding-orders .JustLine .JustLineWrap .comparison table tr td .ntec {
    margin: 22px auto 0;
  }
}
.regarding-orders .JustLine .JustLineWrap .comparison table tr:first-of-type td {
  background-color: transparent;
  padding: 0;
}

.regarding-orders .JustLine .JustLineWrap .comparison .table-note {
  font-size: 14px;
  line-height: 1.6;
  margin-left: 1em;
  margin-top: 15px;
}

.regarding-orders .JustLine .JustLineWrap .comparison .table-note span {
  color: #EE0043;
  display: block;
  text-indent: -1em;
}

.regarding-orders .JustLine .JustLineWrap .can-be {
  width: 40%;
}

@media screen and (max-width: 767px) {
  .regarding-orders .JustLine .JustLineWrap .can-be {
    width: 100%;
  }
  .regarding-orders .JustLine .JustLineWrap .can-be h3 {
    margin-top: 30px;
  }
}
.regarding-orders .JustLine .JustLineWrap .can-be .justLineList {
  margin-top: 36px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.regarding-orders .JustLine .JustLineWrap .can-be .justLineList li {
  margin-bottom: 25px;
  text-align: center;
  width: 50%;
}

.regarding-orders .JustLine .JustLineWrap .can-be .justLineList li p {
  font-size: 14px;
  line-height: 1.6;
  margin-top: 10px;
}

.regarding-orders .JustLine .JustLineWrap .can-be .justLineList li figure {
  margin: 0 auto;
  width: 100px;
}

.regarding-orders .JustLine .JustLineWrap h3 {
  font-size: 18px;
}

.regarding-orders .JustLine .JustLineWrap h3:before {
  margin-right: 0.25em;
  content: "■";
  color: #00AEBB;
}

.regarding-orders .TotopWrap {
  max-width: 900px;
  margin: 0 auto;
}

@media screen and (max-width: 920px) {
  .regarding-orders .TotopWrap {
    padding: 0 20px;
  }
}
.regarding-orders .TotopWrap .Totop {
  text-align: left;
}

@media screen and (max-width: 767px) {
  .regarding-orders .TotopWrap .Totop {
    text-align: center;
  }
}
.regarding-orders .TotopWrap .Totop a {
  display: inline-block;
  border-radius: 10px;
  border: 2px solid #00AEBB;
  padding: 10px 60px 10px 20px;
  color: #00AEBB;
  font-weight: 700;
  margin-top: 40px;
  position: relative;
  transition: all 0.2s linear;
}

.regarding-orders .TotopWrap .Totop a:after {
  position: absolute;
  content: "";
  width: 24px;
  height: 24px;
  display: block;
  background: url(../img/index/index-arrow.svg) center center/100% 100% no-repeat;
  top: calc(50% - 12px);
  right: 20px;
}

.regarding-orders .TotopWrap .Totop a:hover {
  opacity: 0.6;
}

/*////////////////////////////////////FAQ/お問合わせ//////////////////////////////////////////*/
.faq .headTitle {
  padding: 15px 0 30px;
  border-bottom: 4px solid #D9D9D9;
  background-color: #F7F7F7;
}

@media screen and (max-width: 767px) {
  .faq .headTitle .breadcrumbs {
    padding: 0;
  }
  .faq .headTitle h1 {
    padding: 0;
    text-align: left;
  }
}
.faq .faqBlock {
  padding-top: 30px;
}

@media screen and (max-width: 767px) {
  .faq .faqBlock {
    padding: 30px 0 0;
  }
}
.faq .faqBlock .faq-txt {
  font-size: 15px;
}

@media screen and (max-width: 767px) {
  .faq .faqBlock .faq-txt {
    line-height: 1.6;
  }
}
.faq .faqBlock .LinkArea {
  max-width: 850px;
  margin: 60px auto 0;
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .faq .faqBlock .LinkArea {
    margin: 40px auto 0;
    display: block;
  }
}
.faq .faqBlock .LinkArea .Box {
  width: 47.1%;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .faq .faqBlock .LinkArea .Box {
    width: 100%;
  }
}
.faq .faqBlock .LinkArea .Box h2 {
  font-size: 20px;
  font-weight: 700;
}

@media screen and (max-width: 767px) {
  .faq .faqBlock .LinkArea .Box:nth-of-type(2) h2 {
    margin-top: 40px;
    font-size: 18px;
  }
}
.faq .faqBlock .LinkArea .Box .faqBtn {
  margin-top: 25px;
}

.faq .faqBlock .LinkArea .Box .faqBtn a {
  display: block;
  width: 100%;
  border-radius: 40px;
  font-size: 24px;
  font-weight: 700;
  color: #FFF;
  padding: 20px 35px 20px 0;
  background-color: #00AEBB;
  position: relative;
  transition: all 0.2s linear;
}

@media screen and (max-width: 767px) {
  .faq .faqBlock .LinkArea .Box .faqBtn a {
    font-size: 19px;
  }
}
.faq .faqBlock .LinkArea .Box .faqBtn a span {
  font-size: 0.65em;
}

.faq .faqBlock .LinkArea .Box .faqBtn a:after {
  width: 24px;
  height: 24px;
  content: "";
  background: url(../img/faq/White-outline-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  top: calc(50% - 12px);
  right: 20px;
}

.faq .faqBlock .LinkArea .Box .faqBtn:nth-of-type(2) a {
  background-color: #3F82DE;
}

.faq .faqBlock .LinkArea .Box .faqBtn:nth-of-type(2) a:after {
  background: url(../img/faq/White-outline-arrow2.svg) center center/100% 100% no-repeat;
}

.faq .faqBlock .LinkArea .Box .faqBtn:hover {
  opacity: 0.6;
}

.faq .faqBlock .faqWrap {
  margin-top: 65px;
}

.faq .faqBlock .faqWrap .dlTitle {
  text-align: center;
  font-size: 24px;
  font-weight: 400;
  padding-bottom: 15px;
  border-bottom: 1px solid #000;
}

.faq .faqBlock .faqWrap .pdfLinkArea {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

@media screen and (max-width: 767px) {
  .faq .faqBlock .faqWrap .pdfLinkArea {
    display: block;
  }
}
.faq .faqBlock .faqWrap .pdfLinkArea li {
  width: 47.2%;
}

@media screen and (max-width: 767px) {
  .faq .faqBlock .faqWrap .pdfLinkArea li {
    width: 100%;
  }
}
.faq .faqBlock .faqWrap .pdfLinkArea li h3 {
  padding: 10px 15px;
  background-color: #EBEBEB;
  font-weight: 400;
  margin-top: 40px;
}

.faq .faqBlock .faqWrap .pdfLinkArea li .LinkBtn {
  margin-top: 20px;
}

@media screen and (max-width: 767px) {
  .faq .faqBlock .faqWrap .pdfLinkArea li .LinkBtn {
    padding-right: 36px;
    line-height: 1.6;
  }
}
.faq .faqBlock .faqWrap .pdfLinkArea li .LinkBtn a {
  font-weight: 700;
  color: #000;
  display: inline-block;
  position: relative;
  transition: all 0.2s linear;
}

.faq .faqBlock .faqWrap .pdfLinkArea li .LinkBtn a:after {
  position: absolute;
  width: 20px;
  height: 20px;
  content: "";
  background: url(../img/index/news-arrow.svg) center center/100% 100% no-repeat;
  top: calc(50% - 10px);
  right: -24px;
}

.faq .faqBlock .faqWrap .pdfLinkArea li .LinkBtn a.pdf:after {
  top: 8px;
}

.faq .faqBlock .faqWrap .pdfLinkArea li .LinkBtn a span {
  display: inline-block;
  margin-left: 4px;
  position: relative;
  top: 5px;
}

.faq .faqBlock .faqWrap .pdfLinkArea li .LinkBtn a:hover {
  opacity: 0.6;
  text-decoration: underline;
}

.faq .Totop {
  text-align: left;
}

@media screen and (max-width: 767px) {
  .faq .Totop {
    text-align: center;
  }
}
.faq .Totop a {
  display: inline-block;
  border-radius: 10px;
  border: 2px solid #00AEBB;
  padding: 10px 60px 10px 20px;
  color: #00AEBB;
  font-weight: 700;
  margin-top: 40px;
  position: relative;
  transition: all 0.2s linear;
}

.faq .Totop a:after {
  position: absolute;
  content: "";
  width: 24px;
  height: 24px;
  display: block;
  background: url(../img/index/index-arrow.svg) center center/100% 100% no-repeat;
  top: calc(50% - 12px);
  right: 20px;
}

.faq .Totop a:hover {
  opacity: 0.6;
}

/*////////////////////////////////////FAQ/お問合わせ//////////////////////////////////////////*/
/*/////////////////////////////////// レーザー穴加工 ///////////////////////////////////////////*/
.laserhole-processing {
  background-color: #E8F5FB;
  padding-bottom: 0;
}

.laserhole-processing .mainimg {
  height: 670px;
  background: url(../img/laserhole-processing/bk-triangle.svg) right bottom no-repeat #1A96D5;
  padding: 55px 0 20px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .mainimg {
    padding: 30px 0 20px;
    height: 700px;
  }
}
.laserhole-processing .mainimg .in_wrap {
  max-width: 1056px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 1082px) {
  .laserhole-processing .mainimg .in_wrap {
    padding: 0 20px;
  }
}
@media screen and (max-width: 767px) {
  .laserhole-processing .mainimg .in_wrap {
    display: block;
    padding: 0 20px;
  }
}
.laserhole-processing .mainimg .mainLeft {
  width: 46.1%;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .mainimg .mainLeft {
    width: 100%;
  }
}
.laserhole-processing .mainimg .mainLeft .blackBk {
  transform: skewX(-15deg);
  background-color: #000;
  text-align: center;
  font-size: 18px;
  font-weight: 700;
  padding: 8px 0;
  color: #FFF;
  margin-top: 20px;
  position: relative;
  font-style: normal;
}

.laserhole-processing .mainimg .mainLeft h1 {
  margin-top: 20px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .mainimg .mainLeft h1 {
    width: 80%;
    margin: 20px auto 0;
  }
}
.laserhole-processing .mainimg .mainLeft .MainLeftWrap {
  margin-top: 60px;
  position: relative;
}

.laserhole-processing .mainimg .mainLeft .MainLeftWrap figure {
  width: 186px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .mainimg .mainLeft .MainLeftWrap figure {
    width: 148px;
  }
}
.laserhole-processing .mainimg .mainLeft .MainLeftWrap .mainimg-txt {
  position: absolute;
  top: 50%;
  left: 240px;
  font-size: 16px;
  line-height: 2;
  color: #FFF;
  transform: translateY(-50%);
  width: 520px;
}

@media screen and (max-width: 980px) {
  .laserhole-processing .mainimg .mainLeft .MainLeftWrap .mainimg-txt {
    width: 300px;
  }
}
@media screen and (max-width: 786px) {
  .laserhole-processing .mainimg .mainLeft .MainLeftWrap .mainimg-txt {
    margin-top: 50px;
    width: 280px;
  }
}
@media screen and (max-width: 767px) {
  .laserhole-processing .mainimg .mainLeft .MainLeftWrap .mainimg-txt {
    display: none;
  }
}
.laserhole-processing .mainimg .mainLeft p span {
  transform: skewX(15deg);
  display: block;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .mainimg .mainLeft .castam {
    width: 200px;
    margin: 0 auto;
  }
}
.laserhole-processing .mainimg .mainRight {
  width: 45.5%;
  position: relative;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .mainimg .mainRight {
    width: 100%;
    margin: 0 auto;
  }
}
.laserhole-processing .mainimg .mainRight .whiteBlock {
  padding: 15px 15px 15px 40px;
  transform: skewX(-15deg);
  background-color: #FFF;
  margin-top: 98px;
  width: 70%;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .mainimg .mainRight .whiteBlock {
    transform: skewX(0deg);
    margin-top: 20px;
    padding: 15px;
    text-align: center;
    width: 100%;
  }
}
.laserhole-processing .mainimg .mainRight .whiteBlock span {
  display: block;
  font-size: 20px;
  font-weight: 700;
  transform: skewX(15deg);
  line-height: 2;
  color: #1A96D5;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .mainimg .mainRight .whiteBlock span {
    transform: skewX(0deg);
  }
}
.laserhole-processing .mainimg .mainRight .whiteBlock span strong {
  font-size: 28px;
  display: inline-block;
  text-decoration: underline;
  text-decoration-color: #FF205F;
  text-underline-offset: 8px;
}

.laserhole-processing .mainimg .mainRight .whiteBlock span strong.red {
  color: #FF205F;
}

.laserhole-processing .mainimg .mainRight figure {
  width: 280px;
  position: absolute;
  right: -90px;
  top: 250px;
}

@media screen and (max-width: 1274px) {
  .laserhole-processing .mainimg .mainRight figure {
    right: 0;
    width: 200px;
  }
}
@media screen and (max-width: 767px) {
  .laserhole-processing .mainimg .mainRight figure {
    right: 0;
    width: 170px;
    top: -230px;
  }
}
.laserhole-processing .mainimg .SP-mainimg-txt {
  display: none;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .mainimg .SP-mainimg-txt {
    display: block;
    width: 100%;
    margin: 60px auto 0;
    color: #1A96D5;
    font-weight: 700;
    line-height: 1.6;
  }
}
.laserhole-processing .pageNavi {
  background-color: #FFF;
  position: sticky;
  top: 83px;
  z-index: 8;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .pageNavi {
    display: none;
  }
}
.laserhole-processing .pageNavi ul {
  display: flex;
  justify-content: center;
  border-bottom: 1px solid #000;
}

.laserhole-processing .pageNavi ul li {
  display: inline-block;
}

.laserhole-processing .pageNavi ul li a {
  display: block;
  padding: 10px 40px 10px 20px;
  color: #4C4948;
  font-size: 16px;
  font-weight: 700;
  background: url(../img/smartorder/navi-arrow.svg) 92% 15px no-repeat;
  border-right: 1px solid #000;
  transition: all 0.2s linear;
}

.laserhole-processing .pageNavi ul li a:hover {
  background-color: #F1F9FD;
}

.laserhole-processing .pageNavi ul li:first-of-type a {
  border-left: 1px solid #000;
}

.laserhole-processing .standard-parts {
  background-color: #E8F5FB;
  padding-top: 50px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .standard-parts {
    padding-top: 174px;
  }
}
.laserhole-processing .standard-parts .standard-partsBlock {
  max-width: 960px;
  margin: 0 auto;
  border: 1px solid #1A96D5;
  padding: 55px 100px 80px;
  text-align: center;
  background-color: #FFF;
}

@media screen and (max-width: 980px) {
  .laserhole-processing .standard-parts .standard-partsBlock {
    padding: 55px 40px 80px;
    margin: 0 20px;
  }
}
@media screen and (max-width: 767px) {
  .laserhole-processing .standard-parts .standard-partsBlock {
    padding: 40px 20px;
    margin: 0 20px;
  }
}
.laserhole-processing .standard-parts .standard-partsBlock .topTxt {
  font-size: 36px;
  font-weight: 500;
  color: #1A96D5;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .standard-parts .standard-partsBlock .topTxt {
    font-size: 24px;
    line-height: 1.6;
  }
}
.laserhole-processing .standard-parts .standard-partsBlock h2 {
  font-size: 36px;
  font-weight: 900;
  color: #1A96D5;
  margin-top: 20px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .standard-parts .standard-partsBlock h2 {
    font-size: 24px;
    line-height: 1.6;
  }
}
.laserhole-processing .standard-parts .standard-partsBlock h2 span {
  text-decoration: underline;
  text-underline-offset: 8px;
  text-decoration-color: #FFF45E;
  text-decoration-thickness: 4px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .standard-parts .standard-partsBlock h2 span {
    display: block;
    text-underline-offset: 5px;
  }
}
.laserhole-processing .standard-parts .standard-partsBlock .middleTxt {
  margin-top: 25px;
  line-height: 1.7;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .standard-parts .standard-partsBlock .middleTxt {
    text-align: left;
  }
}
.laserhole-processing .standard-parts .standard-partsBlock .partsBlockList {
  margin-top: 50px;
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .standard-parts .standard-partsBlock .partsBlockList {
    margin-top: 35px;
  }
}
.laserhole-processing .standard-parts .standard-partsBlock .partsBlockList li {
  width: 30%;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .standard-parts .standard-partsBlock .partsBlockList li {
    width: 20%;
  }
  .laserhole-processing .standard-parts .standard-partsBlock .partsBlockList li:first-of-type {
    width: 34%;
  }
  .laserhole-processing .standard-parts .standard-partsBlock .partsBlockList li:nth-of-type(2) {
    width: 34%;
    padding-top: 25px;
  }
}
.laserhole-processing .standard-parts .standard-partsBlock .partsBlockList li .detailTxt {
  font-weight: 700;
  margin-top: 20px;
  color: #1A96D5;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .standard-parts .standard-partsBlock .partsBlockList li .detailTxt {
    font-size: 14px;
    line-height: 1.6;
  }
}
.laserhole-processing .standard-parts .standard-partsBlock .partsBlockList li figure img {
  margin: 0 auto;
}

.laserhole-processing .standard-parts .standard-partsBlock .partsBlockList li:last-of-type figure {
  margin: 53px 0;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .standard-parts .standard-partsBlock .partsBlockList li:last-of-type figure {
    margin: 65px 0 48px;
  }
}
.laserhole-processing .standard-parts .standard-partsBlock .partsBlockList li:first-of-type figure {
  margin: 15px 0;
}

.laserhole-processing .CompatibleModels {
  padding-top: 80px;
  background-color: #E8F5FB;
}

.laserhole-processing .CompatibleModels .Cabinet-Standard {
  max-width: 750px;
  margin: 30px auto 0;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .CompatibleModels .Cabinet-Standard {
    margin: 30px 20px 0;
  }
}
.laserhole-processing .CompatibleModels .btn-order {
  text-align: center;
  margin-top: 30px;
}

.laserhole-processing .CompatibleModels .btn-order a {
  display: inline-block;
  border-radius: 10px;
  border: 2px solid #1A96D5;
  padding: 10px 60px 10px 20px;
  color: #1A96D5;
  font-weight: 700;
  position: relative;
  background-color: #FFF;
  transition: all 0.2s linear;
  cursor: pointer;
}

.laserhole-processing .CompatibleModels .btn-order a:after {
  position: absolute;
  content: "";
  width: 24px;
  height: 24px;
  display: block;
  background: url(../img/smartorder/blue-arrow.svg) center center/100% 100% no-repeat;
  top: calc(50% - 12px);
  right: 20px;
}

.laserhole-processing .CompatibleModels .btn-order a:hover {
  opacity: 0.5;
}

.laserhole-processing .CompatibleModels .LinkList {
  margin-top: 15px;
  display: flex;
  justify-content: center;
}

.laserhole-processing .CompatibleModels .LinkList li {
  display: inline-block;
  padding-right: 40px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .CompatibleModels .LinkList li {
    text-align: left;
  }
}
.laserhole-processing .CompatibleModels .LinkList li a {
  font-size: 14px;
  font-weight: 700;
  color: #000;
  position: relative;
  transition: all 0.2s linear;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .CompatibleModels .LinkList li a {
    line-height: 1.6;
  }
}
.laserhole-processing .CompatibleModels .LinkList li a:after {
  position: absolute;
  width: 20px;
  height: 20px;
  content: "";
  background: url(../img/index/news-arrow.svg) center center/100% 100% no-repeat;
  right: -24px;
  top: calc(50% - 10px);
}

@media screen and (max-width: 767px) {
  .laserhole-processing .CompatibleModels .LinkList li a:after {
    right: -48px;
  }
}
.laserhole-processing .CompatibleModels .LinkList li a:hover {
  opacity: 0.5;
}

.laserhole-processing .CompatibleModels .LinkList li:last-of-type {
  padding-right: 20px;
}

.laserhole-processing .delivery-date {
  padding-top: 60px;
  background-color: #E8F5FB;
  text-align: left;
}

.laserhole-processing .delivery-date .Production-days {
  max-width: 450px;
  margin: 25px auto 0;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .delivery-date .Production-days {
    margin: 25px 20px 0;
  }
}
.laserhole-processing .delivery-date .Production-days h3 {
  font-size: 18px;
  font-weight: 700;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .delivery-date .Production-days h3 {
    text-align: left;
  }
}
.laserhole-processing .delivery-date .Production-days dl {
  margin-top: 10px;
  border-top: 1px solid #1A96D5;
  display: flex;
  flex-wrap: wrap;
  /*align-items: center;*/
  background-color: #FFF;
  text-align: left;
}

.laserhole-processing .delivery-date .Production-days dl dt {
  width: 66%;
  padding: 15px;
  box-sizing: border-box;
  line-height: 1.7;
  border-bottom: 1px solid #D9D9D9;
}

.laserhole-processing .delivery-date .Production-days dl dt:last-of-type {
  border-bottom: 1px solid #1A96D5;
}

.laserhole-processing .delivery-date .Production-days dl dt:first-of-type {
  border-bottom: 1px solid #1A96D5;
}

.laserhole-processing .delivery-date .Production-days dl dt small {
  font-size: 14px;
}

.laserhole-processing .delivery-date .Production-days dl dt strong {
  font-size: 18px;
  font-weight: 700;
}

.laserhole-processing .delivery-date .Production-days dl dd {
  width: 34%;
  box-sizing: border-box;
  padding: 15px 15px 15px 0;
  font-size: 18px;
  font-weight: 700;
  text-align: right;
  line-height: 1.6;
  border-bottom: 1px solid #D9D9D9;
}

.laserhole-processing .delivery-date .Production-days dl dd small {
  font-size: 14px;
  display: block;
  line-height: 1.6;
}

.laserhole-processing .delivery-date .Production-days dl dd:last-of-type {
  border-bottom: 1px solid #1A96D5;
}

.laserhole-processing .delivery-date .Production-days dl dd:first-of-type {
  border-bottom: 1px solid #1A96D5;
}

.laserhole-processing .delivery-date .Production-days dl dd strong {
  font-size: 18px;
  font-weight: 700;
}

.laserhole-processing .delivery-date .Production-days dl dd.center {
  padding-top: 30px;
}

.laserhole-processing .delivery-date .delivery-date-note {
  text-align: left;
  margin: 25px auto 0;
  font-size: 12px;
  line-height: 1.6;
  padding-left: 1em;
  text-indent: -1em;
  max-width: 530px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .delivery-date .delivery-date-note {
    margin: 25px 20px 0;
  }
}
.laserhole-processing .delivery-date .delivery-date-note span {
  padding-left: 2em;
  text-indent: -1em;
  display: block;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .delivery-date .delivery-date-note span {
    padding-left: 1em;
    text-indent: -1em;
  }
}
.laserhole-processing .delivery-date .selectionArea {
  border: 4px solid #8CCAEA;
  padding: 10px 40px 25px;
  display: block;
  margin-top: 40px;
}

@media screen and (max-width: 980px) {
  .laserhole-processing .delivery-date .selectionArea {
    padding: 10px 25px 25px;
    margin: 40px 20px 0;
  }
}
@media screen and (max-width: 767px) {
  .laserhole-processing .delivery-date .selectionArea {
    padding: 20px;
    margin: 40px 20px 0;
  }
}
.laserhole-processing .delivery-date .selectionArea .Confirmation-DeliveryDates {
  font-size: 18px;
  margin: 20px 0 0;
  font-weight: 700;
  text-align: center;
  color: #000;
}

@media screen and (max-width: 902px) {
  .laserhole-processing .delivery-date .selectionArea .Confirmation-DeliveryDates {
    text-align: left;
    line-height: 1.8;
  }
}
.laserhole-processing .delivery-date .selectionArea .Confirmation-DeliveryDates .UL {
  text-decoration: underline;
  text-underline-offset: 8px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .delivery-date .selectionArea .Confirmation-DeliveryDates .UL {
    text-underline-offset: 5px;
  }
}
.laserhole-processing .delivery-date .selectionArea .Confirmation-DeliveryDates .red {
  color: #FF205F;
}

.laserhole-processing .delivery-date .selectionArea .calenderList {
  max-width: 774px;
  margin: 40px auto 0;
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .delivery-date .selectionArea .calenderList {
    display: block;
  }
}
.laserhole-processing .delivery-date .selectionArea .calenderList li {
  width: 48%;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .delivery-date .selectionArea .calenderList li {
    width: 100%;
  }
  .laserhole-processing .delivery-date .selectionArea .calenderList li:nth-of-type(2) {
    margin-top: 20px;
  }
}
.laserhole-processing .delivery-date .selectionArea .calenderList li .calender-note {
  font-size: 12px;
  margin-top: 10px;
  text-align: left;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .delivery-date .selectionArea .calenderList li .calender-note {
    margin-left: 1em;
    text-indent: -1em;
    line-height: 1.6;
  }
}
.laserhole-processing .delivery-date .selectionArea .pdf-dl-btn {
  margin: 15px auto 0;
  max-width: 774px;
  padding-right: 28px;
  box-sizing: border-box;
  text-align: right;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .delivery-date .selectionArea .pdf-dl-btn {
    text-align: left;
    margin-right: 30px;
  }
}
.laserhole-processing .delivery-date .selectionArea .pdf-dl-btn a {
  display: inline-block;
  transition: all 0.2s linear;
  color: #000;
  font-weight: 700;
  font-size: 14px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .delivery-date .selectionArea .pdf-dl-btn a {
    line-height: 1.6;
  }
}
.laserhole-processing .delivery-date .selectionArea .pdf-dl-btn a:after {
  content: "";
  width: 20px;
  height: 20px;
  background: url(../img/index/news-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  right: -30px;
  top: -2px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .delivery-date .selectionArea .pdf-dl-btn a:after {
    top: 15px;
  }
}
.laserhole-processing .delivery-date .selectionArea .pdf-dl-btn a:hover {
  opacity: 0.5;
}

.laserhole-processing .delivery-date .selectionArea .loginBtn {
  margin: 25px 0 15px;
  text-align: center;
}

.laserhole-processing .delivery-date .selectionArea .loginBtn a {
  display: inline-block;
  padding: 15px 50px 15px 20px;
  font-size: 15px;
  font-weight: 700;
  position: relative;
  color: #000;
  background-color: #FFF45E;
  border: 2px solid #00AEBB;
  border-radius: 30px;
  transition: all 0.2s linear;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .delivery-date .selectionArea .loginBtn a {
    padding: 15px 45px 15px 15px;
    text-align: left;
    line-height: 1.4;
  }
}
.laserhole-processing .delivery-date .selectionArea .loginBtn a span {
  font-weight: 500;
  font-size: 0.9em;
}

.laserhole-processing .delivery-date .selectionArea .loginBtn a:after {
  content: "";
  width: 24px;
  height: 24px;
  background: url(../img/index/index-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  top: calc(50% - 12px);
  right: 15px;
}

.laserhole-processing .delivery-date .selectionArea .loginBtn a:hover {
  transform: scale(1.05, 1.05);
  background-color: #FFF;
}

.laserhole-processing .laserhole_inWrap {
  max-width: 960px;
  margin: 0 auto;
  text-align: center;
}

.laserhole-processing .laserhole_inWrap h2 {
  padding: 15px 0;
  font-size: 32px;
  color: #FFF;
  font-weight: 400;
  background-color: #1A96D5;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole_inWrap h2 {
    font-size: 24px;
  }
}
.laserhole-processing .laserhole_inWrap h3 {
  font-size: 32px;
  font-weight: 700;
  color: #1A96D5;
  margin-top: 45px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole_inWrap h3 {
    line-height: 1.6;
  }
}
.laserhole-processing .laserhole_inWrap h3 span {
  color: #FF205F;
}

.laserhole-processing .laserhole_inWrap .laserholeTxt {
  margin-top: 20px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole_inWrap .laserholeTxt {
    margin: 20px 20px 0;
    text-align: left;
    line-height: 1.6;
  }
}
.laserhole-processing .laserhole-processing-price {
  background-color: #E8F5FB;
  padding-top: 80px;
}

.laserhole-processing .laserhole-processing-price .ReasonableBox {
  display: flex;
  justify-content: space-between;
  margin: 116px auto 0;
  max-width: 840px;
}

@media screen and (max-width: 980px) {
  .laserhole-processing .laserhole-processing-price .ReasonableBox {
    margin: 116px auto 0;
    max-width: 780px;
  }
}
@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole-processing-price .ReasonableBox {
    margin: 40px 85px 0;
    display: block;
  }
}
.laserhole-processing .laserhole-processing-price .ReasonableBox li {
  padding: 10px 8px 8px;
  border: 2px solid #1A96D5;
  border-radius: 8px;
  background-color: #FFF;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  box-shadow: 3px 3px 6px 0px rgba(100, 100, 100, 0.4);
}

@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole-processing-price .ReasonableBox li {
    margin-top: 50px;
  }
  .laserhole-processing .laserhole-processing-price .ReasonableBox li:nth-of-type(2) {
    margin-top: 116px;
  }
}
.laserhole-processing .laserhole-processing-price .ReasonableBox li.pd {
  padding: 10px 20px 8px;
}

.laserhole-processing .laserhole-processing-price .ReasonableBox li:after {
  content: "＋";
  position: absolute;
  right: -33px;
  font-size: 24px;
  font-weight: 700;
  top: calc(50% - 12px);
  color: #1A96D5;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole-processing-price .ReasonableBox li:after {
    right: calc(50% - 12px);
    top: 110%;
  }
}
.laserhole-processing .laserhole-processing-price .ReasonableBox li:last-of-type:after {
  display: none;
}

.laserhole-processing .laserhole-processing-price .ReasonableBox li .mainTxt {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
  color: #1A96D5;
}

.laserhole-processing .laserhole-processing-price .ReasonableBox li .mainTxt .small {
  font-size: 0.8em;
  position: relative;
  top: -4px;
}

@media screen and (max-width: 980px) {
  .laserhole-processing .laserhole-processing-price .ReasonableBox li .mainTxt {
    font-size: 16px;
  }
}
.laserhole-processing .laserhole-processing-price .ReasonableBox li .subTxt {
  font-size: 16px;
  font-weight: 700;
  color: #FF205F;
  margin-top: 24px;
}

@media screen and (max-width: 980px) {
  .laserhole-processing .laserhole-processing-price .ReasonableBox li .subTxt {
    font-size: 14px;
  }
}
@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole-processing-price .ReasonableBox li .subTxt {
    margin-top: 10px;
  }
}
.laserhole-processing .laserhole-processing-price .ReasonableBox li .noteTxt {
  font-size: 14px;
  line-height: 1.6;
  margin-top: 15px;
}

@media screen and (max-width: 980px) {
  .laserhole-processing .laserhole-processing-price .ReasonableBox li .noteTxt {
    font-size: 13px;
  }
}
@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole-processing-price .ReasonableBox li .noteTxt {
    margin: 15px 20px 0;
  }
}
.laserhole-processing .laserhole-processing-price .ReasonableBox li .noteTxtBt {
  margin-top: 15px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole-processing-price .ReasonableBox li .noteTxtBt {
    margin: 15px 20px 0;
  }
}
.laserhole-processing .laserhole-processing-price .ReasonableBox li .noteTxtBt a {
  color: #1A96D5;
  font-size: 14px;
  transition: all 0.2s linear;
}

.laserhole-processing .laserhole-processing-price .ReasonableBox li .noteTxtBt a:hover {
  opacity: 0.5;
}

.laserhole-processing .laserhole-processing-price .ReasonableBox li .noteTxtBt a:after {
  position: relative;
  top: 4px;
  left: 10px;
  content: url(../img/smartorder/blue-arrow.svg);
}

.laserhole-processing .laserhole-processing-price .ReasonableBox li table {
  margin-top: 10px;
  border-top: 1px solid #8CCAEA;
  border-right: 1px solid #8CCAEA;
}

.laserhole-processing .laserhole-processing-price .ReasonableBox li table th {
  border-bottom: 1px solid #8CCAEA;
  border-left: 1px solid #8CCAEA;
  padding: 5px;
  background-color: #E8F5FB;
  font-size: 14px;
  color: #1A96D5;
  font-weight: 500;
}

.laserhole-processing .laserhole-processing-price .ReasonableBox li table td {
  border-bottom: 1px solid #8CCAEA;
  border-left: 1px solid #8CCAEA;
  padding: 5px;
  font-size: 15px;
  font-weight: 400;
}

.laserhole-processing .laserhole-processing-price .ReasonableBox li .fukidashi {
  box-sizing: border-box;
  font-size: 19px;
  font-weight: 700;
  line-height: 1.4;
  position: absolute;
  color: #FFF45E;
  width: 170px;
  height: 77px;
  top: -80px;
  left: calc(50% - 85px);
  background: url(../img/laserhole-processing/Reasonable-fukidashi.svg) center center/100% auto no-repeat;
  padding-top: 10px;
}

.laserhole-processing .laserhole-processing-price .ReasonableBox li .fukidashi small {
  font-size: 12px;
  display: block;
  color: #FFF;
}

.laserhole-processing .laserhole-processing-price .Reasonable-note {
  font-size: 12px;
  text-align: left;
  margin: 20px auto 0;
  max-width: 784px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole-processing-price .Reasonable-note {
    margin: 20px 20px 0;
    line-height: 1.6;
  }
}
.laserhole-processing .laserhole-processing-price .pdf-dl-btn {
  margin-top: 20px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole-processing-price .wrap {
    margin-right: 15px;
  }
}
.laserhole-processing .laserhole-processing-price .wrap .pdf-dl-btn {
  margin-top: 0;
}

.laserhole-processing .laserhole-processing-price .wrap .em {
  margin-top: 6px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole-processing-price .pdf-dl-btn {
    line-height: 1.4;
    margin: 30px 20px 0;
  }
}
@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole-processing-price .wrap .pdf-dl-btn {
    margin: 0;
  }
}
.laserhole-processing .laserhole-processing-price .pdf-dl-btn a {
  display: inline-block;
  transition: all 0.2s linear;
  color: #000;
  font-weight: 700;
  font-size: 14px;
  position: relative;
}

.laserhole-processing .laserhole-processing-price .pdf-dl-btn a em {
  font-size: 12px;
  font-weight: 400;
  font-style: normal;
  margin-right: 1em;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole-processing-price .pdf-dl-btn a em {
    display: block;
  }
}
.laserhole-processing .laserhole-processing-price .pdf-dl-btn a span {
  display: inline-block;
  width: 20px;
  position: relative;
  left: 4px;
  top: 5px;
}

.laserhole-processing .laserhole-processing-price .pdf-dl-btn a:after {
  content: "";
  width: 20px;
  height: 20px;
  background: url(../img/index/news-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  right: -30px;
  top: 7px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole-processing-price .pdf-dl-btn a:after {
    top: 8px;
  }
}
.laserhole-processing .laserhole-processing-price .pdf-dl-btn a:hover {
  opacity: 0.5;
}

.laserhole-processing .laserhole-processing-price .selectionArea {
  border: 4px solid #8CCAEA;
  padding: 30px 40px 30px;
  display: flex;
  justify-content: space-between;
  margin-top: 40px;
}

@media screen and (max-width: 980px) {
  .laserhole-processing .laserhole-processing-price .selectionArea {
    margin: 40px 20px 0;
    padding: 30px;
  }
}
@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole-processing-price .selectionArea {
    padding: 30px 20px;
    margin: 35px 20px 0;
    display: block;
  }
}
.laserhole-processing .laserhole-processing-price .selectionArea dt {
  width: 48.2%;
  text-align: left;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole-processing-price .selectionArea dt {
    width: 100%;
  }
}
.laserhole-processing .laserhole-processing-price .selectionArea dt .selectionTitle {
  margin-top: 25px 0 0;
  font-size: 18px;
  color: #000;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole-processing-price .selectionArea dt .selectionTitle {
    margin-top: 0;
  }
}
.laserhole-processing .laserhole-processing-price .selectionArea dt p {
  font-size: 15px;
  line-height: 1.7;
  margin-top: 20px;
}

.laserhole-processing .laserhole-processing-price .selectionArea dt .loginBtn {
  margin-top: 20px;
  text-align: left;
}

.laserhole-processing .laserhole-processing-price .selectionArea dt .loginBtn a {
  display: inline-block;
  padding: 15px 50px 15px 20px;
  font-size: 15px;
  font-weight: 700;
  position: relative;
  color: #000;
  background-color: #FFF45E;
  border: 2px solid #00AEBB;
  border-radius: 30px;
  transition: all 0.2s linear;
}

.laserhole-processing .laserhole-processing-price .selectionArea dt .loginBtn a span {
  font-size: 14px;
  font-weight: 400;
}

.laserhole-processing .laserhole-processing-price .selectionArea dt .loginBtn a:after {
  content: "";
  width: 24px;
  height: 24px;
  background: url(../img/index/index-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  top: calc(50% - 12px);
  right: 15px;
}

.laserhole-processing .laserhole-processing-price .selectionArea dt .loginBtn a:hover {
  transform: scale(1.05, 1.05);
  background-color: #FFF;
}

.laserhole-processing .laserhole-processing-price .selectionArea dd {
  width: 43.3%;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole-processing-price .selectionArea dd {
    width: 100%;
    margin-top: 25px;
  }
  .laserhole-processing .laserhole-processing-price .selectionArea dd .loginBtn {
    text-align: center;
  }
  .laserhole-processing .laserhole-processing-price .selectionArea dd .loginBtn a {
    display: inline-block;
    padding: 15px 50px 15px 20px;
    font-size: 15px;
    font-weight: 700;
    position: relative;
    color: #000;
    background-color: #FFF45E;
    border: 2px solid #00AEBB;
    border-radius: 30px;
    transition: all 0.2s linear;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .laserhole-processing .laserhole-processing-price .selectionArea dd .loginBtn a {
    text-align: left;
    line-height: 1.4;
  }
}
@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole-processing-price .selectionArea dd .loginBtn a span {
    font-size: 14px;
    font-weight: 400;
  }
  .laserhole-processing .laserhole-processing-price .selectionArea dd .loginBtn a:after {
    content: "";
    width: 24px;
    height: 24px;
    background: url(../img/index/index-arrow.svg) center center/100% 100% no-repeat;
    position: absolute;
    top: calc(50% - 12px);
    right: 15px;
  }
  .laserhole-processing .laserhole-processing-price .selectionArea dd .loginBtn a:hover {
    transform: scale(1.05, 1.05);
    background-color: #FFF;
  }
}
.laserhole-processing .laserhole-processing-price .wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 40px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole-processing-price .wrap {
    margin-right: 15px;
  }
}
.laserhole-processing .laserhole-processing-price .wrap .em {
  display: block;
  margin-right: 10px;
}

.laserhole-processing .laserhole-processing-price .wrap .em em {
  font-size: 12px;
  font-style: normal;
}

.laserhole-processing {
  /*////////////////////制作例//////////////////////////////////*/
}

.laserhole-processing .laserhole-examples {
  background-color: #E8F5FB;
  padding-top: 80px;
}

.laserhole-processing .laserhole-examples .ProductionExamplesBox {
  background-color: #FFF;
  padding: 50px 60px 70px;
  max-width: 1080px;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole-examples .ProductionExamplesBox {
    padding: 50px 20px;
  }
}
.laserhole-processing .laserhole-examples .ProductionExamplesBox h2 {
  border-top: 1px solid #1A96D5;
  border-bottom: 1px solid #1A96D5;
  padding: 25px 0;
  font-size: 40px;
  color: #1A96D5;
  text-align: center;
  font-weight: 400;
}

.laserhole-processing .laserhole-examples .ProductionExamplesBox h2 span {
  font-size: 20px;
  font-weight: 700;
  display: block;
  margin-bottom: 20px;
}

.laserhole-processing .laserhole-examples .ProductionExamplesBox .ProductionExamplesTxt {
  text-align: center;
  margin-top: 25px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole-examples .ProductionExamplesBox .ProductionExamplesTxt {
    text-align: left;
    line-height: 1.6;
  }
}
.laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap {
  display: flex;
  justify-content: space-between;
  margin-top: 40px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap {
    display: block;
  }
}
.laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox {
  width: 48%;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox {
    width: 100%;
  }
  .laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox:nth-of-type(2) {
    margin-top: 40px;
  }
}
.laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox .no01 {
  width: 200px;
  margin: 0 auto;
}

.laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox .no02 {
  width: 192px;
  margin: 8px auto 0;
}

.laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox h3 {
  text-align: center;
  font-size: 16px;
  font-weight: 700;
  margin: 35px 0 0;
}

.laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox table {
  margin-top: 24px;
  border-bottom: 1px solid #6A6A6A;
  width: 100%;
}

.laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox table th {
  padding: 8px;
  background-color: #1A96D5;
  color: #FFF;
  font-size: 15px;
  font-weight: 500;
  border-right: 1px solid #FFF;
}

.laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox table td {
  padding: 8px;
  font-size: 14px;
  border-right: 1px solid #6A6A6A;
  border-bottom: 1px solid #D9D9D9;
  line-height: 1.5;
}

.laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox table td span {
  color: #FF205F;
}

.laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox table td.priceBlock {
  text-align: right;
}

.laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox table td.blue-bottom {
  border-bottom: 1px solid #1A96D5;
}

.laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox table td.center {
  text-align: center;
}

.laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox table td.last {
  border-right: none;
}

.laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox table td.last small {
  font-size: 0.7em;
  position: relative;
  bottom: 5px;
}

.laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox table td.gray {
  background-color: #EBEBEB;
}

.laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox table td.TitleBlue {
  border-top: 1px solid #1A96D5;
  border-bottom: 1px solid #1A96D5;
  background-color: #E6F7F8;
  text-align: center;
  color: #1A96D5;
}

.laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox table td.TitleBlue.laser {
  background-color: #E8F5FB;
}

.laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox .priceStrong {
  text-align: right;
  margin-top: 15px;
  margin-right: 30px;
  font-size: 18px;
  font-weight: 700;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox .priceStrong {
    margin-right: 3.5%;
  }
}
.laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox .priceStrong span {
  margin-left: 35px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox .priceStrong span {
    margin-left: 8%;
  }
}
.laserhole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox .small-note {
  font-size: 12px;
  line-height: 1.6;
  margin-left: 1.5em;
  text-indent: -1.5em;
  margin-top: 20px;
}

.laserhole-processing {
  /*////// END 制作例////////////*/
}

.laserhole-processing .Quality-Specifications {
  margin-top: 80px;
  padding: 100px 0 50px;
  background-color: #FFF;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications {
    padding: 80px 0 50px;
  }
}
.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap {
  max-width: 960px;
  margin: 0 auto;
}

@media screen and (max-width: 980px) {
  .laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap {
    padding: 0 20px;
  }
}
.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap h2 {
  text-align: center;
  font-size: 32px;
  font-weight: 400;
  padding-bottom: 15px;
  border-bottom: 1px solid #000;
}

.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap {
  display: flex;
  margin-top: 40px;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap {
    display: block;
  }
}
.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .QualityLeft {
  max-width: 500px;
  margin-right: 50px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .QualityLeft {
    margin-right: 0;
  }
}
.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .QualityLeft .btn-order {
  text-align: left;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .QualityLeft .btn-order {
    text-align: center;
  }
}
.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .QualityLeft .btn-order a {
  display: inline-block;
  border-radius: 10px;
  border: 2px solid #00AEBB;
  padding: 10px 60px 10px 20px;
  color: #00AEBB;
  font-weight: 700;
  margin-top: 15px;
  position: relative;
  background-color: #FFF;
  transition: all 0.2s linear;
}

.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .QualityLeft .btn-order a:hover {
  opacity: 0.5;
}

.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .QualityLeft .btn-order a:after {
  position: absolute;
  content: "";
  width: 24px;
  height: 24px;
  display: block;
  background: url(../img/index/index-arrow.svg) center center/100% 100% no-repeat;
  top: calc(50% - 12px);
  right: 20px;
}

.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .QualityRight {
  width: 390px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .QualityRight {
    width: 100%;
    margin-top: 40px;
  }
}
.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .QualityRight .flexWrap {
  display: flex;
}

.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .QualityRight .flexWrap figure {
  margin-right: 20px;
}

.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .QualityRight .flexWrap figure:last-of-type {
  margin-right: 0;
}

.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .pdf-dl-btn {
  margin-top: 40px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .pdf-dl-btn {
    text-align: center;
    line-height: 1.4;
    margin-right: 30px;
  }
}
.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .pdf-dl-btn a {
  display: inline-block;
  transition: all 0.2s linear;
  color: #000;
  font-weight: 700;
  font-size: 14px;
  position: relative;
}

.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .pdf-dl-btn a span {
  display: inline-block;
  width: 20px;
  position: relative;
  left: 4px;
  top: 5px;
}

.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .pdf-dl-btn a:after {
  content: "";
  width: 20px;
  height: 20px;
  background: url(../img/index/news-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  right: -30px;
  top: 7px;
}

.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap h4 {
  font-size: 18px;
  font-weight: 700;
  color: #1A96D5;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap h4 {
    text-align: center;
  }
}
.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap h4.mt {
  margin-top: 30px;
}

.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .txt01 {
  font-size: 14px;
  line-height: 1.6;
  margin-top: 15px;
}

.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .pdf-dl-btn2 {
  margin-top: 15px;
  text-align: left;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .pdf-dl-btn2 {
    margin-right: 30px;
  }
}
.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .pdf-dl-btn2 a {
  display: inline-block;
  transition: all 0.2s linear;
  color: #000;
  font-weight: 700;
  font-size: 14px;
  position: relative;
}

.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .pdf-dl-btn2 a span {
  display: inline-block;
  width: 20px;
  position: relative;
  left: 4px;
  top: 6px;
}

.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .pdf-dl-btn2 a:after {
  content: "";
  width: 20px;
  height: 20px;
  background: url(../img/index/news-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  right: -30px;
  top: 7px;
}

.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .pdf-dl-btn2 a:hover {
  opacity: 0.5;
}

.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .pdf-dlWrap {
  display: flex;
  margin-top: 20px;
}

@media screen and (max-width: 910px) {
  .laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .pdf-dlWrap {
    flex-wrap: wrap;
    line-height: 1.8;
  }
}
@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .pdf-dlWrap {
    display: block;
    margin: 20px 0 0;
  }
}
.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .pdf-dlWrap .pdf-dl-btn {
  margin-right: 50px;
}

.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .pdf-dlWrap .pdf-dl-btn a {
  display: inline-block;
  transition: all 0.2s linear;
  color: #000;
  font-weight: 700;
  font-size: 14px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .pdf-dlWrap .pdf-dl-btn a {
    line-height: 1.6;
  }
}
.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .pdf-dlWrap .pdf-dl-btn a:after {
  content: "";
  width: 20px;
  height: 20px;
  background: url(../img/index/news-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  right: -30px;
  top: 7px;
}

.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .pdf-dlWrap .pdf-dl-btn a span {
  display: inline-block;
  width: 20px;
  position: relative;
  left: 4px;
  top: 6px;
}

.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .pdf-dlWrap .pdf-dl-btn a:hover {
  opacity: 0.5;
}

.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .pdf-dlWrap .pdf-dl-btn.no-pdf {
  margin-top: 6px;
}

.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .pdf-dlWrap .pdf-dl-btn.no-pdf a:after {
  top: -2px;
}

/*.laserhole-processing .Quality-Specifications .Quality-SpecificationsWrap .pdf-dlWrap .pdf-dl-btn:last-of-type a:after {
  top: 16px;
}*/
.laserhole-processing .Quality-Specifications h3 {
  text-align: center;
  color: #1A96D5;
  font-size: 24px;
  margin-top: 90px;
  background: linear-gradient(#00AEBB, #1A96D5);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.laserhole-processing .Quality-Specifications h3 em {
  font-style: normal;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications h3 {
    line-height: 1.6;
  }
}
.laserhole-processing .Quality-Specifications .SystemArea {
  margin-top: 35px;
  border: 5px solid #B5E7EB;
  padding: 50px;
}

@media screen and (max-width: 840px) {
  .laserhole-processing .Quality-Specifications .SystemArea {
    padding: 35px;
  }
}
@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .SystemArea {
    padding: 30px 20px;
  }
}
.laserhole-processing .Quality-Specifications .SystemArea .cabistaWrap {
  max-width: 514px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .SystemArea .cabistaWrap {
    display: block;
  }
}
.laserhole-processing .Quality-Specifications .SystemArea .cabistaWrap .cabistaImg01 {
  width: 24.5%;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .SystemArea .cabistaWrap .cabistaImg01 {
    width: 126px;
    margin: 0 auto;
  }
}
.laserhole-processing .Quality-Specifications .SystemArea .cabistaWrap .cabistaImg02 {
  width: 65.2%;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .SystemArea .cabistaWrap .cabistaImg02 {
    width: 96%;
    margin: 20px auto 0;
  }
}
.laserhole-processing .Quality-Specifications .SystemArea h4 {
  font-size: 20px;
  font-weight: 700;
  color: #000;
  text-align: center;
  margin-top: 30px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .SystemArea h4 {
    line-height: 1.6;
  }
}
.laserhole-processing .Quality-Specifications .SystemArea .cabistaSystemTxt {
  font-size: 15px;
  line-height: 1.7;
  margin-top: 30px;
  padding: 0 52px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .SystemArea .cabistaSystemTxt {
    padding: 0;
  }
}
.laserhole-processing .Quality-Specifications .SystemArea .CabistaBtn {
  margin-top: 30px;
  text-align: center;
}

.laserhole-processing .Quality-Specifications .SystemArea .CabistaBtn a {
  background: linear-gradient(90deg, rgb(0, 174, 187) 0%, rgb(26, 150, 213) 100%);
  display: inline-block;
  color: #FFF;
  padding: 20px 55px 20px 25px;
  position: relative;
  border-radius: 30px;
  transition: all 0.2s linear;
}

.laserhole-processing .Quality-Specifications .SystemArea .CabistaBtn a:after {
  content: "";
  width: 24px;
  height: 24px;
  position: absolute;
  right: 20px;
  top: calc(50% - 12px);
  background: url(../img/smartorder/cabista-arrow.svg) center center/100% 100% no-repeat;
}

.laserhole-processing .Quality-Specifications .SystemArea .CabistaBtn a:hover {
  opacity: 0.5;
}

.laserhole-processing .Quality-Specifications .SystemArea .ImgWrap {
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .SystemArea .ImgWrap {
    display: block;
  }
}
.laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .HoleProcessingLeft {
  width: 48.5%;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .HoleProcessingLeft {
    width: 100%;
  }
}
.laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .HoleProcessingRight {
  width: 48.5%;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .HoleProcessingRight {
    width: 100%;
  }
}
.laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .HoleProcessing {
  width: 100%;
  margin-top: 10px;
}

.laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .HoleProcessing li {
  border: 2px solid #1D1D1D;
  background-color: #00AEBB;
  position: relative;
}

.laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .HoleProcessing li a {
  transition: all 0.2s linear;
}

.laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .HoleProcessing li a:hover {
  opacity: 0.5;
}

.laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .HoleProcessing li .TitleTxt {
  text-align: center;
  background-color: #1D1D1D;
  font-size: 14px;
  color: #FFF;
  padding: 10px 0;
}

.laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .HoleProcessing li .inpdd {
  color: #FFF;
  padding: 35px 0 30px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

.laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .HoleProcessing li .inpdd h4 {
  color: #FFF;
  font-size: 28px;
  font-weight: 900;
  width: 100%;
  margin: 0;
}

.laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .HoleProcessing li .inpdd .Hole-p-txt {
  font-size: 15px;
  line-height: 1.4;
  margin-top: 20px;
  display: inline-block;
}

.laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .HoleProcessing li .inpdd .Hole-p-txt span {
  opacity: 0.6;
}

.laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .HoleProcessing li .inpdd .Hole-p-txt em {
  color: #FFF45E;
  font-style: normal;
  font-weight: 900;
}

.laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .HoleProcessing li .HoleProcessingArrow {
  width: 24px;
  height: 24px;
  position: absolute;
  right: 20px;
  bottom: 20px;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .HoleProcessing li .HoleProcessingArrow {
    width: 20px;
    height: 20px;
    position: absolute;
    right: 10px;
    bottom: 10px;
  }
}
.laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .HoleProcessing li.Right {
  background-color: #3F82DE;
  margin-top: 0;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .HoleProcessing li.Right {
    margin-top: 20px;
  }
}
.laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .HoleProcessing li.Right .inpdd {
  color: #FFF;
  padding: 46px 0 41px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

.laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .CabistaFukidashi {
  width: 420px;
  height: 70px;
  background: url(../img/laserhole-processing/HoleProcessing-fukidashi3.svg) top left/100% auto no-repeat;
  box-sizing: border-box;
  font-size: 22px;
  font-weight: 700;
  padding: 18px 0 0 20px;
  margin: 70px auto 0;
  position: relative;
}

@media screen and (max-width: 980px) {
  .laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .CabistaFukidashi {
    width: 100%;
    font-size: 18px;
  }
}
@media screen and (max-width: 840px) {
  .laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .CabistaFukidashi {
    font-size: 17px;
    padding: 14px 0 0 15px;
  }
}
@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .CabistaFukidashi {
    width: 285px;
    height: 65px;
    margin: 60px auto 0;
    padding: 17px 0 0 15px;
    font-size: 15px;
    background: url(../img/smartorder/SP-HoleProcessing-fukidashi.svg) top left/100% auto no-repeat;
  }
}
.laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .img {
  width: 152px;
  position: absolute;
  right: 10px;
  top: -14px;
}

@media screen and (max-width: 980px) {
  .laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .img {
    width: 120px;
  }
}
@media screen and (max-width: 840px) {
  .laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .img {
    width: 100px;
  }
}
@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .SystemArea .ImgWrap .img {
    right: 0;
    width: 92px;
    top: -5px;
  }
}
.laserhole-processing .Quality-Specifications .SystemArea .CabistaFukidashi2 {
  width: 420px;
  height: 70px;
  background: url(../img/laserhole-processing/HoleProcessing-fukidashi2.svg) top left/100% auto no-repeat;
  box-sizing: border-box;
  font-size: 22px;
  font-weight: 700;
  padding: 18px 0 0 20px;
  margin: 70px auto 0;
  position: relative;
}

@media screen and (max-width: 980px) {
  .laserhole-processing .Quality-Specifications .SystemArea .CabistaFukidashi2 {
    width: 100%;
    font-size: 18px;
  }
}
@media screen and (max-width: 840px) {
  .laserhole-processing .Quality-Specifications .SystemArea .CabistaFukidashi2 {
    font-size: 17px;
    padding: 14px 0 0 15px;
  }
}
@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .SystemArea .CabistaFukidashi2 {
    width: 285px;
    height: 65px;
    margin: 60px auto 0;
    padding: 17px 0 0 15px;
    font-size: 15px;
    background: url(../img/smartorder/SP-HoleProcessing-fukidashi.svg) top left/100% auto no-repeat;
  }
}
.laserhole-processing .Quality-Specifications .SystemArea .CabistaFukidashi2 .img {
  width: 121px;
  position: absolute;
  right: 10px;
  top: -25px;
}

@media screen and (max-width: 980px) {
  .laserhole-processing .Quality-Specifications .SystemArea .CabistaFukidashi2 .img {
    width: 100px;
  }
}
@media screen and (max-width: 840px) {
  .laserhole-processing .Quality-Specifications .SystemArea .CabistaFukidashi2 .img {
    width: 94px;
  }
}
@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .SystemArea .CabistaFukidashi2 .img {
    top: -20px;
    right: 0;
  }
}
.laserhole-processing .Quality-Specifications .btn-txt {
  margin-top: 50px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .laserhole-processing .Quality-Specifications .btn-txt {
    line-height: 1.5;
  }
}
.laserhole-processing .Quality-Specifications .loginBtn {
  margin-top: 15px;
  text-align: center;
}

.laserhole-processing .Quality-Specifications .loginBtn a {
  display: inline-block;
  padding: 15px 50px 15px 20px;
  font-size: 15px;
  font-weight: 700;
  position: relative;
  color: #000;
  background-color: #FFF45E;
  border: 2px solid #00AEBB;
  border-radius: 30px;
  transition: all 0.2s linear;
}

.laserhole-processing .Quality-Specifications .loginBtn a span {
  font-size: 14px;
  font-weight: 400;
}

.laserhole-processing .Quality-Specifications .loginBtn a:after {
  content: "";
  width: 24px;
  height: 24px;
  background: url(../img/index/index-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  top: calc(50% - 12px);
  right: 15px;
}

.laserhole-processing .Quality-Specifications .loginBtn a:hover {
  transform: scale(1.05, 1.05);
  background-color: #FFF;
}

/*////// END 品質・仕様////////////*/
/*/////////////////////////////////// マシニング穴加工 //////////////////////////////////////*/
.machininghole-processing .mainimg {
  height: 670px;
  background: url(../img/machininghole-processing/bk-triangle.svg) right bottom no-repeat #3F82DE;
  padding: 55px 0 20px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .mainimg {
    height: 700px;
    padding: 30px 0px 20px;
  }
}
.machininghole-processing .mainimg .in_wrap {
  max-width: 1056px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 1082px) {
  .machininghole-processing .mainimg .in_wrap {
    padding: 0 20px;
  }
}
@media screen and (max-width: 767px) {
  .machininghole-processing .mainimg .in_wrap {
    display: block;
  }
}
.machininghole-processing .mainimg .mainLeft {
  width: 46.1%;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .mainimg .mainLeft {
    width: 100%;
  }
  .machininghole-processing .mainimg .mainLeft .castam {
    width: 200px;
    margin: 0 auto;
  }
}
.machininghole-processing .mainimg .mainLeft .blackBk {
  transform: skewX(-15deg);
  background-color: #000;
  text-align: center;
  font-size: 18px;
  font-weight: 700;
  padding: 8px 0;
  color: #FFF;
  margin-top: 20px;
  position: relative;
}

.machininghole-processing .mainimg .mainLeft h1 {
  margin-top: 20px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .mainimg .mainLeft h1 {
    width: 100%;
    margin: 20px auto 0;
  }
}
.machininghole-processing .mainimg .mainLeft .MainLeftWrap {
  margin-top: 120px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .mainimg .mainLeft .MainLeftWrap {
    margin-top: 162px;
  }
}
.machininghole-processing .mainimg .mainLeft .MainLeftWrap figure {
  width: 248px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .mainimg .mainLeft .MainLeftWrap figure {
    width: 198px;
  }
}
.machininghole-processing .mainimg .mainLeft .MainLeftWrap .mainimg-txt {
  position: absolute;
  top: 50%;
  left: 280px;
  font-size: 16px;
  line-height: 2;
  color: #FFF;
  transform: translateY(-35%);
  width: 520px;
}

@media screen and (max-width: 1000px) {
  .machininghole-processing .mainimg .mainLeft .MainLeftWrap .mainimg-txt {
    width: 300px;
  }
}
@media screen and (max-width: 828px) {
  .machininghole-processing .mainimg .mainLeft .MainLeftWrap .mainimg-txt {
    margin-top: 50px;
    width: 240px;
  }
}
@media screen and (max-width: 767px) {
  .machininghole-processing .mainimg .mainLeft .MainLeftWrap .mainimg-txt {
    display: none;
    margin-top: 0;
  }
}
.machininghole-processing .mainimg .mainLeft p span {
  transform: skewX(15deg);
  display: block;
}

.machininghole-processing .mainimg .SP-mainimg-txt {
  display: none;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .mainimg .SP-mainimg-txt {
    display: block;
    line-height: 1.6;
    margin-top: 45px;
    color: #3F82DE;
    font-weight: 700;
  }
}
.machininghole-processing .mainimg .mainRight {
  width: 45.5%;
  position: relative;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .mainimg .mainRight {
    width: 100%;
  }
}
.machininghole-processing .mainimg .mainRight .whiteBlock {
  padding: 15px 15px 15px 40px;
  transform: skewX(-15deg);
  background-color: #FFF;
  margin-top: 98px;
  width: 70%;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .mainimg .mainRight .whiteBlock {
    transform: skewX(0deg);
    margin-top: 15px;
    padding: 10px;
    text-align: center;
    position: relative;
    width: 100%;
  }
}
.machininghole-processing .mainimg .mainRight .whiteBlock span {
  display: block;
  font-size: 20px;
  font-weight: 700;
  transform: skewX(15deg);
  line-height: 2;
  color: #1A96D5;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .mainimg .mainRight .whiteBlock span {
    transform: skewX(0deg);
  }
}
.machininghole-processing .mainimg .mainRight .whiteBlock span strong {
  font-size: 28px;
  display: inline-block;
  text-decoration: underline;
  text-decoration-color: #FF205F;
  text-underline-offset: 8px;
  margin-left: 0.2em;
}

.machininghole-processing .mainimg .mainRight .whiteBlock span strong em {
  font-style: normal;
  font-size: 24px;
}

.machininghole-processing .mainimg .mainRight .whiteBlock span strong.red {
  color: #FF205F;
}

.machininghole-processing .mainimg .mainRight figure {
  width: 280px;
  position: absolute;
  right: -100px;
  top: 250px;
}

@media screen and (max-width: 1274px) {
  .machininghole-processing .mainimg .mainRight figure {
    right: 0;
    width: 200px;
  }
}
@media screen and (max-width: 767px) {
  .machininghole-processing .mainimg .mainRight figure {
    top: -290px;
    right: -10px;
    width: 180px;
  }
}
.machininghole-processing .pageNavi {
  background-color: #FFF;
  position: sticky;
  top: 83px;
  z-index: 8;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .pageNavi {
    display: none;
  }
}
.machininghole-processing .pageNavi ul {
  display: flex;
  justify-content: center;
  border-bottom: 1px solid #000;
}

.machininghole-processing .pageNavi ul li {
  display: inline-block;
}

.machininghole-processing .pageNavi ul li a {
  display: block;
  padding: 10px 40px 10px 20px;
  color: #4C4948;
  font-size: 16px;
  font-weight: 700;
  background: url(../img/smartorder/navi-arrow.svg) 92% 15px no-repeat;
  border-right: 1px solid #000;
  transition: all 0.2s linear;
}

.machininghole-processing .pageNavi ul li:first-of-type a {
  border-left: 1px solid #000;
}

.machininghole-processing .standard-parts {
  background-color: #EBF2FC;
  padding-top: 50px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .standard-parts {
    padding-top: 165px;
  }
}
.machininghole-processing .standard-parts .standard-partsBlock {
  max-width: 960px;
  margin: 0 auto;
  border: 1px solid #3F82DE;
  padding: 55px 100px 80px;
  text-align: center;
  background-color: #FFF;
}

@media screen and (max-width: 980px) {
  .machininghole-processing .standard-parts .standard-partsBlock {
    padding: 50px 50px 60px;
    margin: 0 20px;
  }
}
@media screen and (max-width: 767px) {
  .machininghole-processing .standard-parts .standard-partsBlock {
    margin: 0 20px;
    padding: 40px 20px;
  }
}
.machininghole-processing .standard-parts .standard-partsBlock .topTxt {
  font-size: 36px;
  font-weight: 500;
  color: #3F82DE;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .standard-parts .standard-partsBlock .topTxt {
    font-size: 24px;
  }
}
.machininghole-processing .standard-parts .standard-partsBlock h2 {
  font-size: 36px;
  font-weight: 900;
  color: #3F82DE;
  margin-top: 20px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .standard-parts .standard-partsBlock h2 {
    font-size: 24px;
    line-height: 1.6;
  }
}
.machininghole-processing .standard-parts .standard-partsBlock h2 span {
  text-decoration: underline;
  text-underline-offset: 8px;
  text-decoration-color: #FFF45E;
  text-decoration-thickness: 4px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .standard-parts .standard-partsBlock h2 span {
    text-underline-offset: 5px;
  }
}
.machininghole-processing .standard-parts .standard-partsBlock .middleTxt {
  margin-top: 25px;
  line-height: 1.7;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .standard-parts .standard-partsBlock .middleTxt {
    text-align: left;
  }
}
.machininghole-processing .standard-parts .standard-partsBlock .partsBlockList {
  margin: 50px auto 0;
  display: flex;
  justify-content: space-between;
  max-width: 410px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .standard-parts .standard-partsBlock .partsBlockList {
    margin: 50px 10px 0;
  }
}
.machininghole-processing .standard-parts .standard-partsBlock .partsBlockList li {
  width: 45%;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .standard-parts .standard-partsBlock .partsBlockList li {
    width: 46%;
  }
}
.machininghole-processing .standard-parts .standard-partsBlock .partsBlockList li figure img {
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .standard-parts .standard-partsBlock .partsBlockList li figure img {
    width: 70%;
  }
}
.machininghole-processing .standard-parts .standard-partsBlock .partsBlockList li .detailTxt {
  font-weight: 700;
  margin-top: 20px;
  color: #3F82DE;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .standard-parts .standard-partsBlock .partsBlockList li .detailTxt {
    line-height: 1.4;
    font-size: 15px;
  }
}
.machininghole-processing .standard-parts .standard-partsBlock .partsBlockList li:last-of-type figure {
  margin: 44px 0;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .standard-parts .standard-partsBlock .partsBlockList li:last-of-type figure {
    margin: 35px 0;
  }
}
.machininghole-processing .standard-parts .standard-partsBlock .partsNote {
  text-align: center;
  font-size: 12px;
  margin-top: 25px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .standard-parts .standard-partsBlock .partsNote {
    text-align: left;
    line-height: 1.6;
    margin-left: 10px;
  }
}
.machininghole-processing .CompatibleModels {
  padding-top: 80px;
  background-color: #EBF2FC;
}

.machininghole-processing .machininghole_inWrap {
  max-width: 960px;
  margin: 0 auto;
  text-align: center;
}

.machininghole-processing .machininghole_inWrap h2 {
  padding: 15px 0;
  font-size: 32px;
  color: #FFF;
  font-weight: 400;
  background-color: #3F82DE;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .machininghole_inWrap h2 {
    font-size: 24px;
  }
}
.machininghole-processing .machininghole_inWrap h3 {
  font-size: 32px;
  font-weight: 700;
  color: #3F82DE;
  margin-top: 45px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .machininghole_inWrap h3 {
    line-height: 1.6;
  }
}
.machininghole-processing .machininghole_inWrap h3 span {
  color: #FF205F;
}

.machininghole-processing .machininghole_inWrap .machininghole {
  margin-top: 20px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .machininghole_inWrap .machininghole {
    margin: 20px 20px 0;
    line-height: 1.6;
    text-align: left;
  }
}
.machininghole-processing .machininghole_inWrap .Cabinet-Standard {
  max-width: 724px;
  margin: 30px auto 0;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .machininghole_inWrap .Cabinet-Standard {
    margin: 30px 20px 0;
  }
}
.machininghole-processing .machininghole_inWrap .btn-order {
  text-align: center;
  margin-top: 30px;
}

.machininghole-processing .machininghole_inWrap .btn-order a {
  display: inline-block;
  border-radius: 10px;
  border: 2px solid #3F82DE;
  padding: 10px 60px 10px 20px;
  color: #3F82DE;
  font-weight: 700;
  position: relative;
  background-color: #FFF;
  transition: all 0.2s linear;
  cursor: pointer;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .machininghole_inWrap .btn-order a {
    font-size: 15px;
    padding: 10px 50px 10px 10px;
  }
}
.machininghole-processing .machininghole_inWrap .btn-order a:after {
  position: absolute;
  content: "";
  width: 24px;
  height: 24px;
  display: block;
  background: url(../img/common/footarrow03.svg) center center/100% 100% no-repeat;
  top: calc(50% - 12px);
  right: 20px;
}

.machininghole-processing .machininghole_inWrap .btn-order a:hover {
  opacity: 0.5;
}

.machininghole-processing .machininghole_inWrap .LinkList {
  margin-top: 15px;
  display: flex;
  justify-content: center;
}

.machininghole-processing .machininghole_inWrap .LinkList li {
  display: inline-block;
  padding-right: 20px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .machininghole_inWrap .LinkList li {
    text-align: left;
  }
}
.machininghole-processing .machininghole_inWrap .LinkList li a {
  font-size: 14px;
  font-weight: 700;
  color: #000;
  position: relative;
  transition: all 0.2s linear;
}

.machininghole-processing .machininghole_inWrap .LinkList li a:hover {
  opacity: 0.5;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .machininghole_inWrap .LinkList li a {
    line-height: 1.6;
  }
}
.machininghole-processing .machininghole_inWrap .LinkList li a:after {
  position: absolute;
  width: 20px;
  height: 20px;
  content: "";
  background: url(../img/index/news-arrow.svg) center center/100% 100% no-repeat;
  right: -24px;
  top: calc(50% - 10px);
}

@media screen and (max-width: 767px) {
  .machininghole-processing .machininghole_inWrap .LinkList li a:after {
    right: -48px;
  }
}
.machininghole-processing .delivery-date {
  padding-top: 60px;
  background-color: #EBF2FC;
  text-align: left;
}

.machininghole-processing .delivery-date .delivery-dateTxt {
  max-width: 546px;
  margin: 30px auto 0;
  text-align: left;
  font-size: 12px;
  line-height: 1.6;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .delivery-date .delivery-dateTxt {
    text-align: left;
    margin: 30px 20px 0;
  }
  .machininghole-processing .delivery-date .delivery-dateTxt span {
    display: block;
    margin-left: 1em;
    text-indent: -1em;
  }
}
.machininghole-processing .delivery-date .delivery-dateTxt .l-s {
  font-style: normal;
}

.machininghole-processing .delivery-date .selectionArea {
  border: 4px solid #9FC0EF;
  padding: 10px 40px 25px;
  display: block;
  margin-top: 40px;
}

@media screen and (max-width: 980px) {
  .machininghole-processing .delivery-date .selectionArea {
    padding: 10px 25px 25px;
    margin: 40px 20px 0;
  }
}
@media screen and (max-width: 767px) {
  .machininghole-processing .delivery-date .selectionArea {
    padding: 20px;
    margin: 40px 20px 0;
  }
}
.machininghole-processing .delivery-date .selectionArea .Confirmation-DeliveryDates {
  font-size: 18px;
  margin: 20px 0 0;
  font-weight: 700;
  text-align: center;
  color: #000;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .delivery-date .selectionArea .Confirmation-DeliveryDates {
    line-height: 1.8;
    text-align: left;
  }
}
.machininghole-processing .delivery-date .selectionArea .Confirmation-DeliveryDates .UL {
  text-decoration: underline;
  text-underline-offset: 8px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .delivery-date .selectionArea .Confirmation-DeliveryDates .UL {
    text-underline-offset: 5px;
  }
}
.machininghole-processing .delivery-date .selectionArea .Confirmation-DeliveryDates .red {
  color: #FF205F;
}

.machininghole-processing .delivery-date .selectionArea .calenderList {
  max-width: 774px;
  margin: 40px auto 0;
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .delivery-date .selectionArea .calenderList {
    display: block;
  }
}
.machininghole-processing .delivery-date .selectionArea .calenderList li {
  width: 42.3%;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .delivery-date .selectionArea .calenderList li {
    width: 100%;
  }
}
.machininghole-processing .delivery-date .selectionArea .calenderList li:last-of-type {
  width: 53.5%;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .delivery-date .selectionArea .calenderList li:last-of-type {
    width: 100%;
    margin-top: 20px;
  }
}
.machininghole-processing .delivery-date .selectionArea .calenderList li .calender-note {
  font-size: 12px;
  margin-top: 10px;
  text-align: left;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .delivery-date .selectionArea .calenderList li .calender-note {
    line-height: 1.6;
    margin-left: 1em;
    text-indent: -1em;
  }
}
.machininghole-processing .delivery-date .selectionArea .pdf-dl-btn {
  margin: 15px auto 0;
  max-width: 774px;
  padding-right: 28px;
  box-sizing: border-box;
  text-align: right;
}

.machininghole-processing .delivery-date .selectionArea .pdf-dl-btn a {
  display: inline-block;
  transition: all 0.2s linear;
  color: #000;
  font-weight: 700;
  font-size: 14px;
  position: relative;
}

.machininghole-processing .delivery-date .selectionArea .pdf-dl-btn a:hover {
  opacity: 0.5;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .delivery-date .selectionArea .pdf-dl-btn a {
    line-height: 1.6;
  }
}
.machininghole-processing .delivery-date .selectionArea .pdf-dl-btn a:after {
  content: "";
  width: 20px;
  height: 20px;
  background: url(../img/index/news-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  right: -30px;
  top: -2px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .delivery-date .selectionArea .pdf-dl-btn a:after {
    top: 10px;
  }
}
.machininghole-processing .delivery-date .selectionArea .loginBtn {
  margin: 25px 0 15px;
  text-align: center;
}

.machininghole-processing .delivery-date .selectionArea .loginBtn a {
  display: inline-block;
  padding: 15px 50px 15px 20px;
  font-size: 15px;
  font-weight: 700;
  position: relative;
  color: #000;
  background-color: #FFF45E;
  border: 2px solid #00AEBB;
  border-radius: 30px;
  transition: all 0.2s linear;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .delivery-date .selectionArea .loginBtn a {
    padding: 15px 45px 15px 15px;
    text-align: left;
    line-height: 1.4;
  }
}
.machininghole-processing .delivery-date .selectionArea .loginBtn a span {
  font-weight: 500;
  font-size: 0.9em;
}

.machininghole-processing .delivery-date .selectionArea .loginBtn a:after {
  content: "";
  width: 24px;
  height: 24px;
  background: url(../img/index/index-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  top: calc(50% - 12px);
  right: 15px;
}

.machininghole-processing .delivery-date .selectionArea .loginBtn a:hover {
  transform: scale(1.05, 1.05);
  background-color: #FFF;
}

.machininghole-processing .machininghole-processing-price {
  padding-top: 80px;
  background-color: #EBF2FC;
}

.machininghole-processing .machininghole-processing-price .ReasonableBox {
  display: flex;
  justify-content: space-between;
  margin: 30px auto 0;
  max-width: 840px;
}

@media screen and (max-width: 980px) {
  .machininghole-processing .machininghole-processing-price .ReasonableBox {
    max-width: 780px;
  }
}
@media screen and (max-width: 767px) {
  .machininghole-processing .machininghole-processing-price .ReasonableBox {
    margin: 40px 85px 0;
    display: block;
  }
}
.machininghole-processing .machininghole-processing-price .ReasonableBox li {
  padding: 10px 12px 8px;
  border: 2px solid #3F82DE;
  border-radius: 8px;
  background-color: #FFF;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  box-shadow: 3px 3px 6px 0px rgba(100, 100, 100, 0.4);
}

@media screen and (max-width: 980px) {
  .machininghole-processing .machininghole-processing-price .ReasonableBox li {
    padding: 10px 8px 8px;
  }
}
@media screen and (max-width: 767px) {
  .machininghole-processing .machininghole-processing-price .ReasonableBox li {
    margin-top: 50px;
  }
  .machininghole-processing .machininghole-processing-price .ReasonableBox li:nth-of-type(2) {
    margin-top: 40px;
  }
}
.machininghole-processing .machininghole-processing-price .ReasonableBox li.pd {
  padding: 10px 20px 8px;
}

@media screen and (max-width: 980px) {
  .machininghole-processing .machininghole-processing-price .ReasonableBox li.pd {
    padding: 10px 16px 8px;
  }
}
@media screen and (max-width: 767px) {
  .machininghole-processing .machininghole-processing-price .ReasonableBox li.pd {
    padding: 10px 12px 10px;
  }
}
.machininghole-processing .machininghole-processing-price .ReasonableBox li .mainTxt {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
  color: #3F82DE;
}

.machininghole-processing .machininghole-processing-price .ReasonableBox li .subTxt {
  font-size: 16px;
  font-weight: 700;
  color: #FF205F;
  margin-top: 24px;
}

.machininghole-processing .machininghole-processing-price .ReasonableBox li .subTxt small {
  font-size: 0.8em;
  position: relative;
  bottom: 6px;
}

.machininghole-processing .machininghole-processing-price .ReasonableBox li:after {
  content: "＋";
  position: absolute;
  right: -33px;
  font-size: 24px;
  font-weight: 700;
  top: calc(50% - 12px);
  color: #3F82DE;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .machininghole-processing-price .ReasonableBox li:after {
    right: calc(50% - 12px);
    top: 110%;
  }
}
.machininghole-processing .machininghole-processing-price .ReasonableBox li table {
  margin-top: 10px;
  border-top: 1px solid #9FC0EF;
  border-right: 1px solid #9FC0EF;
}

.machininghole-processing .machininghole-processing-price .ReasonableBox li table th {
  border-bottom: 1px solid #8CCAEA;
  border-left: 1px solid #8CCAEA;
  padding: 5px;
  background-color: #EBF2FC;
  font-size: 14px;
  color: #3F82DE;
  font-weight: 500;
}

.machininghole-processing .machininghole-processing-price .ReasonableBox li table td {
  border-bottom: 1px solid #8CCAEA;
  border-left: 1px solid #8CCAEA;
  padding: 5px;
  font-size: 15px;
  font-weight: 400;
}

.machininghole-processing .machininghole-processing-price .ReasonableBox li:last-of-type:after {
  display: none;
}

.machininghole-processing .machininghole-processing-price .Reasonable-note {
  font-size: 12px;
  text-align: left;
  margin: 20px auto 0;
  max-width: 784px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .machininghole-processing-price .Reasonable-note {
    margin: 20px 20px 0;
    line-height: 1.6;
  }
}
.machininghole-processing .machininghole-processing-price .wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 30px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .machininghole-processing-price .wrap {
    margin-right: 15px;
  }
}
.machininghole-processing .machininghole-processing-price .wrap .txt {
  margin-right: 10px;
  margin-top: 6px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .machininghole-processing-price .wrap .txt {
    margin-right: 6px;
  }
}
.machininghole-processing .machininghole-processing-price .wrap .txt em {
  font-size: 12px;
  font-style: normal;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .machininghole-processing-price .wrap .txt em {
    font-size: 11px;
  }
}
.machininghole-processing .machininghole-processing-price .pdf-dl-btn {
  text-align: center;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .machininghole-processing-price .pdf-dl-btn {
    line-height: 1.4;
    margin: 0px;
  }
}
.machininghole-processing .machininghole-processing-price .pdf-dl-btn a {
  display: inline-block;
  transition: all 0.2s linear;
  color: #000;
  font-weight: 700;
  font-size: 14px;
  position: relative;
}

.machininghole-processing .machininghole-processing-price .pdf-dl-btn a em {
  font-size: 12px;
  font-weight: 400;
  font-style: normal;
  margin-right: 1em;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .machininghole-processing-price .pdf-dl-btn a em {
    display: block;
  }
}
.machininghole-processing .machininghole-processing-price .pdf-dl-btn a span {
  display: inline-block;
  width: 20px;
  position: relative;
  left: 4px;
  top: 5px;
}

.machininghole-processing .machininghole-processing-price .pdf-dl-btn a:after {
  content: "";
  width: 20px;
  height: 20px;
  background: url(../img/index/news-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  right: -30px;
  top: 7px;
}

.machininghole-processing .machininghole-processing-price .pdf-dl-btn a:hover {
  opacity: 0.5;
}

.machininghole-processing .machininghole-processing-price .selectionArea {
  border: 4px solid #8CCAEA;
  padding: 30px 40px 30px;
  display: flex;
  justify-content: space-between;
  margin-top: 40px;
}

@media screen and (max-width: 980px) {
  .machininghole-processing .machininghole-processing-price .selectionArea {
    margin: 40px 20px 0;
    padding: 30px 30px 30px;
  }
}
@media screen and (max-width: 767px) {
  .machininghole-processing .machininghole-processing-price .selectionArea {
    display: block;
    padding: 30px 20px;
    margin: 40px 20px 0px;
  }
}
.machininghole-processing .machininghole-processing-price .selectionArea dt {
  width: 48.2%;
  text-align: left;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .machininghole-processing-price .selectionArea dt {
    width: 100%;
  }
}
.machininghole-processing .machininghole-processing-price .selectionArea dt .selectionTitle {
  margin-top: 25px 0 0;
  font-size: 18px;
  color: #000;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .machininghole-processing-price .selectionArea dt .selectionTitle {
    margin: 0;
  }
}
.machininghole-processing .machininghole-processing-price .selectionArea dt p {
  font-size: 15px;
  line-height: 1.7;
  margin-top: 20px;
}

.machininghole-processing .machininghole-processing-price .selectionArea dd {
  width: 43.3%;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .machininghole-processing-price .selectionArea dd {
    width: 100%;
  }
  .machininghole-processing .machininghole-processing-price .selectionArea dd figure {
    margin-top: 20px;
  }
}
.machininghole-processing .machininghole-processing-price .loginBtn {
  margin-top: 30px;
  text-align: left;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .machininghole-processing-price .loginBtn {
    text-align: center;
  }
}
.machininghole-processing .machininghole-processing-price .loginBtn a {
  display: inline-block;
  padding: 15px 50px 15px 20px;
  font-size: 15px;
  font-weight: 700;
  position: relative;
  color: #000;
  background-color: #FFF45E;
  border: 2px solid #00AEBB;
  border-radius: 30px;
  transition: all 0.2s linear;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .machininghole-processing-price .loginBtn a {
    text-align: left;
    line-height: 1.4;
  }
}
.machininghole-processing .machininghole-processing-price .loginBtn a span {
  font-size: 14px;
  font-weight: 400;
}

.machininghole-processing .machininghole-processing-price .loginBtn a:after {
  content: "";
  width: 24px;
  height: 24px;
  background: url(../img/index/index-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  top: calc(50% - 12px);
  right: 15px;
}

.machininghole-processing .machininghole-processing-price .loginBtn a:hover {
  transform: scale(1.05, 1.05);
  background-color: #FFF;
}

.machininghole-processing .laserhole-examples {
  background-color: #EBF2FC;
  padding-top: 80px;
  padding-bottom: 80px;
}

.machininghole-processing .laserhole-examples .ProductionExamplesBox {
  background-color: #FFF;
  padding: 50px 60px 70px;
  max-width: 1080px;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .laserhole-examples .ProductionExamplesBox {
    padding: 50px 20px;
  }
}
.machininghole-processing .laserhole-examples .ProductionExamplesBox h2 {
  border-top: 1px solid #3F82DE;
  border-bottom: 1px solid #3F82DE;
  padding: 25px 0;
  font-size: 40px;
  color: #3F82DE;
  text-align: center;
  font-weight: 400;
}

.machininghole-processing .laserhole-examples .ProductionExamplesBox h2 span {
  font-size: 20px;
  font-weight: 700;
  display: block;
  margin-bottom: 20px;
}

.machininghole-processing .laserhole-examples .ProductionExamplesBox .ProductionExamplesTxt {
  text-align: center;
  margin-top: 25px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .laserhole-examples .ProductionExamplesBox .ProductionExamplesTxt {
    text-align: left;
    line-height: 1.6;
  }
}
.machininghole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap {
  display: flex;
  justify-content: center;
  margin-top: 40px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap {
    display: block;
  }
}
.machininghole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox {
  width: 50%;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox {
    width: 100%;
  }
}
.machininghole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox .no01 {
  width: 202px;
  margin: 0 auto;
}

.machininghole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox h3 {
  text-align: center;
  font-size: 16px;
  font-weight: 700;
  margin: 35px 0 0;
}

.machininghole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox table {
  margin-top: 24px;
  border-bottom: 1px solid #6A6A6A;
  width: 100%;
}

.machininghole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox table th {
  padding: 8px;
  background-color: #3F82DE;
  color: #FFF;
  font-size: 15px;
  font-weight: 500;
  border-right: 1px solid #FFF;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox table th {
    font-size: 14px;
  }
}
.machininghole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox table td {
  padding: 8px;
  font-size: 14px;
  border-right: 1px solid #6A6A6A;
  border-bottom: 1px solid #D9D9D9;
  line-height: 1.5;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox table td {
    font-size: 13px;
  }
}
.machininghole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox table td span {
  color: #FF205F;
}

.machininghole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox table td.last {
  border-right: none;
}

.machininghole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox table td.center {
  text-align: center;
}

.machininghole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox table td.gray {
  background-color: #EBEBEB;
}

.machininghole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox table td.priceBlock {
  text-align: right;
}

.machininghole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox .priceStrong {
  text-align: right;
  margin-top: 15px;
  margin-right: 30px;
  font-size: 18px;
  font-weight: 700;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox .priceStrong {
    margin-right: 12px;
  }
}
.machininghole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox .priceStrong span {
  margin-left: 35px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .laserhole-examples .ProductionExamplesBox .CabinetWrap .CabinetBox .priceStrong span {
    margin-left: 25px;
  }
}
.machininghole-processing .Quality-Specifications {
  padding: 100px 0 50px;
  background-color: #FFF;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications {
    padding: 80px 0 50px;
  }
}
.machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap {
  max-width: 960px;
  margin: 0 auto;
}

@media screen and (max-width: 980px) {
  .machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap {
    padding: 0 20px;
  }
}
.machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap h2 {
  text-align: center;
  font-size: 32px;
  font-weight: 400;
  padding-bottom: 15px;
  border-bottom: 1px solid #000;
}

.machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap {
  display: flex;
  margin-top: 40px;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap {
    display: block;
  }
}
.machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .QualityLeft {
  max-width: 500px;
  margin-right: 50px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .QualityLeft {
    width: 100%;
    margin: 0;
  }
}
.machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .QualityRight {
  width: 390px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .QualityRight {
    width: 100%;
  }
  .machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap .QualityWrap .QualityRight .flexWrap figure {
    margin-top: 20px;
  }
}
.machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap h4 {
  font-size: 18px;
  font-weight: 700;
  color: #3F82DE;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap h4 {
    text-align: center;
  }
}
.machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap h4.mt {
  margin-top: 30px;
}

.machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap .txt01 {
  font-size: 14px;
  line-height: 1.6;
  margin-top: 15px;
}

.machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap .img02 {
  width: 150px;
  margin-top: 20px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap .img02 {
    text-align: center;
    margin: 20px auto 0;
  }
}
.machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap .flexWrap2 {
  display: flex;
  align-items: center;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap .flexWrap2 {
    display: block;
  }
}
.machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap .flexWrap2 .flexLeft {
  max-width: 380px;
  margin-right: 40px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap .flexWrap2 .flexLeft {
    width: 100%;
    margin-right: 0;
  }
}
.machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap .flexWrap2 .flexLeft .blueBox {
  padding: 8px 15px;
  color: #3F82DE;
  background-color: #EBF2FC;
  margin-top: 15px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap .flexWrap2 .flexLeft .blueBox {
    line-height: 1.5;
  }
}
.machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap .flexWrap2 .flexRight {
  max-width: 360px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap .flexWrap2 .flexRight {
    width: 100%;
    margin-top: 20px;
  }
}
.machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap .pdf-dl-btn2 {
  margin-top: 15px;
  text-align: left;
}

.machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap .pdf-dl-btn2 a {
  display: inline-block;
  transition: all 0.2s linear;
  color: #000;
  font-weight: 700;
  font-size: 14px;
  position: relative;
}

.machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap .pdf-dl-btn2 a:hover {
  opacity: 0.5;
}

.machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap .pdf-dl-btn2 a span {
  display: inline-block;
  width: 20px;
  position: relative;
  left: 4px;
  top: 6px;
}

.machininghole-processing .Quality-Specifications .Quality-SpecificationsWrap .pdf-dl-btn2 a:after {
  content: "";
  width: 20px;
  height: 20px;
  background: url(../img/index/news-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  right: -30px;
  top: 7px;
}

.machininghole-processing .Quality-Specifications .pdf-dlWrap {
  display: flex;
  margin-top: 20px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .pdf-dlWrap {
    display: block;
  }
}
.machininghole-processing .Quality-Specifications .pdf-dlWrap .pdf-dl-btn {
  margin-right: 50px;
}

.machininghole-processing .Quality-Specifications .pdf-dlWrap .pdf-dl-btn a {
  display: inline-block;
  transition: all 0.2s linear;
  color: #000;
  font-weight: 700;
  font-size: 14px;
  position: relative;
}

.machininghole-processing .Quality-Specifications .pdf-dlWrap .pdf-dl-btn a:hover {
  opacity: 0.5;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .pdf-dlWrap .pdf-dl-btn a {
    line-height: 1.6;
  }
}
.machininghole-processing .Quality-Specifications .pdf-dlWrap .pdf-dl-btn a span {
  display: inline-block;
  width: 20px;
  position: relative;
  left: 4px;
  top: 6px;
}

.machininghole-processing .Quality-Specifications .pdf-dlWrap .pdf-dl-btn a:after {
  content: "";
  width: 20px;
  height: 20px;
  background: url(../img/index/news-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  right: -30px;
  top: 7px;
}

.machininghole-processing .Quality-Specifications .pdf-dlWrap .pdf-dl-btn.no-pdf {
  margin-top: 6px;
}

.machininghole-processing .Quality-Specifications .pdf-dlWrap .pdf-dl-btn.no-pdf a:after {
  top: -2px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .pdf-dlWrap .pdf-dl-btn.no-pdf a:after {
    top: 12px;
  }
}
.machininghole-processing .Quality-Specifications h3 {
  text-align: center;
  color: #1A96D5;
  font-size: 24px;
  margin-top: 90px;
  background: linear-gradient(#00AEBB, #1A96D5);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.machininghole-processing .Quality-Specifications h3 em {
  font-style: normal;
}

.machininghole-processing .Quality-Specifications h3 .pc-line {
  display: inline-block;
}

@media screen and (max-width: 884px) {
  .machininghole-processing .Quality-Specifications h3 .pc-line {
    display: none;
  }
}
.machininghole-processing .Quality-Specifications h3 .sp-line {
  display: none;
}

@media screen and (max-width: 884px) {
  .machininghole-processing .Quality-Specifications h3 .sp-line {
    display: inline-block;
  }
}
@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications h3 {
    line-height: 1.6;
  }
}
.machininghole-processing .Quality-Specifications .SystemArea {
  margin-top: 35px;
  border: 5px solid #BBE0F3;
  padding: 50px;
}

@media screen and (max-width: 840px) {
  .machininghole-processing .Quality-Specifications .SystemArea {
    padding: 35px;
  }
}
@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .SystemArea {
    padding: 30px 20px;
  }
}
.machininghole-processing .Quality-Specifications .SystemArea .cabistaWrap {
  max-width: 514px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .SystemArea .cabistaWrap {
    display: block;
  }
}
.machininghole-processing .Quality-Specifications .SystemArea .cabistaWrap .cabistaImg01 {
  width: 24.5%;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .SystemArea .cabistaWrap .cabistaImg01 {
    width: 126px;
    margin: 0 auto;
  }
}
.machininghole-processing .Quality-Specifications .SystemArea .cabistaWrap .cabistaImg02 {
  width: 65.2%;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .SystemArea .cabistaWrap .cabistaImg02 {
    width: 96%;
    margin: 20px auto 0;
  }
}
.machininghole-processing .Quality-Specifications .SystemArea h4 {
  font-size: 20px;
  font-weight: 700;
  color: #000;
  text-align: center;
  margin-top: 30px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .SystemArea h4 {
    line-height: 1.6;
  }
}
.machininghole-processing .Quality-Specifications .SystemArea .cabistaSystemTxt {
  font-size: 15px;
  line-height: 1.7;
  margin-top: 30px;
  padding: 0 52px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .SystemArea .cabistaSystemTxt {
    padding: 0;
  }
}
.machininghole-processing .Quality-Specifications .SystemArea .CabistaBtn {
  margin-top: 30px;
  text-align: center;
}

.machininghole-processing .Quality-Specifications .SystemArea .CabistaBtn a {
  background: linear-gradient(90deg, rgb(0, 174, 187) 0%, rgb(26, 150, 213) 100%);
  display: inline-block;
  color: #FFF;
  padding: 20px 55px 20px 25px;
  position: relative;
  border-radius: 30px;
  transition: all 0.2s linear;
}

.machininghole-processing .Quality-Specifications .SystemArea .CabistaBtn a:hover {
  opacity: 0.5;
}

.machininghole-processing .Quality-Specifications .SystemArea .CabistaBtn a:after {
  content: "";
  width: 24px;
  height: 24px;
  position: absolute;
  right: 20px;
  top: calc(50% - 12px);
  background: url(../img/smartorder/cabista-arrow.svg) center center/100% 100% no-repeat;
}

.machininghole-processing .Quality-Specifications .SystemArea .ImgWrap {
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .SystemArea .ImgWrap {
    display: block;
  }
}
.machininghole-processing .Quality-Specifications .SystemArea .ImgWrap .CabistaFukidashi2 {
  width: 420px;
  height: 70px;
  background: url(../img/laserhole-processing/HoleProcessing-fukidashi2.svg) top left/100% auto no-repeat;
  box-sizing: border-box;
  font-size: 22px;
  font-weight: 700;
  padding: 18px 0 0 20px;
  margin: 70px auto 0;
  position: relative;
}

@media screen and (max-width: 980px) {
  .machininghole-processing .Quality-Specifications .SystemArea .ImgWrap .CabistaFukidashi2 {
    width: 100%;
    font-size: 18px;
  }
}
@media screen and (max-width: 840px) {
  .machininghole-processing .Quality-Specifications .SystemArea .ImgWrap .CabistaFukidashi2 {
    font-size: 17px;
    padding: 14px 0 0 15px;
  }
}
@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .SystemArea .ImgWrap .CabistaFukidashi2 {
    width: 285px;
    height: 65px;
    margin: 60px auto 0;
    padding: 17px 0 0 15px;
    font-size: 15px;
    background: url(../img/smartorder/SP-HoleProcessing-fukidashi.svg) top left/100% auto no-repeat;
  }
}
.machininghole-processing .Quality-Specifications .SystemArea .ImgWrap .CabistaFukidashi2 .img {
  width: 121px;
  position: absolute;
  right: 10px;
  top: -25px;
}

@media screen and (max-width: 980px) {
  .machininghole-processing .Quality-Specifications .SystemArea .ImgWrap .CabistaFukidashi2 .img {
    width: 100px;
  }
}
@media screen and (max-width: 840px) {
  .machininghole-processing .Quality-Specifications .SystemArea .ImgWrap .CabistaFukidashi2 .img {
    width: 94px;
  }
}
@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .SystemArea .ImgWrap .CabistaFukidashi2 .img {
    width: 96px;
    right: 0;
  }
}
.machininghole-processing .Quality-Specifications .SystemArea .ImgWrap .CabistaFukidashi {
  width: 420px;
  height: 70px;
  background: url(../img/laserhole-processing/HoleProcessing-fukidashi3.svg) top left/100% auto no-repeat;
  box-sizing: border-box;
  font-size: 22px;
  font-weight: 700;
  padding: 18px 0 0 20px;
  margin: 70px auto 0;
  position: relative;
}

@media screen and (max-width: 980px) {
  .machininghole-processing .Quality-Specifications .SystemArea .ImgWrap .CabistaFukidashi {
    width: 100%;
    font-size: 18px;
  }
}
@media screen and (max-width: 840px) {
  .machininghole-processing .Quality-Specifications .SystemArea .ImgWrap .CabistaFukidashi {
    font-size: 17px;
    padding: 14px 0 0 15px;
  }
}
@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .SystemArea .ImgWrap .CabistaFukidashi {
    width: 285px;
    height: 65px;
    margin: 60px auto 0;
    padding: 17px 0 0 15px;
    font-size: 15px;
    background: url(../img/smartorder/SP-HoleProcessing-fukidashi.svg) top left/100% auto no-repeat;
  }
}
.machininghole-processing .Quality-Specifications .SystemArea .ImgWrap .CabistaFukidashi .img {
  width: 152px;
  position: absolute;
  right: 10px;
  top: -14px;
}

@media screen and (max-width: 980px) {
  .machininghole-processing .Quality-Specifications .SystemArea .ImgWrap .CabistaFukidashi .img {
    width: 120px;
  }
}
@media screen and (max-width: 840px) {
  .machininghole-processing .Quality-Specifications .SystemArea .ImgWrap .CabistaFukidashi .img {
    width: 100px;
  }
}
@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .SystemArea .ImgWrap .CabistaFukidashi .img {
    width: 96px;
    right: 0;
    top: 0;
  }
}
.machininghole-processing .Quality-Specifications .SystemArea .ImgWrap .HoleProcessingLeft {
  width: 48.5%;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .SystemArea .ImgWrap .HoleProcessingLeft {
    width: 100%;
  }
}
.machininghole-processing .Quality-Specifications .SystemArea .ImgWrap .HoleProcessingRight {
  width: 48.5%;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .SystemArea .ImgWrap .HoleProcessingRight {
    width: 100%;
  }
}
.machininghole-processing .Quality-Specifications .SystemArea .HoleProcessing {
  width: 100%;
  margin-top: 10px;
}

.machininghole-processing .Quality-Specifications .SystemArea .HoleProcessing li {
  border: 2px solid #1D1D1D;
  background-color: #00AEBB;
  position: relative;
}

.machininghole-processing .Quality-Specifications .SystemArea .HoleProcessing li a {
  transition: all 0.2s linear;
}

.machininghole-processing .Quality-Specifications .SystemArea .HoleProcessing li a:hover {
  opacity: 0.5;
}

.machininghole-processing .Quality-Specifications .SystemArea .HoleProcessing li .TitleTxt {
  text-align: center;
  background-color: #1D1D1D;
  font-size: 14px;
  color: #FFF;
  padding: 10px 0;
}

.machininghole-processing .Quality-Specifications .SystemArea .HoleProcessing li .inpdd {
  color: #FFF;
  padding: 35px 0 30px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

.machininghole-processing .Quality-Specifications .SystemArea .HoleProcessing li .inpdd h4 {
  color: #FFF;
  font-size: 28px;
  font-weight: 900;
  width: 100%;
  margin: 0;
}

.machininghole-processing .Quality-Specifications .SystemArea .HoleProcessing li .inpdd .Hole-p-txt {
  font-size: 15px;
  line-height: 1.4;
  margin-top: 20px;
  display: inline-block;
}

.machininghole-processing .Quality-Specifications .SystemArea .HoleProcessing li .inpdd .Hole-p-txt span {
  opacity: 0.6;
}

.machininghole-processing .Quality-Specifications .SystemArea .HoleProcessing li .inpdd .Hole-p-txt em {
  color: #FFF45E;
  font-style: normal;
  font-weight: 600;
}

.machininghole-processing .Quality-Specifications .SystemArea .HoleProcessing li .HoleProcessingArrow {
  width: 24px;
  height: 24px;
  position: absolute;
  right: 20px;
  bottom: 20px;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .SystemArea .HoleProcessing li .HoleProcessingArrow {
    width: 20px;
    height: 20px;
    right: 10px;
    bottom: 10px;
  }
}
.machininghole-processing .Quality-Specifications .SystemArea .HoleProcessing li.Right {
  background-color: #1A96D5;
  margin-top: 0;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .SystemArea .HoleProcessing li.Right {
    margin-top: 20px;
  }
}
.machininghole-processing .Quality-Specifications .SystemArea .HoleProcessing li.Right .inpdd {
  color: #FFF;
  padding: 46px 0 41px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

.machininghole-processing .Quality-Specifications .btn-txt {
  margin-top: 50px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .machininghole-processing .Quality-Specifications .btn-txt {
    line-height: 1.5;
  }
}
.machininghole-processing .Quality-Specifications .loginBtn {
  margin-top: 15px;
  text-align: center;
}

.machininghole-processing .Quality-Specifications .loginBtn a {
  display: inline-block;
  padding: 15px 50px 15px 20px;
  font-size: 15px;
  font-weight: 700;
  position: relative;
  color: #000;
  background-color: #FFF45E;
  border: 2px solid #00AEBB;
  border-radius: 30px;
  transition: all 0.2s linear;
}

.machininghole-processing .Quality-Specifications .loginBtn a span {
  font-size: 14px;
  font-weight: 400;
}

.machininghole-processing .Quality-Specifications .loginBtn a:after {
  content: "";
  width: 24px;
  height: 24px;
  background: url(../img/index/index-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  top: calc(50% - 12px);
  right: 15px;
}

.machininghole-processing .Quality-Specifications .loginBtn a:hover {
  transform: scale(1.05, 1.05);
  background-color: #FFF;
}

/*/////////////////////////////// POP UP ///////////////////////////////////////////*/
.popUp {
  display: none;
  background-color: rgba(0, 0, 0, 0.6);
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
}

.popUp .ScrollTxt {
  display: none;
}

@media screen and (max-width: 767px) {
  .popUp .ScrollTxt {
    display: block;
    font-size: 14px;
  }
}
@media screen and (max-width: 767px) {
  .popUp .overflow {
    overflow-x: scroll;
    width: 100%;
  }
}
.popUp .TableWrap {
  padding: 40px;
  background-color: #FFF;
  width: 60%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

@media screen and (max-width: 1080px) {
  .popUp .TableWrap {
    width: 86%;
  }
}
@media screen and (max-width: 767px) {
  .popUp .TableWrap {
    width: 100%;
    padding: 15px;
    box-sizing: border-box;
  }
}
.popUp .TableWrap .table {
  border-bottom: 1px solid #4C4948;
  border-left: 1px solid #4C4948;
  width: 100%;
}

@media screen and (max-width: 767px) {
  .popUp .TableWrap .table {
    width: 160%;
    font-size: 14px;
    margin-top: 10px;
  }
}
.popUp .TableWrap .table th {
  border-top: 1px solid #4C4948;
  border-right: 1px solid #4C4948;
  padding: 8px;
  background-color: #F7F7F7;
  line-height: 1.3;
  font-weight: 700;
}

.popUp .TableWrap .table th span {
  font-size: 13px;
  font-weight: 400;
  display: block;
}

@media screen and (max-width: 767px) {
  .popUp .TableWrap .table th span {
    font-size: 12px;
  }
}
.popUp .TableWrap .table th span.inline {
  display: inline;
}

.popUp .TableWrap .table th.sm {
  font-size: 0.75em;
}

.popUp .TableWrap .table th.blue0 {
  border-right: 2px solid #00AEBB;
}

.popUp .TableWrap .table th.blue1 {
  text-align: left;
  border-top: 2px solid #00AEBB;
  border-right: 2px solid #00AEBB;
  color: #00AEBB;
  padding-left: 4%;
  position: relative;
}

.popUp .TableWrap .table th.blue1 a:after {
  content: "";
  width: 24px;
  height: 24px;
  background: url(../img/index/Pricing-Structure-arrow01.svg) center center/100% 100% no-repeat;
  position: absolute;
  right: 15px;
  top: calc(50% - 12px);
}

@media screen and (max-width: 767px) {
  .popUp .TableWrap .table th.blue1 a:after {
    width: 20px;
    height: 20px;
    right: 10px;
    top: calc(50% - 10px);
  }
}
.popUp .TableWrap .table th.blue2 {
  text-align: left;
  border-top: 2px solid #1A96D5;
  border-right: 2px solid #1A96D5;
  color: #1A96D5;
  padding-left: 4%;
  position: relative;
}

.popUp .TableWrap .table th.blue2 a:after {
  content: "";
  width: 24px;
  height: 24px;
  background: url(../img/index/Pricing-Structure-arrow02.svg) center center/100% 100% no-repeat;
  position: absolute;
  right: 15px;
  top: calc(50% - 12px);
}

@media screen and (max-width: 767px) {
  .popUp .TableWrap .table th.blue2 a:after {
    width: 20px;
    height: 20px;
    right: 10px;
    top: calc(50% - 10px);
  }
}
.popUp .TableWrap .table th.blue3 {
  text-align: left;
  border-top: 2px solid #3F82DE;
  border-right: 2px solid #3F82DE;
  color: #3F82DE;
  padding-left: 4%;
  position: relative;
}

.popUp .TableWrap .table th.blue3 a:after {
  content: "";
  width: 24px;
  height: 24px;
  background: url(../img/index/Pricing-Structure-arrow03.svg) center center/100% 100% no-repeat;
  position: absolute;
  right: 15px;
  top: calc(50% - 12px);
}

@media screen and (max-width: 767px) {
  .popUp .TableWrap .table th.blue3 a:after {
    width: 20px;
    height: 20px;
    right: 10px;
    top: calc(50% - 10px);
  }
}
.popUp .TableWrap .table td {
  border-top: 1px solid #4C4948;
  border-right: 1px solid #4C4948;
  padding: 8px;
  color: #00AEBB;
  text-align: center;
  font-weight: 700;
}

.popUp .TableWrap .table td span {
  display: block;
}

.popUp .TableWrap .table td span.small {
  font-size: 13px;
  margin-top: 6px;
}

.popUp .TableWrap .table td.blue2 {
  color: #1A96D5;
}

.popUp .TableWrap .table td.blue3 {
  color: #3F82DE;
}

.closeArea {
  display: none;
  z-index: 99999;
}

.closeArea .close {
  position: fixed;
  top: 30px;
  right: 40px;
  color: #FFF;
  font-size: 44px;
  cursor: pointer;
  z-index: 999999;
  padding: 5px;
  background-color: rgba(0, 0, 0, 0.6);
}

@media screen and (max-width: 767px) {
  .closeArea .close {
    top: 15px;
    right: 15px;
    font-size: 32px;
  }
}
.popUp2 {
  display: none;
  background-color: rgba(0, 0, 0, 0.6);
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
}

.popUp2 .CompatibleModels {
  max-width: 620px;
  background-color: #FFF;
  padding: 30px 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: 90%;
  overflow-y: scroll;
}

.popUp2 .CompatibleModels .popupTitle {
  font-size: 15px;
  font-weight: 700;
}

.popUp2 .CompatibleModels .popupTitle.mt {
  margin-top: 25px;
}

.popUp2 .CompatibleModels .popupTxt {
  font-size: 15px;
  margin-top: 10px;
  line-height: 1.6;
}

.popUp2 .CompatibleModels .popupNote {
  font-size: 13px;
  margin-top: 10px;
}

.popUp2 .CompatibleModels table {
  border-right: 1px solid #8CCAEA;
  border-top: 1px solid #8CCAEA;
  text-align: center;
  margin-top: 10px;
}

.popUp2 .CompatibleModels table th {
  border-left: 1px solid #8CCAEA;
  padding: 6px 12px;
  border-bottom: 1px solid #8CCAEA;
  background-color: #E8F5FB;
  color: #1A96D5;
  font-size: 15px;
  font-weight: 500;
}

.popUp2 .CompatibleModels table td {
  border-left: 1px solid #8CCAEA;
  border-bottom: 1px solid #8CCAEA;
  padding: 6px 12px;
  font-size: 15px;
}

.popUp2 .CompatibleModels .wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 20px;
}

@media screen and (max-width: 767px) {
  .popUp2 .CompatibleModels .wrap {
    margin-right: 15px;
  }
}
.popUp2 .CompatibleModels .wrap .em {
  font-size: 12px;
  margin-right: 10px;
  margin-top: 10px;
}

.popUp2 .CompatibleModels .wrap .em em {
  font-style: normal;
}

.popUp2 .CompatibleModels .pdf-dl-btn {
  margin-right: 30px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .popUp2 .CompatibleModels .pdf-dl-btn {
    text-align: center;
    line-height: 1.4;
  }
}
.popUp2 .CompatibleModels .pdf-dl-btn a {
  display: inline-block;
  transition: all 0.2s linear;
  color: #000;
  font-weight: 700;
  font-size: 14px;
  position: relative;
}

.popUp2 .CompatibleModels .pdf-dl-btn a em {
  font-size: 12px;
  font-weight: 400;
  font-style: normal;
  margin-right: 1em;
}

.popUp2 .CompatibleModels .pdf-dl-btn a span {
  display: inline-block;
  width: 20px;
  position: relative;
  left: 4px;
  top: 5px;
}

.popUp2 .CompatibleModels .pdf-dl-btn a:after {
  content: "";
  width: 20px;
  height: 20px;
  background: url(../img/index/news-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  right: -30px;
  top: 7px;
}

.closeArea2 {
  display: block;
  z-index: 99999;
}

.closeArea2 .close2 {
  position: fixed;
  top: 30px;
  right: 40px;
  color: #FFF;
  font-size: 44px;
  cursor: pointer;
  z-index: 999999;
  padding: 5px;
  background-color: rgba(0, 0, 0, 0.6);
}

/*///////////////////////////　一覧表 /////////////////////////*/
.list-compatible .headTitle-top {
  background-color: #1A96D5;
  padding: 5px 0 3px;
}

.list-compatible .headTitle-top.machininghole {
  background-color: #3F82DE;
}

.list-compatible.machininghole .headTitle-top {
  background-color: #3F82DE;
}

.list-compatible .in_wrap {
  max-width: 1180px;
  margin: 0 auto;
  display: flex;
  align-items: center;
}

.list-compatible .in_wrap p {
  font-size: 14px;
  font-weight: 700;
  color: #FFF;
  margin-right: 15px;
}

@media screen and (max-width: 1240px) {
  .list-compatible .in_wrap p {
    margin-left: 20px;
  }
}
.list-compatible .in_wrap figure {
  width: 50px;
}

.list-compatible .headTitle {
  background-color: #F3F9FD;
  padding: 35px 0;
  border-bottom: 1px solid #1A96D5;
}

@media screen and (max-width: 767px) {
  .list-compatible .headTitle {
    padding: 35px 20px;
  }
}
.list-compatible .headTitle.machininghole {
  background-color: #F5F9FD;
  border-bottom: 1px solid #3F82DE;
}

.list-compatible .headTitle .mainTitle {
  display: flex;
  align-items: end;
  margin: 0;
}

.list-compatible .headTitle .mainTitle dt figure {
  width: 96px;
  height: auto;
  margin-right: 10px;
}

@media screen and (max-width: 767px) {
  .list-compatible .headTitle .mainTitle dt figure {
    width: 80px;
  }
}
.list-compatible .headTitle .mainTitle dd {
  margin-inline-start: 0;
}

.list-compatible .headTitle .mainTitle dd h1 {
  font-size: 32px;
  font-weight: 700;
  color: #1A96D5;
  margin: 0;
}

.list-compatible .headTitle .mainTitle dd h1.machining {
  color: #3F82DE;
}

@media screen and (max-width: 767px) {
  .list-compatible .headTitle .mainTitle dd h1 {
    font-size: 28px;
  }
}
@media screen and (max-width: 767px) {
  .list-compatible .list-compatible-table {
    padding: 0 20px;
  }
}
.list-compatible .contents_in_wrap {
  max-width: 1180px;
  margin: 0 auto;
}

.list-compatible .contents_in_wrap .tableWrap {
  max-width: 800px;
  margin: 50px auto 0;
}

@media screen and (max-width: 860px) {
  .list-compatible .contents_in_wrap .tableWrap {
    margin: 50px 20px 0;
  }
}
@media screen and (max-width: 767px) {
  .list-compatible .contents_in_wrap .tableWrap {
    margin: 50px 0 0;
  }
}
.list-compatible .contents_in_wrap .tableWrap h2 {
  font-size: 18px;
  font-weight: 700;
  color: #1A96D5;
}

@media screen and (max-width: 767px) {
  .list-compatible .contents_in_wrap .tableWrap h2 {
    line-height: 1.6;
  }
}
.list-compatible .contents_in_wrap .tableWrap .machiningTxt {
  font-size: 12px;
  margin-top: 25px;
}

@media screen and (max-width: 767px) {
  .list-compatible .contents_in_wrap .tableWrap .machiningTxt {
    line-height: 1.6;
  }
}
.list-compatible .contents_in_wrap .tableWrap table {
  border-top: 1px solid #4C4948;
  width: 100%;
  margin-top: 25px;
}

.list-compatible .contents_in_wrap .tableWrap table th {
  border-bottom: 1px solid #4C4948;
  border-right: 1px solid #4C4948;
  padding: 8px;
  background-color: #1A96D5;
  color: #FFF;
  font-size: 15px;
  font-weight: 500;
}

@media screen and (max-width: 767px) {
  .list-compatible .contents_in_wrap .tableWrap table th {
    font-size: 14px;
    line-height: 1.4;
  }
}
.list-compatible .contents_in_wrap .tableWrap table th.gray {
  background-color: #EBEBEB;
  padding: 5px 8px;
  color: #000;
}

.list-compatible .contents_in_wrap .tableWrap table th:last-of-type {
  border-right: none;
}

.list-compatible .contents_in_wrap .tableWrap table th.fix {
  position: sticky;
  top: 79px;
  z-index: 1;
}

@media screen and (max-width: 767px) {
  .list-compatible .contents_in_wrap .tableWrap table th.fix {
    top: 46px;
  }
}
.list-compatible .contents_in_wrap .tableWrap table th.fix2 {
  position: sticky;
  top: 105px;
  z-index: 1;
}

@media screen and (max-width: 767px) {
  .list-compatible .contents_in_wrap .tableWrap table th.fix2 {
    top: 96px;
  }
}
.list-compatible .contents_in_wrap .tableWrap table td {
  border-bottom: 1px solid #4C4948;
  border-right: 1px solid #4C4948;
  padding: 8px;
  font-size: 14px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .list-compatible .contents_in_wrap .tableWrap table td {
    font-size: 13px;
  }
}
.list-compatible .contents_in_wrap .tableWrap table td:nth-of-type(2) {
  color: #1A96D5;
  font-size: 18px;
  font-weight: 700;
  background-color: #E9F5FB;
  text-align: left;
}

@media screen and (max-width: 767px) {
  .list-compatible .contents_in_wrap .tableWrap table td:nth-of-type(2) {
    font-size: 15px;
  }
}
.list-compatible .contents_in_wrap .tableWrap table td small {
  font-size: 12px;
  line-height: 1.5;
  text-align: left;
  display: block;
}

.list-compatible .contents_in_wrap .tableWrap table td p {
  text-align: left;
  font-size: 15px;
  font-weight: 500;
}

@media screen and (max-width: 767px) {
  .list-compatible .contents_in_wrap .tableWrap table td p {
    font-size: 13px;
    line-height: 1.4;
  }
}
.list-compatible .contents_in_wrap .tableWrap table td:last-of-type {
  border-right: none;
}

.list-compatible .tableNote {
  font-size: 12px;
  margin-top: 22px;
}

@media screen and (max-width: 767px) {
  .list-compatible .tableNote {
    line-height: 1.6;
  }
}
.list-compatible .LinkList {
  margin-top: 30px;
  display: flex;
  text-align: left;
}

.list-compatible .LinkList li {
  display: inline-block;
  padding-right: 20px;
}

@media screen and (max-width: 767px) {
  .list-compatible .LinkList li {
    text-align: left;
  }
}
.list-compatible .LinkList li a {
  font-size: 14px;
  font-weight: 700;
  color: #000;
  position: relative;
  transition: all 0.2s linear;
}

@media screen and (max-width: 767px) {
  .list-compatible .LinkList li a {
    line-height: 1.6;
  }
}
.list-compatible .LinkList li a:after {
  position: absolute;
  width: 20px;
  height: 20px;
  background: url(../img/index/news-arrow.svg) center center/100% 100% no-repeat;
  right: -24px;
  top: calc(50% - 10px);
  content: "";
}

@media screen and (max-width: 767px) {
  .list-compatible .LinkList li a:after {
    right: -77%;
  }
}
.list-compatible .LinkList li a:hover {
  opacity: 0.5;
}

.list-compatible .btn-order {
  text-align: left;
  margin-top: 40px;
}

@media screen and (max-width: 767px) {
  .list-compatible .btn-order {
    text-align: center;
  }
}
.list-compatible .btn-order a {
  display: inline-block;
  border-radius: 10px;
  border: 2px solid #1A96D5;
  padding: 10px 60px 10px 20px;
  color: #1A96D5;
  font-weight: 700;
  position: relative;
  background-color: #FFF;
  transition: all 0.2s linear;
  cursor: pointer;
}

.list-compatible .btn-order a:after {
  position: absolute;
  content: "";
  width: 24px;
  height: 24px;
  display: block;
  background: url(../img/smartorder/blue-arrow.svg) center center/100% 100% no-repeat;
  top: calc(50% - 12px);
  right: 20px;
}

.list-compatible .btn-order a:hover {
  opacity: 0.5;
}

.list-compatible .btn-txt {
  margin-top: 50px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .list-compatible .btn-txt {
    line-height: 1.5;
  }
}
.list-compatible .loginBtn {
  margin-top: 15px;
  text-align: center;
}

.list-compatible .loginBtn a {
  display: inline-block;
  padding: 15px 50px 15px 20px;
  font-size: 15px;
  font-weight: 700;
  position: relative;
  color: #000;
  background-color: #FFF45E;
  border: 2px solid #00AEBB;
  border-radius: 30px;
  transition: all 0.2s linear;
}

.list-compatible .loginBtn a span {
  font-size: 14px;
  font-weight: 400;
}

.list-compatible .loginBtn a:after {
  content: "";
  width: 24px;
  height: 24px;
  background: url(../img/index/index-arrow.svg) center center/100% 100% no-repeat;
  position: absolute;
  top: calc(50% - 12px);
  right: 15px;
}

.list-compatible .loginBtn a:hover {
  transform: scale(1.05, 1.05);
  background-color: #FFF;
}

.list-compatible .list-compatible-table.machininghole .tableWrap h2 {
  color: #3F82DE;
}

.list-compatible .list-compatible-table.machininghole .tableWrap .machininghole-processing-table {
  margin-top: 15px;
}

.list-compatible .list-compatible-table.machininghole .tableWrap .machininghole-processing-table th {
  border-bottom: 1px solid #4C4948;
  border-right: 1px solid #4C4948;
  background-color: #3F82DE;
}

.list-compatible .list-compatible-table.machininghole .tableWrap .machininghole-processing-table td:nth-of-type(2) {
  color: #3F82DE;
  background-color: #EBF2FC;
  width: 22%;
}

.list-compatible .list-compatible-table.machininghole .tableWrap .machininghole-processing-table td:last-of-type {
  width: 35%;
}

@media screen and (max-width: 767px) {
  .list-compatible .list-compatible-table.machininghole .tableWrap .machininghole-processing-table td:last-of-type {
    width: 25%;
  }
}
/*///////END//////////////*/
.scroll-note {
  display: none;
}

@media screen and (max-width: 767px) {
  .scroll-note {
    display: block;
    text-align: left;
    font-size: 12px;
    margin: 10px 0;
  }
  .scroll-note.l-mt {
    margin-left: 20px;
  }
}
.blue1 a:hover {
  opacity: 0.5;
}

.blue2 a:hover {
  opacity: 0.5;
}

.blue3 a:hover {
  opacity: 0.5;
}

.blue1 a {
  text-decoration: underline;
  color: #0000EE;
}

.blue2 a {
  text-decoration: underline;
  color: #0000EE;
}

.blue3 a {
  text-decoration: underline;
  color: #0000EE;
}

.em-sp {
  display: none;
}

@media screen and (max-width: 767px) {
  .em-pc {
    display: none;
  }
  .em-sp {
    display: inline-block;
  }
}
/*///////////////// PAGE DETAIL //////////////////////////*/ /*# sourceMappingURL=style.css.map */