@charset "UTF-8";
/* CSS Document */
/*
  ------------------------------------
   MediaScreen指定
  ------------------------------------
*/
/*
  ------------------------------------
   ベースプロパティ
  ------------------------------------
*/
/*
  ------------------------------------
   CSSからのIMGロード
  ------------------------------------
*/
/*
  ------------------------------------
   FONT指定
  ------------------------------------
*/
/*
  ------------------------------------
   FORM設定
  ------------------------------------
*/
/*
  ------------------------------------
   Responsive指定
  ------------------------------------
*/
.contents_block2.table_col2, #case .contents_block2.caselist {
  display: flex;
  flex-wrap: wrap;
  padding-bottom: 50px;
}

.contents_block2.table_col2 li, #case .contents_block2.caselist li {
  width: 50%;
  position: relative;
}

.contents_block2.table_col2 li a, #case .contents_block2.caselist li a {
  display: block;
  color: #fff;
}

.contents_block2.table_col2 li a p, #case .contents_block2.caselist li a p {
  padding-bottom: 56.4814%;
  position: relative;
  overflow: hidden;
}

.contents_block2.table_col2 li a p img, #case .contents_block2.caselist li a p img {
  width: 101%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  transition: .5s;
}

.contents_block2.table_col2 li a dl, #case .contents_block2.caselist li a dl {
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  box-sizing: border-box;
  padding: 2em;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0.5) 30%, rgba(0, 0, 0, 0.8) 88%, rgba(0, 0, 0, 0.8) 99%);
}

.contents_block2.table_col2 li a dl dt, #case .contents_block2.caselist li a dl dt {
  font-size: 180%;
  font-weight: 600;
  margin-bottom: 3%;
}

.contents_block2.table_col2 li a dl dd, #case .contents_block2.caselist li a dl dd {
  line-height: 1.6;
  font-size: 160%;
}

.contents_block2.table_col2 li:hover p img, #case .contents_block2.caselist li:hover p img {
  width: 120%;
}

@media screen and (max-width: 767px) {
  .contents_block2.table_col2 li:hover p img, #case .contents_block2.caselist li:hover p img {
    width: 101%;
  }
}

@media screen and (max-width: 767px) {
  .contents_block2.table_col2, #case .contents_block2.caselist {
    padding-bottom: 5%;
  }
  .contents_block2.sp_flex_col1.table_col2 li, #case .contents_block2.sp_flex_col1.caselist li {
    width: 100%;
    margin-bottom: 10px;
    font-size: 2vw;
  }
  .contents_block2.sp_flex_col1.table_col2 li:last-child, #case .contents_block2.sp_flex_col1.caselist li:last-child {
    margin-bottom: 0;
  }
}

.flex_col3.table_col2, #case .flex_col3.caselist {
  display: flex;
  flex-wrap: wrap;
  padding-bottom: 50px;
}

.flex_col3.table_col2 li, #case .flex_col3.caselist li {
  width: 33.3333%;
  position: relative;
}

.flex_col3.table_col2 li a, #case .flex_col3.caselist li a {
  display: block;
  color: #fff;
}

.flex_col3.table_col2 li a p, #case .flex_col3.caselist li a p {
  position: relative;
  overflow: hidden;
}

.flex_col3.table_col2 li a p img, #case .flex_col3.caselist li a p img {
  width: 101%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  transition: .5s;
}

.flex_col3.table_col2 li a dl, #case .flex_col3.caselist li a dl {
  width: 100%;
  position: absolute;
  bottom: 0%;
  left: 0%;
  box-sizing: border-box;
  padding: 1em;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 30%, rgba(0, 0, 0, 0.8) 88%, rgba(0, 0, 0, 0.8) 99%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

.flex_col3.table_col2 li a dl dt, #case .flex_col3.caselist li a dl dt {
  font-size: 180%;
  font-weight: 600;
  margin-bottom: 3%;
}

@media screen and (max-width: 767px) {
  .flex_col3.table_col2 li a dl dt, #case .flex_col3.caselist li a dl dt {
    font-size: 213.333%;
  }
}

.flex_col3.table_col2 li a dl dd, #case .flex_col3.caselist li a dl dd, .flex_col3.table_col2 li a dl h3, #case .flex_col3.caselist li a dl h3 {
  line-height: 1.6;
  font-size: 160%;
}

@media screen and (max-width: 767px) {
  .flex_col3.table_col2 li a dl dd, #case .flex_col3.caselist li a dl dd, .flex_col3.table_col2 li a dl h3, #case .flex_col3.caselist li a dl h3 {
    font-size: 180%;
  }
}

