/* ===============================================
 * 
 * -- style sole 各々
 * 
 * =============================================== */
/* front page */
/* --------------------------------------------
 * /.key visual
 * ------------------------------------------ */
/* ラッパーでスクロールを管理 */
.sg--key {
  width: 100%;
  height: 300vh;
  position: relative;
  background: #000;
  z-index: -999999;
  opacity: 0;
  transition: ease all 0.5s;
}
.sg--key.viewActive {
  opacity: 1;
  z-index: -1;
}
/* 各セクションのスタイル */
.key-visual-screen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    color: white;
    font-size: 2rem;
    font-weight: bold;
    opacity: 0;
    transition: opacity 1s ease-out, transform 1s ease-out;
	
}

/* 背景色 */
.screen1 { background: url('https://tesuto-kyu-mu3917.net/soundgraph-test/wp-content/uploads/2025/02/sg_keyimg01.jpg') center/cover no-repeat; }
.screen2 { background: url('https://tesuto-kyu-mu3917.net/soundgraph-test/wp-content/uploads/2025/02/sg_keyimg02.jpg') center/cover no-repeat; }
.screen3 { background: url('') center/cover no-repeat; }

/* アクティブ時のスタイル */
.key-visual-screen.active {
    opacity: 1;
}

/* 最初の画面（ファーストビュー）のアニメーション */
.first {
    opacity: 1;
}
/* ファーストビューの .screen-txt（全体のアニメーション） */
.first .screen-txt {
    opacity: 0;
    transform: translateY(50px);
    animation: fadeInUp 1s ease-out forwards;
    animation-delay: 0.5s; /* 全体のアニメーションは0.5秒遅らせる */
}

/* .key_img（ロゴ画像）は通常のアニメーション */
.first .screen-txt .key_img {
    opacity: 0;
    transform: translateY(30px);
    animation: fadeInUp 1s ease-out forwards;
    animation-delay: 1s; /* ロゴ画像は1秒遅らせる */
}