.flex_col3.table_col2 li a .text_box, #case .flex_col3.caselist li a .text_box {
  width: 90%;
  position: absolute;
  bottom: 7%;
  left: 5%;
}

.flex_col3.table_col2 li a .text_box dt, #case .flex_col3.caselist li a .text_box dt {
  font-size: 180%;
  font-weight: 600;
  margin-bottom: 3%;
}

.flex_col3.table_col2 li a .text_box dd, #case .flex_col3.caselist li a .text_box dd, .flex_col3.table_col2 li a .text_box h3, #case .flex_col3.caselist li a .text_box h3 {
  line-height: 1.6;
  font-size: 160%;
}

.flex_col3.table_col2 li:hover p img, #case .flex_col3.caselist li:hover p img {
  width: 120%;
}

@media screen and (max-width: 767px) {
  .flex_col3.sp_flex_col2.table_col2 li, #case .flex_col3.sp_flex_col2.caselist li {
    width: 50%;
  }
  .flex_col3.sp_flex_col1.table_col2 li, #case .flex_col3.sp_flex_col1.caselist li {
    width: 100%;
  }
}

.table_col2, #case .table_col2.caselist {
  display: table;
}

.table_col2 a, #case .table_col2.caselist a {
  display: block;
  width: 100%;
  height: 100%;
}

.table_col2 > div, #case .table_col2.caselist > div {
  display: table-cell;
  vertical-align: top;
  position: relative;
}

.table_col2 > div > div, #case .table_col2.caselist > div > div {
  position: relative;
}

.table_col2 .col1, #case .table_col2.caselist .col1 {
  width: 50%;
}

.table_col2 .col2, #case .table_col2.caselist .col2 {
  width: 100%;
}

.table_col3.table_col2, #case .table_col3.caselist {
  display: table;
}

.table_col3.table_col2 a, #case .table_col3.caselist a {
  display: block;
  width: 100%;
  height: 100%;
}

.table_col3.table_col2 > div, #case .table_col3.caselist > div {
  display: table-cell;
  vertical-align: top;
  position: relative;
}

.table_col3.table_col2 > div > div, #case .table_col3.caselist > div > div {
  position: relative;
}

.table_col3.table_col2 > div.col2, #case .table_col3.caselist > div.col2 {
  font-size: 120%;
}

.table_col3.table_col2 .col1, #case .table_col3.caselist .col1 {
  width: 33.3333%;
}

.table_col3.table_col2 .col2, #case .table_col3.caselist .col2 {
  width: 66.6666%;
}

.table_col3.table_col2 .col3, #case .table_col3.caselist .col3 {
  width: 100%;
}

.flex.table_col2, #case .flex.caselist {
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .flex.sp_flex_col2.table_col2 li, #case .flex.sp_flex_col2.caselist li {
    width: 50%;
  }
  .flex.sp_flex_col1.table_col2 li, #case .flex.sp_flex_col1.caselist li {
    width: 100%;
  }
}

#visual-2 {
  height: 450px;
  position: relative;
  color: #fff;
  overflow: hidden;
}

#visual-2 #mainvisual {
  font-size: 16px;
}

#visual-2 #mainvisual .visual_text {
  width: 96%;
  max-width: 1080px;
  padding: 0 6%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-shadow: 0 0 5px #333;
}

#visual-2 #mainvisual .visual_text .kv_back {
  background-color: rgba(0, 0, 0, 0.65);
  padding: 1em;
}

@media screen and (max-width: 767px) {
  #visual-2 #mainvisual .visual_text .kv_back {
    padding: 1em 3%;
  }
}

@media screen and (max-width: 767px) {
  #visual-2 #mainvisual .visual_text {
    padding: 0;
    width: 90%;
    text-align: center;
    right: 0;
    left: 0;
    margin: auto;
    padding-left: 0;
    top: 55%;
    transform: translate(0, -50%);
  }
  #visual-2 #mainvisual .visual_text p {
    font-size: 12px;
  }
}

#visual-2 #mainvisual .visual_text h2 {
  font-size: 300%;
  font-weight: normal;
  margin-bottom: 16px;
}

@media screen and (max-width: 767px) {
  #visual-2 #mainvisual .visual_text h2 {
    font-size: 200%;
  }
}

/*
  ------------------------------------
  #####################################
   #Common style
  ####################################
  ------------------------------------
*/
a {
  transition: 0.3s ease-in-out;
  opacity: 1;
}

a:hover {
  opacity: 0.7;
}

@media screen and (max-width: 767px) {
  a:hover {
    opacity: 1;
  }
}

/* Reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  vertical-align: baseline;
}

/*  HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: none;
}

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

a {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* clearfix */
.clearfix {
  overflow: hidden;
}

.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}

* html .clearfix {
  zoom: 1;
}

*:first-child + html .clearfix {
  zoom: 1;
}

html {
  background: #fff;
}

body {
  width: 100%;
  font-feature-settings: "palt";
  color: #1b1b1b;
  font-family: 'Noto Sans JP', sans-serif;
  font-display: swap;
  letter-spacing: 0.1em;
  line-height: 1.5;
  font-size: 10px;
}

a {
  text-decoration: none;
  color: #1b1b1b;
}

@media screen and (max-width: 767px) {
  main {
    padding-top: 80px;
  }
}

.inner_box {
  max-width: 1080px;
  width: 94%;
  margin: 0 auto;
  position: relative;
  box-sizing: border-box;
}

.anchorlist {
  margin-top: 40px;
  margin-bottom: 40px;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.anchorlist li {
  width: 32%;
  border: 1px solid #cb1c1d;
  text-align: center;
}

.anchorlist li a {
  font-weight: bold;
  position: relative;
  display: block;
  padding: 1em;
}

.anchorlist li a:after {
  position: absolute;
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  top: 50%;
  right: 10px;
  border-right: 1px solid #cb1c1d;
  border-bottom: 1px solid #cb1c1d;
  transform: translate(0, -50%) rotate(45deg);
}

@media screen and (max-width: 767px) {
  .anchorlist {
    margin: 0 auto 3%;
  }
  .anchorlist li {
    width: 96%;
    margin: 0 auto;
  }
  .anchorlist li:not(:last-child) {
    margin-bottom: 10px;
  }
}

/*table*/
.table_col3 {
  display: table;
}

.table_col3 a {
  display: block;
  width: 100%;
  height: 100%;
}

.table_col3 > div {
  display: table-cell;
  vertical-align: top;
  position: relative;
}

.table_col3 > div > div {
  position: relative;
}

.table_col3 > div.col2 {
  font-size: 120%;
}

.table_col3 .col1 {
  width: 33.3333%;
}

.table_col3 .col2 {
  width: 66.6666%;
}

.table_col3 .col3 {
  width: 100%;
}

/*table*/
.inner {
  max-width: 1120px;
  margin: 0 auto;
  box-sizing: border-box;
  position: relative;
}

@media screen and (max-width: 1120px) {
  .inner {
    padding: 0 3%;
  }
}

.section_ttl {
  font-family: 'Roboto', sans-serif;
  font-size: 440%;
  font-style: italic;
  font-weight: 300;
  color: #fff;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .section_ttl {
    font-size: 300%;
    text-align: center;
    margin-bottom: 20px;
  }
  .section_ttl img {
    height: 7vw;
  }
}

.title_block {
  position: relative;
}

.title_block.flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@media screen and (max-width: 767px) {
  .title_block {
    margin-bottom: 5%;
  }
}

.title-1 {
  font-size: 320%;
  font-weight: 600;
  color: #333;
  text-align: center;
  margin-bottom: 60px;
  padding: 60px 0 10px;
  position: relative;
  line-height: 1.6;
}

.title-1:after {
  content: "";
  display: block;
  width: 100px;
  height: 2px;
  background-color: #cb1c1d;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

@media screen and (max-width: 767px) {
  .title-1 {
    font-size: 4.4vw;
    padding: 10% 0 10px;
    margin-bottom: 10%;
  }
}

.title-2 {
  font-size: 320%;
  font-weight: 600;
  color: #333;
}

@media screen and (max-width: 767px) {
  .title-2 {
    font-size: 4.4vw;
  }
}

h3.title-3 {
  font-size: 320%;
  font-weight: 600;
  margin-bottom: 30px;
  padding: 16px 10px 16px 24px;
  border-bottom: 1px dotted #6f6f6f;
  position: relative;
}

h3.title-3:after {
  content: "";
  display: block;
  width: 2px;
  height: 47px;
  background-color: #cb1c1d;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}

h3.title-4 {
  color: #333;
  font-size: 200%;
  font-weight: 600;
  margin-bottom: 30px;
  padding: 16px 10px 16px 24px;
  border-bottom: 1px dotted #6f6f6f;
  position: relative;
}

@media screen and (max-width: 767px) {
  h3.title-4 {
    font-size: 180%;
  }
}

h3.title-4:after {
  content: "";
  display: block;
  width: 2px;
  height: 47px;
  background-color: #cb1c1d;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}

.link_btn {
  width: 240px;
  font-size: 160%;
  border: 1px solid #a0a0a0;
}

.link_btn a {
  position: relative;
  display: block;
  padding: 0.9em;
  box-sizing: border-box;
  text-align: center;
  color: #333;
  position: relative;
}

.link_btn a:after {
  position: absolute;
  content: "";
  display: inline-block;
  top: 50%;
  width: 6px;
  height: 6px;
  border-right: 1px solid #cb1c1d;
  border-bottom: 1px solid #cb1c1d;
  transform: translate(0, -50%) rotate(-45deg);
}

.link_btn a:after {
  right: 20px;
}

@media screen and (max-width: 767px) {
  .link_btn {
    width: 170px;
    font-size: 120%;
  }
}

#case {
  background-color: #f6f6f6;
}

#case .title_block {
  padding: 50px 0 30px;
}

@media screen and (max-width: 767px) {
  #case .title_block {
    padding: 5% 0 0;
  }
}