/* .key_txt（テキスト）はさらに時間差でフェードイン */
.key-visual-screen.first .screen-txt .key_txt {
    opacity: 0;
    transform: translateY(30px);
    animation: fadeInUp 1.5s ease-out forwards;
    animation-delay: 1.5s; /* テキストはさらに1.5秒遅らせる */
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(50px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 背景動画のスタイル */
.bg-video {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: translate(-50%, -50%);
    z-index: -1; /* テキストの下に配置 */
}

/* テキストのアニメーション */
.screen-txt {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 1s ease-out, transform 1s ease-out;
	margin-top: 20%;
	width: 100%;
}

/* アクティブ時のテキスト表示 */
.key-visual-screen.active .screen-txt {
    opacity: 1;
    transform: translateY(0);
}
.key-visual-screen.active .screen-txt {
    opacity: 1;
    transform: translateY(0);
}

/* ロゴ画像のサイズ調整 */
.key_img {
width: clamp(240px, calc(245 / 1280 * 100vw), 350px);
  height: auto;
  margin: 5vw auto;
}

/* テキストのスタイル */
.key_txt {
  font-size: clamp(28px, calc(30 / 1280 * 100vw), 37px);
  color: white;
  line-height: 1.6;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 1s ease-out 0.5s, transform 1s ease-out 0.5s;
}
.screen2 .screen-txt,
.screen3 .screen-txt {
  margin-top: 30%;
}

/* アクティブ時の <p> の fade-in */
.key-visual-screen.active .key_txt {
    opacity: 1;
    transform: translateY(0);
}

/* ロゴのスタイル（固定表示） */
.screen-logo {
    position: fixed;
    top: 35%;
    left: 50%;
    transform: translateX(-50%);
    z-index: -9999;
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
}

/* `lighting` クラスが付くとロゴが表示される */
.screen-logo.lighting {
    opacity: 1;
	z-index: 0;
	transition: opacity 0.5s ease-in-out;
}

/* --------------------------------------------
 * >> key visual
 * ------------------------------------------ */
.keyvisual-area {
  margin-top: 10vw;
}
/* --------------------------------------------
 * >> front --- picup
 * ------------------------------------------ */
.front__contents__picup {
  padding: 3vw 0 0;
}
.front__contents__picup .front__ttl {
  color: #7f4a58;
  letter-spacing: clamp(14px, calc(28 / 1280 * 100vw), 38px);
  margin: auto auto 8rem;
  text-align: center;
  font-size: clamp(15px, calc(18 / 1280 * 100vw), 22px);
  font-weight: 900;
	line-height: 1.7;
}
.picup_ttl {
  font-size: clamp(14px, calc(15 / 1280 * 100vw), 20px);
  color: #7f4a58;
  margin: 0;
  padding: 1.4vw 0 0;
  font-weight: 600;
  text-align: left;
}
.picup_data p {
  color: #3f3f3f;
  margin: 0.8vw auto;
  font-size: clamp(12px, calc(14 / 1280 * 100vw), 18px);
  min-height: 95px;
}
.picup_wrap {
  display: flex;
  gap: 0 7%;
  justify-content: center;
  flex-wrap: wrap;
  align-content: stretch;
}
.picup_item {
  margin-bottom: 6vw;
  width: 28%;
  display: inline-flex;
  flex-wrap: wrap;
  align-content: space-between;
  min-height: 340px;
}
.picup_img {
  width: 100%;
}


/* --------------------------------------------
 * >> front --- news
 * ------------------------------------------ */
.front__contents__news {
  background: #e9e9f0;
}
.front__contents__news .front__ttl {
  margin: auto auto 6vw;
  letter-spacing: 0.25vw;
  font-size: calc(18 / 1280 * 100vw);
}
.news_item .data {
  display: flex;
  flex-wrap: wrap;
  gap: 0 0.7vw;
  align-items: center;
}
.news_item .cat {
  color: #fff;
  background: #1c4367;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 0 0.7vw 0.1vw;
  font-size: calc(11 / 1280 * 100vw);
  max-height: 1.5vw;
  letter-spacing: 0.18vw;
}
.cat.iro_2 {
  background: #009a99;
}
.news_item .day {
  color: #3f3f3f;
	font-size: 14px;
}
.news_item .ttl {
  color: #3f3f3f;
  width: 100%;
  text-decoration: underline transparent;
  transition: ease all 0.3s;
  margin: 0 auto;
}
.news_item {
  border-bottom: 1px solid #4d4d4d;
  padding: 0.7vw 0 1.2vw;
  margin: 0 auto;
  transition: ease all 0.5s;
  background-image: linear-gradient( 150deg, rgba(0, 104, 182, 0), rgba(63, 86, 255, 0) 70%, rgba(6, 139, 205, 0) );
}
.news_item:hover {
  transition: ease all 0.5s;
  background-image: linear-gradient( 150deg, rgba(0, 104, 182, 0.05), rgba(63, 86, 255, 0.05) 53%, rgba(6, 139, 205, 0.05) );
}
.front__contents__news_list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 0 10%;
  margin: 0 auto 4.5vw;
}
.front__contents__picup .contents__wrap {
	padding: 9vw 0 0;
max-width: clamp(700px, calc(800 / 1280 * 100vw), 1080px);
  margin: 0 auto;
}



/* --------------------------------------------
 * >> front --- product
 * ------------------------------------------ */
.front__contents__product .contents__wrap {
  padding: 12vw 0;
  margin: 0 auto;
}
.front__contents__product .front__ttl {
  font-size: calc(18 / 1280 * 100vw);
  margin: 0 auto;
  padding: 0 0 5vw;
  letter-spacing: 0.4vw;
}
.front__contents__product_wrap {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 7%;
}
.product_item img {
  width: 100%;
  height: auto;
}

/* --------------------------------------------
 * >> front --- sns.instagram
 * ------------------------------------------ */
.front__contents__sns {
}
.front__contents__sns .contents__wrap {
  padding: 8vw 0;
  max-width: clamp(600px, calc(700 / 1280 * 100vw), 900px);
}
.front__contents__sns_wrap {
  margin: 0 auto 5vw;
  text-align: center;
}
.front__contents__sns .front__ttl {
  padding: 0 0 2.5vw;
  color: #4d4d4d;
  letter-spacing: 0;
  font-size: calc(15 / 1280 * 100vw);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.contents__wrap .front__ttl .icon {
  max-width: calc((34 / 1280) * 100vw);
  margin: 0 auto 1.5vw;
}
.contents__wrap .front__ttl .icon {
  max-width: calc((34 / 1280) * 100vw);
}
.front__contents__sns_wrap {
  margin: 0 auto 5vw;
  text-align: center;
  max-width: calc((600 / 1280) * 100vw);
}


/* --------------------------------------------
 * >> front --- end visual
 * ------------------------------------------ */
.endvisual_area {
  background: url(https://tesuto-kyu-mu3917.net/soundgraph-test/wp-content/uploads/2025/02/front_bg.jpg) no-repeat;
  background-size: cover;
  width: 100%;
  height: 100vh;
position: relative;
  background-attachment: fixed;
  background-position: center top;
	display: flex;
  justify-content: center;
}
.endvisual__ttl {
  color: #fff;
  line-height: 1.8;
  font-size: clamp(16px, calc(18 / 1280 * 100vw), 30px);
  padding: 1.6vw 3vw;
  letter-spacing: 2.2vw;
  max-width: clamp(600px, calc(800 / 1280 * 100vw), 1080px);
  display: flex;
  justify-content: center;
  z-index: 1;
  align-items: center;
  background: rgb(127, 74, 88);
  position: absolute;
  top: 60%;
  margin: 0 auto;
  width: 100%;
}
.endvisual_tx {
  z-index: 1;
}
.endvisual__logo {
  width: clamp(220px, calc(240 / 1280 * 100vw), 320px);
  position: absolute;
  top: 28%;
}




/* --------------------------------------------
 * >> front --- end profile
 * ------------------------------------------ */
.endprofile_area .front__ttl {
  font-size: calc(18 / 1280 * 100vw);
  margin: 0 auto;
  padding: 0 0 4vw;
  letter-spacing: 2.2vw;
  font-weight: 900;
}
.front__contents__bottom .contents__wrap {
  padding: 6vw 0;
}




/* --------------------------------------------
 * page --- service
 * ------------------------------------------ */
#content.page-wrap {
  padding: 0;
}
.page_contents__wrap {
  padding: 0;
  margin: 0 auto;
  width: clamp(700px, calc(800 / 1280 * 100vw), 1170px);
}
.contens_header_menu {
  padding: 4vw 0;
}
.contens_header_menu ul {
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(3, auto);
  gap: 0 5%;
	margin: 0 auto;
}
.contens_header_menu ul li {
  margin-bottom: 4%;
}
.contens_header_menu ul li a {
	font-size: clamp(12px, calc(14 / 1280 * 100vw), 15px);
  color: #fff;
  background: #231815;
  padding: 0.1vw 0.5vw;
  display: inline-block;
  width: 100%;
	font-feature-settings: "palt";
}
.contens_header_menu ul li a:hover {
  background: #9e959a;
}
.contens_header_menu ul li.active a {
  background: #9e959a;
}
.page_contents__title {
  font-size: clamp(14px, calc((14 / 1280) * 100vw), 22px);
  color: #fff;
  padding: 0.8vw 1vw;
  width: clamp(700px, calc(800 / 1280 * 100vw), 1170px);
  position: relative;
  margin: 3vw auto;
  z-index: 1;
}
.page_contents__title::before {
  content: "";
  background: #231815;
  width: 100vw;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
.page_contents__head {
  margin: 5vw auto;
  background: #231815;
}
.page_contents__head .page_contents__wrap {
    display: -ms-grid; /* 古いIE用 */
    display: grid; /* モダンブラウザ用 */
    
    grid-template-columns: 1fr 1fr;     
    -ms-grid-columns: 1fr 1fr; /* 古いIE対応 */
        
    grid-template-rows: 100%; /* 1行の高さを100%に */    
    width: 100%; /* 幅を全体に広げる */
}
.page_contents__head .head_ttl {
  font-size: clamp(18px, calc(22 / 1280 * 100vw), 28px);
  color: #fff;
  margin: 0 auto 1.5vw;
  font-weight: 600;
  font-feature-settings: "palt" 1;
}
.page_contents__head .head_txt {
  font-size: clamp(12px, calc(14 / 1280 * 100vw), 18px);
  color: #fff;
  line-height: 1.8;
  margin: 0 auto;
}
.contents_head_grid:nth-child(1) {
  padding: 3vw 4vw 2vw 0;
  margin-left: calc((240 / 1280) * 100vw);
}
.contents_head_grid:nth-child(2) {
    display: -webkit-box;      /* 古いWebKit用（Safariの古いバージョン） */
    display: -moz-box;         /* 古いFirefox用 */
    display: -ms-flexbox;      /* 古いIE用 */
    display: -webkit-flex;     /* Safari 8 以前 */
    display: flex;             /* 最新のブラウザ */
    
    justify-content: center;   /* 水平方向の中央揃え */
    align-items: center;       /* 垂直方向の中央揃え */

    -webkit-justify-content: center; /* Safariの古いバージョン */
    -webkit-align-items: center;     /* Safariの古いバージョン */
}
.page_contents__head .head_img {
  position: relative;
  width: 100%;
  height: auto;
}
.page_contents__head .head_img::before {
  content: "";
/*  background: url("https://tesuto-kyu-mu3917.net/soundgraph-test/wp-content/uploads/2025/02/soundgraph-logo.svg") no-repeat;*/
    background-size: auto;
  width: clamp(100px, calc(110 / 1280 * 100vw), 200px);
  height: auto;
  position: absolute;
  background-size: contain;
  right: 10%;
  top: 48%;
  margin: auto;
  bottom: 0;
}
.page_contents__head .head_img img {
  object-fit: cover;
}
.page_contents__midashi {
  text-align: center;
  margin: 7vw auto 6vw;
}
.midashi_en {
  font-size: clamp(28px, calc(30 / 1280 * 100vw), 41px);
  color: #7b4755;
  font-family: "Noto Sans JP", serif;
  letter-spacing: 0.4vw;
  margin: 2vw auto;
  font-weight: 900;
  line-height: 1.3;
}
.midashi_ttl {
  font-size: clamp(13px, calc((14 / 1280) * 100vw), 16px);
  color: #3f3f3f;
  font-family: "Noto Sans JP", serif;
  margin: 0 auto;
}
.container_banner {
  margin: 5vw auto;
  width: calc((800 / 1280) * 100vw);
}
.banner_btn {
  background: #7f4a58;
  color: #fff;
  padding: 1.3vw 0;
  text-align: center;
}
.page_contents__container {
  padding: 0 0 6vw;
}



/* service - デジタルサイネージのメリット */
.con--about .page_contents__wrap {
  width: 100vw;
}
.page_contents__wrap._twin {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  grid-gap: 0 3%;
  margin: 0 auto 2.5vw;
}
.grid_right ._ttl {
  font-size: clamp(17px, calc(18 / 1280 * 100vw), 20px);
  color: #000;
  font-weight: 700;
}
.grid_right ._num {
  font-size: clamp(22px, calc(26 / 1280 * 100vw), 28px);
  font-weight: 600;
  color: #7f4a58;
  border-top: 1px solid;
  display: inline-block;
  line-height: 1.3;
	margin: 2vw auto 1vw;
}
.grid_right ._txt {
  color: #3f3f3f;
  font-size: clamp(14px, calc(14 / 1280 * 100vw), 16px);
  font-weight: 400;
  margin: 2vw auto;
}
.page_contents__wrap .grid_right {
  padding: 0 20% 0 0;
}



/* service - 電飾コルトンをデジタルメニューボードへ */
.intro_digital_menu_board {
  width: clamp(700px, calc((800 / 1280) * 100vw), 1170px);
  margin: 0 auto;
  position: relative;
}
.intro_digital_menu_board .intro_dmb_img {
  width: 64%;
}
.intro_digital_menu_board .intro_dmb_note {
  color: #fff;
  padding: 6vw 4vw;
  position: absolute;
  z-index: 2;
  aspect-ratio: 1/1;
  width: 47%;
  right: 0;
  top: 15%;
}
.intro_digital_menu_board ._bg {
  width: 47%;
  height: auto;
  position: absolute;
  z-index: 0;
  top: 15%;
  mix-blend-mode: multiply;
  background: rgb(88, 78, 76);
  right: 0;
  aspect-ratio: 1/1;
}
.intro_dmb_note ._ttl {
  font-size: clamp(17px, calc(18 / 1280 * 100vw), 20px);
  font-weight: 600;
  margin: 0 auto 2vw;
}
.intro_dmb_note ._txt {
  font-size: clamp(14px, calc(15 / 1280 * 100vw), 16px);
}



/* service - 屋外デジタルサイネージ導入のメリット */
.con--outdoor_dgsig .page_contents__wrap {
  width: 100vw;
}

/* service - 屋内外LEDビジョン導入のメリット */
.con--ledvision .page_contents__wrap {
  width: 100vw;
}

/* service - 導入のメリット */
.merit_list {
  margin: 0 auto 7vw;
}
.merit_list_item {
  border-top: 1px solid #3f3f3f;
  padding: 2vw 0;
  display: grid;
  grid-template-columns: 0.2fr 1fr 1.5fr;
  grid-gap: 0 2%;
  justify-content: center;
  align-items: center;
}
.merit_list_item:last-child {
  border-bottom: 1px solid #3f3f3f;
}
.merit_list_item ._num {
  color: #7b4755;
  font-size: clamp(18px, calc(22 / 1280 * 100vw), 24px);
  font-weight: 600;
  text-align: center;
}
.merit_list_item ._ttl {
  color: #000;
  font-size: clamp(17px, calc(18 / 1280 * 100vw), 22px);
  font-weight: 600;
}
.merit_list_item ._txt {
  color: #3f3f3f;
  font-size: clamp(14px, calc(15 / 1280 * 100vw), 16px);
}
/* service - デジタルサイネージ導入の流れ */
.con--step .container_wrap {
  margin: 0 auto 10vw;
}
.flow_step__item {
  position: relative;
  z-index: 1;
  margin: 0 auto 1.5vw;
}
.flow_step__item ._note {
  position: absolute;
  z-index: 1;
  color: #fff;
  padding: 22% 49% 3% 3%;
  width: 100%;
  height: 100%;
  top: 0;
}
.flow_step__item ._note ._num {
  font-size: clamp(24px, calc(25 / 1280 * 100vw), 26px);
  font-weight: 600;
  border-top: 1px solid #fff;
  display: inline-block;
  padding: 0;
  line-height: 1.3;
}
.flow_step__item ._note ._ttl {
  font-size: clamp(18px, calc(20 / 1280 * 100vw), 22px);
  font-weight: 600;
  margin: 0 auto 1.5vw;
}
.flow_step__item ._note ._txt {
  font-size: clamp(14px, calc(15 / 1280 * 100vw), 16px);
  line-height: 1.5;
}


/* service - 用途別デジタルサイネージソリューション */
.contents_img_note {
  padding: 1.5vw;
  text-align: center;
  font-size: clamp(14px, calc(15 / 1280 * 100vw), 16px);
  color: #3f3f3f;
  border: 1px solid #bebebe;
  border-radius: 12px;
  max-width: 80%;
  margin: 0 auto;
}
.smartcontrol_note img {
  margin: 1vw auto;
}














/* >>01 - service sec 1 サービス > デジタルサイネージ----------------------------------------- */

/* >>01 - service sec 1 - 2 サービス > デジタルサイネージ > ワンタッチビュー ----------------------------------------- */
.con--otv {
}
.con--otv .midashi_en span {
  font-size: calc(21 / 1280 * 100vw);
  display: block;
}
.con--otv .midashi_en {
  font-size: calc(32 / 1280 * 100vw);
  line-height: 1.5;
}
.page_container_wrap {
  width: clamp(700px, calc((800 / 1280) * 100vw), 1170px);
  margin: 0 auto;
}
.con--otv .page_container_wrap {
  color: #000;
}
.con--otv .page_container_wrap ._note {
  margin: 3vw auto;
  text-align: center;
  font-weight: 600;
  font-size: calc(16 / 1280 * 100vw);
}
.container__head {
  font-size: calc(16 / 1280 * 100vw);
  color: #fff;
  padding: 0.8vw 1vw;
  position: relative;
  margin: 3vw auto;
  background: #231815;
}
.con--otv
._i02_ .page_container_wrap .grid_contents {
  margin: 0 auto 2.5vw;
}
.con--otv
._i02_ .page_container_wrap .circle_btn {
  margin: 5vw auto;
}
.con--otv
.merit_list {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  justify-content: center;
  align-items: center;
  text-align: center;
  margin: 1vw auto 7vw;
}
.merit_box .merit_list_ttl {
  font-size: clamp(16px, calc(17 / 1280 * 100vw), 18px);
  font-weight: 600;
  text-align: center;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
.merit_box .merit_list_ttl::before {
  content: "";
  width: 100%;
  height: 1px;
  background: #000;
  position: absolute;
  z-index: -1;
}
.merit_box .merit_list_ttl::after {
  content: "";
  background: #fff;
  width: 16%;
  height: 100%;
  position: absolute;
  z-index: -1;
}
.merit_item ._num {
  font-size: clamp(18px, calc(20 / 1280 * 100vw), 22px);
  font-weight: 600;
  color: #7f4957;
}
.merit_item ._ttl {
  font-size: clamp(14px, calc(16 / 1280 * 100vw), 18px);
  font-weight: 600;
  letter-spacing: 0.1vw;
}
.merit_item ._txt {
  font-size: clamp(12px, calc(14 / 1280 * 100vw), 15px);
}
.display_grid_contents {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 0 3%;
}
.display_grid_item {
  border: 1px solid #cbcbcb;
  display: grid;
  grid-template-columns: 0.9fr 1.2fr;
  grid-gap: 0 3%;
  justify-content: center;
  align-items: center;
  margin: 0 auto 2.5vw;
  padding: 0.5vw;
}
.display_grid_item:nth-child(7) {
  grid-template-columns: 0.5fr 1.2fr;
}
.display_grid_item ._ttl {
  font-size: clamp(12px, calc(15 / 1280 * 100vw), 16px);
  font-weight: 600;
padding-left: 13%;
}
.display_grid_item ._icon {
  padding: 2% 7%;
}
.caller_tablet_grid_contents {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-gap: 0 3.5%;
  padding: 2.5vw 1.5vw 0;
  margin: 0 auto 2.5vw;
}
.caller_tablet_grid_item {
  font-size: clamp(14px, calc(15 / 1280 * 100vw), 16px);
  font-weight: 600;
}
.caller_tablet_grid_item ._ttl {
  margin: 0.5vw auto;
}
.caller_tablet_grid_note {
  font-size: clamp(12px, calc(15 / 1280 * 100vw), 16px);
  padding: 0;
  font-weight: 500;
}
.caller_tablet_grid_box {
  border: 1px solid #c9c9c9;
  padding: 0 2.5vw 1.5vw;
}
.onetouch_call_grid_box {
  border: 1px solid #c9c9c9;
  padding: 3vw 2.5vw 1vw;
  margin: 3vw auto 12vw;
  display: grid;
  grid-template-columns: 0.5fr 1fr;
  grid-gap: 0 6%;
}
.onetouch_call_grid_box ._ttl {
  font-size: clamp(14px, calc(15 / 1280 * 100vw), 16px);
  font-weight: 600;
  margin: 0 auto 1.5vw;
}
.onetouch_call_grid_box ._txt {
  font-size: clamp(13px, calc(15 / 1280 * 100vw), 16px);
}


/* >>02 - service sec 2  デジタルメニューボード ----------------------------------------- */
._ts_1 {
  width: calc((800 / 1280) * 100vw);
  margin: 0 auto;
}
._ts_2 {
  width: calc((800 / 1280) * 100vw);
  margin: 8vw auto;
}
.con--menuboard
.circle_btn {
  width: calc((340 / 1280) * 100vw);
}
.con--menuboard
.circle_btn:hover .btn__arrow {
  width: 20%;
}




/* >>03 - service sec 3  導入ステップ ----------------------------------------- */
.con--step {
}
._ts_3 {
  width: 100%;
  margin: 2vw auto 10vw;
}
.container_wrap {
  width: clamp(700px, calc((800 / 1280) * 100vw), 1170px);
  margin: 0 auto;
}
.grid_flow .flow_item {
  margin: 0 auto 1.2vw;
}
.con--step .page_contents__container {
  padding: 0;
}


/* >>04 - service sec 4  FAQ（よくあるご質問）----------------------------------------- */
.con--faq {
  background: #ebebeb;
}
.con--faq .page_contents__container {
  padding: 5vw 0;
}
.faq_contents_wrap {
  width: clamp(700px, calc((800 / 1280) * 100vw), 1170px);
  margin: 1vw auto;
  background: #fff;
  padding: 3vw 2.5vw 2vw;
  counter-reset: faq-counter;
}
.faq_contents_wrap .ttl {
  font-size: calc(18 / 1280 * 100vw);
  margin: 0 auto 0.5vw;
}
.faq_contents_wrap .faq_contents_item {
  counter-increment: faq-counter;
  color: #3f3f3f;
  border-bottom: 1px solid #3f3f3f;
  margin: 0;
  padding: 1.6vw 1.5vw 1vw 0;
}
._question, ._answer {
  display: flex;
  position: relative;
  align-items: baseline;
  margin: 0 auto;
  padding: 0 0 1.5vw 6%;
  font-size: clamp(13px, calc((14 / 1280) * 100vw), 16px);
}
._answer {
  padding-bottom: 1%;
}
._question::before {
  background: #7b4755;
	font-weight: 600;
  color: #fff;
  padding: 0.1vw 0.5vw 0.1vw 0.6vw;
  margin: 0 1vw 0 0;
  content: "Q" counter(faq-counter) ". ";
  display: flex;
	width: calc((30 / 1280) * 100vw);
  height: calc((25 / 1280) * 100vw);
  font-size: calc(14 / 1280 * 100vw);
  justify-content: center;
  align-items: center;
  position: absolute;
  left: 0;
}
._answer::before {
  background: #647491;
	font-weight: 600;
  color: #fff;
  padding: 0.1vw 0.5vw 0.1vw 0.4vw;
  margin: 0 1vw 0 0;
  content: "A" counter(faq-counter) ". ";
  display: flex;
	width: calc((30 / 1280) * 100vw);
  height: calc((25 / 1280) * 100vw);
  font-size: calc(14 / 1280 * 100vw);
  align-items: center;
  position: absolute;
  left: 0;
}
.faq_contents_wrap .faq_contents_item:last-child {
  border-bottom: none;
  padding-bottom: 0;
}
.con--faq .circle_btn {
  margin: 6vw auto;
}



/* >>05 - service sec 5  屋外デジタルサイネージ ----------------------------------------- */
.con--outdoor_dgsig {
  margin: 14vw auto 12vw;
}
.con--outdoor_dgsig .page_contents__midashi {
  margin: 12vw auto;
}
.grid-wrap {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 0 7%;
}
.con--outdoor_dgsig .page_contents__container .grid-wrap {
  border-bottom: 1px solid #000;
  padding: 5vw 0;
}
.item_grid ._ttl {
  font-size: clamp(16px, calc((18 / 1280) * 100vw), 28px);
  font-weight: 600;
  color: #7b4755;
}
.item_grid ._txt {
  font-size: clamp(14px, calc((14 / 1280) * 100vw), 19px);
}
.item_grid {
  color: #000;
}
.con--outdoor_dgsig .page_contents__container {
  padding: 0;
}
.page_contents__window {
  background: url(https://tesuto-kyu-mu3917.net/soundgraph-test/wp-content/uploads/2025/02/window_bg.jpg) no-repeat;
  background-size: cover;
  width: 100%;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  background-attachment: fixed;
  background-position: center top;
}
.float_information {
  color: #fff;
  text-align: center;
}
.float_information ._ttl {
  font-size: clamp(20px, calc((22 / 1280) * 100vw), 24px);
  font-weight: 600;
  padding: 0 0 1.5vw;
}
.float_information ._txt {
  font-size: clamp(14px, calc((14 / 1280) * 100vw), 16px);
}


/* >>06 - service sec 6  LEDビジョン（屋外・屋内） ----------------------------------------- */
.con--ledvision {
}
.con--ledvision .page_contents__midashi {
  margin: 12vw auto;
}
.con--ledvision .page_contents__container:nth-child(5) {
  padding: 1vw 0 3vw;
}
.grid-wrap._twin {
  grid-template-columns: 1fr 1fr;
  grid-gap: 0 10%;
}
.utilize_title {
  font-size: clamp(16px, calc((18 / 1280) * 100vw), 25px);
  color: #7b4755;
  font-weight: 600;
  display: block;
  border-bottom: 1px solid #000;
  padding: 0 0 1vw;
  margin: 0 auto 1vw;
}
.utilize_list {
  padding: 0;
  list-style: none;
}
.utilize_list ._cat {
  color: #fff;
  background: #7f4a58;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 0.3vw 0.6vw;
}
.utilize_list ._txt {
  line-height: 1.5;
  padding: 0.5vw 0 1vw;
}





/* >>07 - service sec 7  用途別ソリューション一覧 ----------------------------------------- */
.con--solutions {
}
.con--solutions .item_grid ._ttl {
  font-size: clamp(15px, calc((16 / 1280) * 100vw), 25px);
  line-height: 1.5;
  margin: 1.8vw auto;
}
.con--solutions .grid-wrap._twin {
  margin: 7vw auto 1vw;
  grid-gap: 0 8%;
}
.con--solutions .item_grid {
  margin: 0 auto 6vw;
}
.con--solutions .page_contents__container:nth-child(4) {
  padding: 2vw 0;
}
.con--solutions .contents_note {
  color: #000;
  padding: 6vw 0;
  margin: 0 auto;
  text-align: center;
}
.con--solutions .contents_note ._ttl {
  font-size: clamp(16px, calc((18 / 1280) * 100vw), 28px);
  display: block;
  padding: 0 0 3vw;
  font-weight: 600;
}
.con--solutions .contents_note ._txt {
  font-size: clamp(14px, calc((14 / 1280) * 100vw), 21px);
}
.con--solutions .grid_item {
  border-left: 2px solid #7f4a58;
  padding-left: 1.5vw;
  color: #000;
  margin: 0 auto 4vw;
  width: 100%;
}
.con--solutions .grid_item ._ttl {
  font-size: clamp(15px, calc((16 / 1280) * 100vw), 24px);
  font-weight: 600;
  padding: 0;
  margin: 0 0 1.2vw;
}
.con--solutions .grid_item ._txt {
  font-size: clamp(14px, calc((14 / 1280) * 100vw), 19px);
}
.grid-wrap._twin._i02_ {
  display: grid;
  grid-gap: 0 3%;
  margin: 5vw auto 7vw;
}






/* >>08 - contents sec 8  サービス > コンテンツ----------------------------------------- */
.con--services_provided .grid-wrap._twin {
  grid-gap: 0 15%;
}
.con--services_provided .item_grid {
  margin: 0 auto 4vw;
}
.con--services_provided .item_grid ._ttl {
  color: #000;
  margin: 2vw auto;
  line-height: 1.5;
}
.con--services_provided .item_grid ._ttl .number {
  color: #7f4b58;
  font-size: calc(34 / 1280 * 100vw);
  padding: 0 0.5vw 0 0;
  letter-spacing: 0.3vw;
}	
.con--services_provided .item_grid ._txt {
  color: #3f3f3f;
}	
.features_box {
  display: grid;
  grid-template-columns: 11vw auto;
  justify-content: center;
  align-items: center;
  font-size: calc(18 / 1280 * 100vw);
  margin: 3vw auto;
}
.features_ttl {
  background: #000;
  color: #fff;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.features_txt {
  color: #000;
  font-weight: 600;
  padding-left: 2vw;
}



/* >>09 - rentalplan sec 9  サービス > レンタルプラン ----------------------------------------- */
.con--menuboard {
}
.con--menuboard .item_grid ._ttl {
  color: #3f3f3f;
  font-size: calc(14 / 1280 * 100vw);
  margin: 1.2vw auto;
}
.con--menuboard .item_grid ._txt {
  color: #3f3f3f;
}
.con--menuboard .grid-wrap {
  margin: 0 auto 6vw;
  grid-gap: 0 5%;
}



/* >>010 - service sec 10  サービス > 製品情報 ----------------------------------------- */
.con--product_information {
  background: #4a4a4a;
}
.product_contents_wrap {
  width: calc((800 / 1280) * 100vw);
  margin: 6vw auto;
}
.product_contents_wrap .product_item {
  color: #fff;
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  justify-content: center;
  align-items: center;
  border-bottom: 1px solid #fff;
  padding: 5vw 0;
  margin: 5w auto;
}
.product_item .product_data ._ttl {
  font-size: calc(16 / 1280 * 100vw);
  font-weight: 600;
}
.product_item .product_img {
  max-width: calc((165 / 1280) * 100vw);
  max-height: calc((115 / 1280) * 100vw);
  margin: 0 auto;
}
.product_contents_wrap .product_item:last-child {
  border: none;
}

.product-sig-head {
  display: grid;
  grid-template-columns: 15% auto auto;
  grid-gap: 5%;
  justify-content: flex-start;
  align-items: end;
}
._before_txt {
  font-size: clamp(15px, calc(17 / 1280 * 100vw), 18px);
  font-weight: 600;
	line-height: 1.2;
  color: #000;
	  margin: 0;
}
._main_ttl {
  font-size: clamp(24px, calc(30 / 1280 * 100vw), 34px);
  font-weight: 900;
	line-height: 1.6;
  color: #000;
	  margin: 0;
}
._after_txt {
  font-size: clamp(16px, calc(20 / 1280 * 100vw), 22px);
  font-weight: 400;
  color: #000;
  line-height: 1;
  margin: 1vw auto;
}
.product-sig-pic {
  margin: 4vw auto;
  max-width: 700px;
  justify-content: center;
  display: flex;
  max-height: 350px;
}
.product-sig-txt {
  font-size: clamp(12px, calc(14 / 1280 * 100vw), 16px);
  color: #000;
}
.product-sig-table th {
  background: #231815;
  color: #fff;
	border: none;
  border-right: 1px solid #fff;
  font-size: clamp(11px, calc(13 / 1280 * 100vw), 15px);
  font-weight: 400;
	line-height: 2;
}
.product-sig-table {
  margin: 3vw auto;
}
.product-sig-table th:last-child {
  border: none;
}
.product-sig-table td {
  color: #000;
  font-size: clamp(11px, calc(13 / 1280 * 100vw), 15px);
  font-weight: 400;
  border: none;
  border-bottom: 1px solid #231815;
}
.product-sig-table td:first-child {
  text-align: left;
  width: 25%;
  padding: 0.5vw 1.5vw;
}
.product-sig-table th:first-child {
  text-align: left;
  padding: 0.5vw 1.5vw;
}
.product-sig-table tr:nth-child(2n-1) {
  background: #e0e1e1;
}
._flex_box_in {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 5%;
  align-items: center;
}
._flex_box_in .product-sig-pic {
  max-width: 600px;
}
.product-sig-txt ._midashi {
  display: block;
  margin: 0 auto 1vw;
}
.con--product_signage .product_contents_wrap {
  padding: 6vw 0;
}
._hr_ {
  border: 0.5px solid #ccc;
}


@media screen and (max-width: 1024px) {
.product-sig-pic {
  max-width: 100%;
}
._flex_box_in .product-sig-pic {
  max-width: 100%;
}	
._flex_box_in {
  margin: 5vw auto;
}	
	
	
}

@media screen and (max-width: 767px) {
._displaylogo {
  max-width: 30vw;
}
._displayttl {
margin: 5vw 0 0;
}	
._displayttl {
margin: 5vw 0 0;
}	
._main_ttl {
line-height: 1.5;
}
.product-sig-pic {
margin: 10vw auto;
max-width: 100%;
max-height: inherit;
}	
.pro_table_sp {
  overflow: scroll;
  margin: 10vw auto;
}
._after_txt {
margin: 0;
line-height: 1.5;
}
.product-sig-head {
grid-template-columns: 1fr;
grid-gap: 0;
justify-content: inherit;
align-items: inherit;
}	
._flex_box_in {
grid-template-columns: 1fr;
grid-gap: 0;
}
._flex_box_in .product-sig-pic {
  max-width: 100%;
}	
.product-sig-table {
  width: 700px;
}	
	
}




/* >>011 - construction sec 11  サービス > 設置・施工 ----------------------------------------- */
.con--construction {
  background: url(https://tesuto-kyu-mu3917.net/soundgraph-test/wp-content/uploads/2025/02/window_bg2.jpg) no-repeat;
  background-attachment: fixed;
}
.con--construction .page_contents__container {
  min-height: 100vh;
}
.con--construction .grid-wrap {
  margin: 10vw auto;
}
.con--construction .grid_left {
  color: #fff;
}
.con--construction .grid_left ._title {
  font-size: calc(18 / 1280 * 100vw);
  font-weight: 600;
}
.con--construction .grid_left ._list {
  padding: 0;
  list-style: none;
  margin: 4vw auto;
}
.con--construction .grid_left ._list li {
  border-left: 3px solid #fff;
  padding-left: 1vw;
  margin-bottom: 2vw;
  font-size: calc(14 / 1280 * 100vw);
}
.con--construction .grid_right .item_img {
  margin: 0 auto 4vw;
}


/* >>012 - company sec 12  会社概要 ----------------------------------------- */
.con--company .midashi_en {
  font-size: calc(23 / 1280 * 100vw);
  letter-spacing: 0.5vw;
}
.company_table th, .company_table td {
	color: #000;
  border: none;
	font-size: calc(14 / 1280 * 100vw);
	padding: 1.8vw 0;
}
.company_table th {
  border-bottom: 2px solid #7f4b58;
  width: 20%;
  text-align: left;
  padding-left: 2vw;
}
.company_table td {
  border-bottom: 1px solid #6e6e6e;
  text-align: left;
	padding-left: 2vw;
	line-height: 2.5;
}

/* >>013 - contact sec 13  お問い合わせ ----------------------------------------- */
.con--contact {
  width: calc((800 / 1280) * 100vw);
  margin: 0 auto;
  max-width: 800px;
}
.con--contact .midashi_en {
font-size: calc(23 / 1280 * 100vw);
	font-weight: 700;
}
.page_contents__intro {
  text-align: left;
  color: #000;
  margin: 0 auto;
}
.contact_form_wrap {
  margin: 4vw auto;
}
.contact_form_table {
  margin: 0 auto;
}
.contact_form_table tr {
  display: grid;
  grid-auto-columns: 1fr;
  padding-bottom: 1vw;
}
.contact_form_table th, .contact_form_table td {
  width: 100%;
  border: none;
  text-align: left;
}
.contact_form_table th p, .contact_form_table td p {
  margin: 0;
}
.contact_form_table td input {
  width: 100%;
}
.contact_form_table sup {
  color: #d80f0f;
}
.contact_form_table th label {
  color: #000;
  margin: 0 auto;
}
.contact_form_table td input {
  width: 100%;
  font-size: calc(14 / 1280 * 100vw);
  border-radius: 5px;
  background: transparent;
  border: 1px solid #ccc;
  height: calc((45 / 1280) * 100vw);
  color: #444;
}
.contact_form_table td textarea {
  border-radius: 5px;
  background: transparent;
}
.contact_form_table th {
  padding-bottom: 0;
}
.submit_box input[type="submit"], .submit_box .wpcf7-previous {
  background: #231815;
  border: 1px solid #231815;
  color: #fff;
  letter-spacing: 0.2vw;
  width: 100%;
  max-width: calc((340 / 1280) * 100vw);
  border-radius: 0;
  margin: 4vw auto;
  height: calc((54 / 1280) * 100vw);
  font-size: calc(14 / 1280 * 100vw);
}
.submit_box input[type="submit"]:hover, .submit_box .wpcf7-previous:hover {
  background: transparent;
  color: #231815;
}
.submit_box p {
  width: 100%;
  gap: 0 5%;
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.submit_box {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 5vw auto;
}
.contact_form_table td input:active, .contact_form_table td input:focus, .contact_form_table td textarea:active, .contact_form_table td textarea:focus {
  outline: 1px solid #9e959a;
  border: 1px solid #9e959a;
  background: #f8f3f3;
}
.submit_box._enter p {
  grid-template-columns: 1fr;
}
.contact_form_inner {
  padding: 3vw;
  background: #f3f0f0;
  border-radius: 10px;
}
.page_contents__intro
.thanks_txt {
  text-align: center;
  line-height: 3;
}
.page_contents__intro .thanks_txt span {
  font-size: calc(15 / 1280 * 100vw);
}

.mw_wp_form_preview .contact_form_in {
  background: #eee;
  border-radius: 10px;
  padding: 3vw 3vw 1vw;
}
.your_answer_submit1, .your_answer_submit2, .your_answer_submit3 {
  width: 100%;
background: #231815;
  border: 1px solid #231815;
  color: #fff;
  letter-spacing: 0.2vw;
  width: 100%;
  max-width: calc((340 / 1280) * 100vw);
  border-radius: 0;
  margin: 0 1%;
	padding: 0;
  height: clamp(45px, calc(54 / 1280 * 100vw), 60px);
  font-size: clamp(12px, calc(14 / 1280 * 100vw), 16px);
}
.your_answer_submit1:hover, .your_answer_submit2:hover, .your_answer_submit3:hover {
  color: #231815;
}
.your_answer_submit1 {
  width: 50%;
}
.contact-first-intro,
.mw_wp_form_complete .thanks_txt {
  color: #000;
  line-height: 1.5;
}
.mw_wp_form_complete .thanks_txt span {
  font-size: clamp(15px, calc(17 / 1280 * 100vw), 20px);
}
.contact-first-intro {
  text-align: left;
  margin-bottom: 3vw;
}
.contact-first-intro.__writing2 {
  display: none;
}
.mw_wp_form_confirm .contact-first-intro.__writing {
  display: none;
}
.mw_wp_form_confirm .contact-first-intro.__writing2 {
 display: block;
}



/* ---------------------------------------
 *  fade STYLE sun light 
 * --------------------------------------- */	
/* 初期状態（非表示） */
.sunlight {
  opacity: 0;
	visibility: hidden;
  transform: translateY(50px);
  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}
.sunlight.active {
  opacity: 1;
	visibility: visible;
  transform: translateY(0);
}
/* animetion */
.sunlight.fw1 {
  transition-delay: 0.3s;
}
.sunlight.fw2 {
  transition-delay: 1s;
}
.sunlight.fw3 {
  transition-delay: 2s;
}




/* ---------------------------------------
 *  view size -- 768px
 * --------------------------------------- */	
@media screen and (min-width: 768px) {	
	
}/* x768+ */




/* ---------------------------------------
 *  view size -- 1200px
 * --------------------------------------- */	
@media screen and (max-width: 1200px) {
.flow_step__item ._note {
padding-top: 20%;
}	
	
	
	
}

/* ---------------------------------------
 *  view size -- 767px
 * --------------------------------------- */	
@media screen and (max-width: 767px) {
/* front page */
/* screen */
.screen1 {
background: url('https://tesuto-kyu-mu3917.net/soundgraph-test/wp-content/uploads/2025/03/sg_keyimg01_1_sp.jpg') center/cover no-repeat;
}
.screen2 {
background: url('https://tesuto-kyu-mu3917.net/soundgraph-test/wp-content/uploads/2025/02/sg_keyimg02_sp.jpg') center/cover no-repeat;
}
/* screen item */
.key_img {
	width: clamp(188px, calc(245 / 375 * 100vw), 240px);
	margin-bottom: 15vw;
}
.key_txt {
    font-size: clamp(19px, calc(21 / 1280 * 100vw), 26px);
    line-height: 1.8;
	margin-top: 20%;
}
.screen1 .key_txt {
  margin-top: 0;
}	
	
/* sp front >> picup */
.front__contents__picup {
  padding: 0;
}
.front__contents__picup .contents__wrap {
	padding: 30vw 0 0;
}
.front__contents__picup .front__ttl {
font-size: calc(18 / 375 * 100vw);
line-height: 1.5;
}	
.picup_item {
width: 100%;
}
.picup_ttl {
    font-size: calc(15 / 375 * 100vw);
    padding: 5vw 0;
    text-align: left;
    width: 100%;
}
 .picup_data p {
    font-size: calc(14 / 375 * 100vw);
    min-height: inherit;
  }	
.line_btn .btn__tx {
font-size: calc(13 / 375 * 100vw);
}
.line_btn .btn__en {
font-size: calc(13 / 375 * 100vw);
letter-spacing: 0.3vw;
	width: 50%;
}
.line_btn:hover .btn__en {
  width: 50%;
}
.picup_item .picup_img {
	width: 90%;
    margin: 5vw auto 0;
}
	
	
/* sp front >> sns */	
.contents__wrap .front__ttl .icon {
  max-width: calc((34 / 375) * 100vw);
  margin: 0 auto 5vw;
}
.front__contents__sns .front__ttl {
font-size: calc(15 / 375 * 100vw);
}
.front__contents__sns .contents__wrap {
padding: 30vw 0 20vw;
}
.front__contents__sns_wrap {
max-width: 100%;
margin: 0 auto;
}	
.front__contents__sns .circle_btn {
  margin: 10vw auto;
}
.circle_btn .btn__arrow {
  width: 20%;
}

/* sp front >> end visual */
.endvisual_area {
	background: url(https://tesuto-kyu-mu3917.net/soundgraph-test/wp-content/uploads/2025/02/front_bg_sp.jpg) no-repeat;
	background-size: contain;
	height: calc((290 / 375) * 100vw);
}	
.endvisual__logo {
    width: clamp(90px, calc(106 / 375 * 100vw), 240px);
    margin: 0 auto;
  }	
  .endvisual__ttl {
    font-size: clamp(10px, calc(12 / 375 * 100vw), 14px);
    letter-spacing: 2.8vw;
    margin: 0;
    max-width: 90%;
}

/* sp front >> company */	
.front__contents__bottom .contents__wrap {
  padding: 14vw 0;
}
.endprofile_area .front__ttl {
    font-size: clamp(16px, calc(18 / 1280 * 100vw), 22px);
    letter-spacing: 4vw;
    line-height: 2;
    margin: 0 auto 6vw;
}	
	
/* sp >> page >> CONTENTS ---------------------- */
	
/* sp >> page head menu */
.contens_header_menu ul {
grid-template-columns: 1fr;
grid-template-rows: inherit;
gap: 0;
}
.contens_header_menu ul li a {
    font-size: clamp(14px, calc((14 / 1280) * 100vw), 15px);
    padding: 0.5vw 2vw;
}
.contens_header_menu {
padding: 12vw 0;
}
.contens_header_menu ul li {
margin-bottom: 2.5vw;
}#content .row {
margin-top: 44px;
}
	
/* sp >> page pankuzu */
.page_breadcrumbs {
display: none;
}
	
/* sp >> page wide */
.page_contents__wrap {
width: 70%;
}
.con--innner {
  margin: 0 auto;
  padding: 0 0 20vw;
}
	
	
	
/* sp >> page title */
.page_contents__title {
    font-size: clamp(14px, calc((14 / 1280) * 100vw), 16px);
    padding: 2.8vw 5vw;
    width: 100%;
}
	
/* sp >> page head img */
.page_contents__head {
  margin: 3vw auto;
}	
 .page_contents__head .page_contents__wrap {
    grid-template-columns: 1fr;
    align-content: center;
    justify-content: center;
    width: 100%;
    padding: 0;
	grid-template-rows: auto;
  }
.page_contents__head .head_ttl {
	margin-bottom: 8vw;
}
.page_contents__head .head_txt {
min-height: auto;
}	
 .page_contents__head .head_img::before {
    width: clamp(70px, calc(70 / 1280 * 100vw), 120px);
	 right: 5%;
  }	
 .contents_head_grid:nth-child(1) {
    order: 2;
    padding: 12vw 6%;
    margin: 0;
  }
.container_banner {
width: 90%;
}
 .midashi_en {
    margin: 0 auto 5vw;
    letter-spacing: 1vw;
    font-size: clamp(18px, calc((22 / 1280) * 100vw), 24px);
    letter-spacing: 0.38vw;
  }
.midashi_ttl {
font-size: calc(14 / 375 * 100vw);
}
.page_contents__midashi {
margin: 20vw auto;
}	
._ts_1 {
width: 100%;
}	
._ts_2 {
width: 90%;
margin: 0 auto 20vw;
}	
.con--menuboard .circle_btn {
  width: 90%;
}	
.container_wrap {
width: 100%;
}
	
	
	
/* ---------------------------------------- 
 * 01 sp >> services */		
.con--services_provided .page_contents__head .page_contents__wrap {
  padding-top: 0;
}	
.con--services_provided .item_grid ._ttl .number {
  font-size: calc(34 / 375 * 100vw);
}	
.con--services_provided .grid-wrap._twin .item_grid {
  margin: 0 auto 10vw;
}
.features_box {
	width: 90%;
font-size: calc(18 / 375 * 100vw);
display: block;
margin: 10vw auto;
}	
.features_ttl {
display: inline-block;
padding: 1vw 5vw;
width: auto;
}	
.features_txt {
  font-size: calc(14 / 375 * 100vw);
  padding: 3vw 0;
}
	
	
.con--about .page_contents__wrap,
.con--outdoor_dgsig .page_contents__wrap,
.con--ledvision .page_contents__wrap {
  grid-template-columns: 1fr;
  grid-gap: 0;
  margin: 0 auto 10vw;
}
.con--about .page_contents__wrap .grid_right,
.con--outdoor_dgsig .page_contents__wrap .grid_right,
.con--ledvision .page_contents__wrap .grid_right {
  padding: 5% 7% 7%;
}
.merit_list {
  padding: 0 5%;
	margin: 0 auto 20vw;
}
.merit_list_item {
grid-template-columns: 1fr;
	padding: 5vw 0;
	border-top: 1px solid #cfcfcf;
}	
.merit_list_item ._num {
display: none;
}	
.merit_list_item:last-child {
  border-bottom: none;
}	
		

	

/* ----------------------------------------
 * 02 sp >> digital menu board */	
.con--menuboard .page_contents__wrap {
  padding-top: 0;
}	
.con--menuboard .midashi_en {
    letter-spacing: 0.8vw;
}
.con--menuboard ._i02_ .midashi_en {
    letter-spacing: 0.4vw;
}
.con--menuboard .grid-wrap {
  display: block;
  width: 90%;
}	
.con--menuboard .item_grid ._ttl {
  font-size: calc(14 / 375 * 100vw);
	margin: 3vw auto;
}	
.con--menuboard .grid-wrap .item_grid {
  margin: 0 auto 10vw;
}	
.con--step .midashi_en {
  line-height: 1.5;
}	
  .intro_digital_menu_board {
    width: 100%;
    margin-bottom: 65vh;
	  text-align: center;
  }	
 .intro_digital_menu_board .intro_dmb_note {
    top: 91%;
    width: 100%;
    padding: 0;
    max-width: 300px;
    margin: 0 auto;
    left: 0;
    right: 0;
  }
.intro_dmb_note ._ttl {
  margin: 0 auto 8vw;
}	
.intro_digital_menu_board .intro_dmb_img {
  width: 100%;
	max-width: 500px;
}
.intro_digital_menu_board ._bg {
    top: 80%;
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
    left: 0;
    right: 0;
  }
	
	
	
/* ----------------------------------------
 * 03 sp >> step */	
.con--step .midashi_en {
  line-height: 1.5;
}	
.flow_step__item ._note {
padding: 5%;
height: auto;
top: inherit;
}
.flow_step__item {
justify-content: center;
align-items: center;
display: flex;
}	
.flow_step__item ._note ._ttl {
margin: 0 auto 5vw;
}	

/* ----------------------------------------
 * 04 sp >> F & Q */			
.con--faq {
  margin: 12vw auto;
}	
.faq_contents_wrap {
width: 90%;
padding: 5vw 4vw;
	margin: 4vw auto;
}	
.faq_contents_wrap .ttl {
    font-size: clamp(16px, calc((18 / 1280) * 100vw), 20px);
    margin: 0 auto 5vw;
}	
._question, ._answer {
padding-left: 13%;
}
._question::before, ._answer::before {
    width: clamp(25px, calc(30 / 375 * 100vw), 35px);
    height: clamp(22px, calc(24 / 375 * 100vw), 26px);
    font-size: clamp(12px, calc(14 / 375 * 100vw), 14px);
    padding: 0 1vw 0 1.5vw;
  }	
._answer::before {
padding: 0 0 0 1.2vw;
}
.con--faq .circle_btn {
  margin: 15vw auto;
}
/* ----------------------------------------
 * 05 sp >> con--outdoor_dgsig */		
.con--outdoor_dgsig {
  margin: 20vw auto;
}
.con--outdoor_dgsig .page_contents__midashi {
  margin: 20vw auto;
}
.con--outdoor_dgsig .grid-wrap {
  width: 90%;
  margin: 0 auto;
}	
.item_grid ._ttl {
    font-size: clamp(16px, calc(18 / 375 * 100vw), 21px);
}
.con--outdoor_dgsig .page_contents__container .grid-wrap .item_grid {
  padding: 0 0 8vw;
}	
.faq_contents_wrap .faq_contents_item {
padding: 4vw 1.5vw 4vw 0;
}	
.con--outdoor_dgsig .page_contents__head .page_contents__wrap {
  padding: 0 0 3vw;
}
.con--outdoor_dgsig .container_wrap .grid-wrap {
    padding: 10vw 0;
    grid-template-columns: 1fr;
    border: none;
  }
.con--outdoor_dgsig .midashi_en {
  font-size: calc(16 / 375 * 100vw);
}	
.page_contents__window {
max-height: calc(365 / 375 * 100vw);
}
.float_information ._ttl {
}
/* ----------------------------------------
 * 06 sp >> con--ledvision */
.con--ledvision {}
.con--ledvision .page_contents__wrap {
padding-top: 0;
}
.con--ledvision .page_contents__container:nth-child(5) {
  padding: 12vw 0;
}
.con--ledvision .page_contents__midashi {
  margin: 20vw auto;
}
.grid-wrap._twin {
grid-template-columns: 1fr;
}	
.utilize_title {
    margin: 0 auto 4vw;
    padding: 0 0 2vw;
  }
.utilize_list ._txt {
  line-height: 1.5;
  padding: 1vw 0 6vw;
}
.grid-wrap._twin .item_grid {
  width: 90%;
  margin: 0 auto;
}	
.utilize_list ._cat {
padding: 0.5vw 2vw;
}	
	
	
	
/* ----------------------------------------
 * 07 sp >> con--solutions */
.con--solutions {
  padding: 0 0 15vw;
}
.con--solutions .midashi_en {
    letter-spacing: 0.5vw;
}	
.con--solutions .item_grid ._ttl {
margin: 5vw auto;
}
.con--solutions .contents_note {
padding: 15vw 0;
}	
.con--solutions .grid-wrap._twin .item_grid {
  margin: 0 auto 10vw;
}
.con--solutions .contents_note ._ttl {
font-size: calc(18 / 375 * 100vw);
	font-weight: 600;
}
.con--solutions .contents_images {
  margin: 0 auto 10vw;
  width: 90%;
  margin: 0 auto;
}
.con--solutions .grid-wrap._twin._i02_ {
  width: 90%;
  margin: 10vw auto;
}	
.con--solutions .grid_item ._ttl {
font-size: calc(16 / 375 * 100vw);
margin: 3vw auto;
}	
.con--solutions .grid_item {
padding-left: 5vw;
} 
.contents_img_note {
max-width: 90%;
padding: 5vw;
}
.smartcontrol_note img {
margin: 5vw auto;
padding: 0 5vw;
}	
.solution_img {
  text-align: center;
  width: 100%;
}		
/* ----------------------------------------
 * 01-2 sp >> con--otv */	
.con--otv .midashi_en {
font-size: calc(22 / 375 * 100vw);
}
.con--otv .midashi_en span {
font-size: calc(14 / 375 * 100vw);
}
.con--otv	
.page_contents__midashi {
margin: 15vw auto 10vw;
}
.con--otv .page_container_wrap {
  width: 90%;
	margin: 0 auto 15vw;
	}
.con--otv .page_container_wrap ._note {
    font-size: calc(16 / 375 * 100vw);
    margin: 10vw auto;
  }
.page_container_wrap .intro {
  text-align: center;
}
.con--otv .container__head {
  font-size: calc(14 / 375 * 100vw);
  padding: 2vw 5%;
}	
.merit_box {
  margin: 15vw auto;
}
.con--otv ._i02_ .page_container_wrap .grid_contents .grid_item {
  margin: 0 auto 10vw;
}
.con--otv ._i02_ .page_container_wrap .circle_btn {
    margin: 0 auto;
    width: 100%;
  }	
.merit_box .merit_list_ttl::after {
width: 40%;
}
.merit_box .merit_list {
  padding: 0;
  margin: 7vw auto 20vw;
  grid-template-columns: 1fr;
}	
.merit_box .merit_list .merit_item {
  margin: 0 auto 10vw;
}	
.display_grid_contents {
grid-template-columns: 1fr;
}	
.display_grid_item {
grid-template-columns: 1fr 1.1fr;
}
.display_grid_item ._icon {
  padding: 0;
}
.caller_tablet_grid_contents {
  grid-template-columns: 1fr 1fr;
	grid-gap: 0 7.5%;
  border: none;
}
.caller_tablet_grid_box {
  border: none;
}
.caller_tablet_grid_note {
  margin: 5vw auto;
}	
.caller_tablet_grid_item ._ttl {
  font-size: clamp(12px, calc(14 / 1280 * 100vw), 15px);
  margin: 2vw auto 5vw;
}	
.onetouch_call_grid_box {
  grid-template-columns: 1fr;
  padding: 7vw 3vw;
}	
	
	
	
/* ----------------------------------------
 * 10 sp >> con--product */	
.product_contents_wrap {/* ! */
width: 90%;
  margin: 5vw auto;
}	
.product_contents_wrap .product_item {
    text-align: center;
    display: block;
  }	
.product_item .product_img {
max-width: calc((165 / 375) * 100vw);
max-height: calc((115 / 375) * 100vw);
margin: 10vw auto;
}	
.product_item .product_data ._ttl {
  font-size: calc(16 / 375 * 100vw);
  text-align: left;
}
.product_item .product_data ._txt {
  text-align: left;
}	
.con--product_information .circle_btn {
  margin: 10vw auto;
}
/* ----------------------------------------
 * 11 sp >> con--construction */
.con--construction {
  background: url(https://tesuto-kyu-mu3917.net/soundgraph-test/wp-content/uploads/2025/03/window_bg2_sp.jpg) no-repeat;
  background-attachment: fixed;
}
.con--construction .container_wrap {
  padding: 0 5%;
}	
.con--construction .grid_left ._list li {
font-size: calc(14 / 375 * 100vw);
padding-left: 4%;
margin-bottom: 5vw;
}	
.con--construction .grid_left ._title {
font-size: calc(18 / 375 * 100vw);
}
.con--construction .container_wrap {
padding: 0 5%;
}
.con--construction .grid_left ._list {
  margin: 10vw auto;
}	
.con--construction .grid_right .item_img {
  margin: 0 auto 14vw;
}	
/* ----------------------------------------
 * 12 sp >> con--company */
.con--company {

}
.con--company .midashi_en {
  font-size: calc(23 / 375 * 100vw);
  letter-spacing: 1vw;
  margin: 0 auto 1vw;
font-weight: 700;
}
.con--company .page_contents__midashi {
  margin: 10vw auto;
}
.company_table tr {
}
  .company_table th {
    font-size: calc(14 / 375 * 100vw);
    font-weight: 600;
    width: 25%;
  }
  .company_table td {
    font-size: calc(13 / 375 * 100vw);
    line-height: 2;
  }
.company_table td a {
    color: #000;
  }
.container_wrap._company {
  width: 90%;
}	

/* ----------------------------------------
 * 13 sp >> con--contact */
.con--contact .midashi_en {
  font-size: calc(23 / 375 * 100vw);
  font-weight: 600;
}	
.con--contact {
width: 90%;
}
.contact_form_table td input {
font-size: calc(14 / 375 * 100vw);
height: 55px;
}
.contact_form_table {
margin: 8vw auto;
}
.submit_box input[type="submit"], .submit_box .wpcf7-previous {
height: 55px;
font-size: 14px;
max-width: 100%;
width: 90%;
}
.page_contents__intro .thanks_txt span {
  font-size: calc(15 / 375 * 100vw);
}	
.page_contents__intro .thanks_txt {
  line-height: 2;
}	
.con--about,
.con--menuboard,
.con--step,
.con--faq,
.con--outdoor_dgsig,
.con--ledvision,
.con--solutions
	{
  margin-top: 10vw;
  padding-top: 10vw;
}		
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
/* ?????? */
/* ?????? */
/* ?????? */	
	
	
	
}