@media screen and (max-width: 767px) {
  #case {
    padding-bottom: 5%;
  }
}

.local_navigation {
  display: none;
  font-size: 160%;
  position: fixed;
  top: 51px;
  width: 100%;
  z-index: 9999;
}

.local_navigation.on {
  height: calc(100% - 51px);
}

.local_navigation.on .inner {
  display: block;
}

.local_navigation.on h2:after {
  transform: translate(0, -100%) rotate(45deg);
}

.local_navigation .inner {
  background-color: rgba(0, 0, 0, 0.6);
  padding: 3%;
  display: none;
  position: absolute;
  top: 53px;
  width: 100%;
  box-sizing: border-box;
  height: calc(100% - 51px);
  z-index: 99999;
  overflow: scroll;
}

.local_navigation h2 {
  background-color: #fff;
  padding: 0.9em;
  position: relative;
  display: block;
  padding: 0.9em;
  box-sizing: border-box;
}

.local_navigation h2:after {
  position: absolute;
  content: "";
  display: inline-block;
  top: 50%;
  width: 10px;
  height: 10px;
  border-right: 1px solid #333;
  border-bottom: 1px solid #333;
  transform: translate(0, -50%) rotate(-45deg);
}

.local_navigation h2:after {
  right: 20px;
  border-right: 2px solid #444;
  border-bottom: 2px solid #444;
}

.local_navigation h2.on {
  transform: translate(0, -100%) rotate(45deg);
}

.local_navigation p {
  background-color: #666;
  color: #fff;
  border: 1px solid #fff;
  padding: 1em;
}

.local_navigation p.link {
  padding: 0;
  background-color: #fff;
}

.local_navigation p.link a {
  display: block;
  padding: 1em;
  position: relative;
  display: block;
  padding: 0.9em;
  box-sizing: border-box;
}

.local_navigation p.link a:after {
  position: absolute;
  content: "";
  display: inline-block;
  top: 50%;
  width: 6px;
  height: 6px;
  border-right: 1px solid #f00;
  border-bottom: 1px solid #f00;
  transform: translate(0, -50%) rotate(-45deg);
}

.local_navigation p.link a:after {
  right: 20px;
}

.local_navigation p:last-child {
  border-top: none;
}

.local_navigation ul {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  background-color: #f6f6f6;
}

.local_navigation ul li {
  width: 50%;
  font-size: 80%;
  box-sizing: border-box;
  border-bottom: 1px solid #fff;
}

.local_navigation ul li:nth-child(odd) {
  border-right: 1px solid #fff;
}

.local_navigation ul li:nth-child(even) {
  border-left: 1px solid transparent;
}

.local_navigation ul li a {
  display: block;
  position: relative;
  display: block;
  padding: 0.9em;
  box-sizing: border-box;
  padding: .9em 1.4em;
}

.local_navigation ul li a:after {
  position: absolute;
  content: "";
  display: inline-block;
  top: 50%;
  width: 4px;
  height: 4px;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  transform: translate(0, -50%) rotate(-45deg);
}

.local_navigation ul li a:after {
  right: 10px;
}

@media screen and (max-width: 767px) {
  .local_navigation {
    display: block;
  }
}

.pan {
  /*  HTML5 display-role reset for older browsers */
  /* clearfix */
  width: 96%;
  max-width: 1080px;
  margin: 0 auto;
}

.pan html, .pan body, .pan div, .pan span, .pan applet, .pan object, .pan iframe, .pan h1, .pan h2, .pan h3, .pan h4, .pan h5, .pan h6, .pan p, .pan blockquote, .pan pre,
.pan a, .pan abbr, .pan acronym, .pan address, .pan big, .pan cite, .pan code, .pan del, .pan dfn, .pan em, .pan img, .pan ins, .pan kbd, .pan q, .pan s, .pan samp,
.pan small, .pan strike, .pan strong, .pan sub, .pan sup, .pan tt, .pan var, .pan b, .pan u, .pan i, .pan center, .pan dl, .pan dt, .pan dd, .pan ol, .pan ul, .pan li,
.pan fieldset, .pan form, .pan label, .pan legend, .pan table, .pan caption, .pan tbody, .pan tfoot, .pan thead, .pan tr, .pan th, .pan td, .pan article, .pan aside, .pan canvas, .pan details, .pan embed,
.pan figure, .pan figcaption, .pan footer, .pan header, .pan hgroup, .pan menu, .pan nav, .pan output, .pan ruby, .pan section, .pan summary, .pan time, .pan mark, .pan audio, .pan video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  vertical-align: baseline;
}

.pan article, .pan aside, .pan details, .pan figcaption, .pan figure, .pan footer, .pan header, .pan hgroup, .pan menu, .pan nav, .pan section {
  display: block;
}

.pan body {
  line-height: 1;
}

.pan ol, .pan ul {
  list-style: none;
}

.pan blockquote, .pan q {
  quotes: none;
}

.pan blockquote:before, .pan blockquote:after,
.pan q:before, .pan q:after {
  content: none;
}

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

.pan a {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.pan .clearfix {
  overflow: hidden;
}

.pan .clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}

.pan * html .clearfix {
  zoom: 1;
}

.pan *:first-child + html .clearfix {
  zoom: 1;
}

@media screen and (max-width: 767px) {
  .pan {
    width: 100%;
  }
}

.pan ul {
  font-size: 120%;
  padding-left: 0.9em;
}

@media screen and (max-width: 767px) {
  .pan ul {
    border-top: 1px solid #333;
  }
}

.pan ul li {
  display: inline-block;
}

.pan ul li a {
  position: relative;
  display: block;
  padding: 0.9em;
  box-sizing: border-box;
  padding-left: 0;
  padding-right: 1.8em;
}

.pan ul li a:after {
  position: absolute;
  content: "";
  display: inline-block;
  top: 50%;
  width: 5px;
  height: 5px;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  transform: translate(0, -50%) rotate(-45deg);
}

.pan ul li a:after {
  position: absolute;
  right: 0.6em;
}

.pan ul li:last-child {
  padding: 0.9em 0;
}

#page {
  margin: -55px 0 50px;
  position: relative;
}

@media screen and (max-width: 767px) {
  #page {
    margin: -25px 0 0;
  }
}

#page p {
  font-size: 170%;
  font-weight: 600;
  color: #333;
  box-sizing: border-box;
  background-color: #bdbdbd;
  position: absolute;
  right: 0;
}

@media screen and (max-width: 767px) {
  #page p {
    font-size: 180%;
    text-align: center;
    width: 100%;
    left: 0;
    margin: auto;
  }
}

#page p a {
  display: block;
  padding: 28px 50px;
  color: #333;
  position: relative;
}

#page p a:after {
  content: "";
  display: inline-block;
  width: 8px;
  height: 13px;
  background: url("/jp/cmn_2020/img/arrow_01.png") no-repeat center;
  position: absolute;
  top: 0;
  right: 33px;
  bottom: 0;
  margin: auto;
}

@media screen and (max-width: 767px) {
  #page p a {
    padding: 16px 20px;
  }
  #page p a:after {
    right: 8px;
  }
}

#page p:hover a, #page p.active a {
  opacity: 1;
  background-color: #F00;
  color: #fff;
}

#page p:hover a:after, #page p.active a:after {
  border-right-color: #FFF;
  border-bottom-color: #FFF;
}

#page + #information {
  margin-top: 140px;
}

@media screen and (max-width: 767px) {
  #page + #information {
    margin-top: 70px;
  }
}

.pc {
  display: block;
}

.pc-flex {
  display: flex;
}

.pc-ib {
  display: inline-block;
}

.sp,
.sp-flex,
.sp-ib {
  display: none;
}

@media screen and (max-width: 767px) {
  .sp {
    display: block;
  }
  .sp-flex {
    display: flex;
  }
  .sp-ib {
    display: inline-block;
  }
  .pc,
  .pc-flex,
  .pc-ib {
    display: none;
  }
}

@media screen and (max-width: 480px) {
  .sp {
    display: block;
  }
}

#special #contact .technology_item {
  display: none;
}