/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;-moz-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}

/*!///////////////////////////////////////////*/
/*!//////////// ↓↓↓reset↓↓↓ ////////////*/
/*!///////////////////////////////////////////*/
*, *::before, *::after { box-sizing: border-box;}
h1, h2, h3, h4, h5, h6, p, ul, ol, dl { margin: 0; color: #231815;}
a { text-decoration: none;}
ul,ol { padding-left: 0; list-style-type: none;}
dd { margin-left: 0;}
p {font-size: 14px; line-height: 1.75; color: #231815;}
@media screen and (min-width: 768px) { p { font-size: 16px;}}
button {border: 0;}
/*!///////////////////////////////////////////*/
/*!//////////// ↑↑↑reset↑↑↑ ////////////*/
/*!///////////////////////////////////////////*/


/*!////////////////////////////////////////////*/
/*!//////////// ↓↓↓common↓↓↓ ////////////*/
/*!////////////////////////////////////////////*/

@media print { body{ display: none !important; } }

body { font-family: "Zen Old Mincho" ,"Arial","Zen Kaku Gothic New", sans-serif; min-height: 0vw;}
a * {pointer-events: none;}
img {display: block; width: 100%; height: auto; object-fit: contain;
      pointer-events: none;
      -webkit-touch-callout: none;
      -webkit-user-select: none;
      -moz-touch-callout: none;
      -moz-user-select: none;
      user-select: none;
}
svg {display: block; width: 100%; height: 100%; object-fit: contain;}
@media screen and (max-width: 767px) {
  .sp-none { display: none !important;}}
@media screen and (min-width: 768px) {
  .pc-none {display: none !important;}}
.hidden { display: none !important;}
.image { display: block; width: 100%;}
.wrapper {position: relative; overflow:clip;}
.container {
  position: relative;
  width: 100%;
  max-width: 1040px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
}

.Grid {
  width: 100%;
  display: grid;
  grid-template-columns: auto;
  grid-template-rows: auto;
  justify-content: center;
  place-items: center;
  gap: 10px;
}

.WBR {
  word-break: keep-all;
  overflow-wrap: anywhere;
}

.anker-link {
  position: relative;
}
.target-anker-link {
  position: absolute;
  width: 0;
  height: 0;
  opacity: 0;
  /* bottom: calc(100% + clamp(50px,calc(85vw / 7.67),85px)); */
  top: 0;
  left: 0;
}

.top-link-wrapper {
  position: relative;
  margin-top: -54px;
}
@media screen and (max-width: 767px) {
.top-link-wrapper {
  margin-top: -44px;
}
}

.top-link {
  z-index: 2;
  position: sticky;
  top: calc(100svh - clamp(44px,calc(54vw / 10),54px));
  width: 100%;
  height: 54px;
  pointer-events: none;
}
@media screen and (max-width: 767px) {
.top-link {
    height: 44px;
}
}

.top-link a {
  display: block;
  width: clamp(44px,calc(54vw / 10),54px);
  height: clamp(44px,calc(54vw / 10),54px);
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 54.24 54.24"><polygon fill="%23ffffff" points="27.59 14.96 10.33 30.86 10.33 35.07 27.59 19.17 44.85 35.07 44.85 30.86 27.59 14.96"/></svg>') ,linear-gradient(21.8deg,#042A57,#21639B);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  display: block;
  margin-left: auto;
  pointer-events: all;
  transition: .3s;
  margin-right: 2px;
  border-radius: 5px;
}
.top-link a:hover {
  transform: translateY(-5px);
}

.fade {
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 1s, transform 0.8s;
}
.fade--left {
  transform: translateX(-15px);
}
.fade--right {
  transform: translateX(15px);
}
.fade--top {
  opacity: 0;
  transition: opacity 3s;
}
.fade--in {
  opacity: 1;
  transform: translate(0, 0);
}




/*!////////////////////////////////////////////*/
/*!//////////// ↑↑↑common↑↑↑ ////////////*/
/*!////////////////////////////////////////////*/

body.menu-ac {
  overflow: hidden;
}

#svg-logo-kaneka .cls-1 {
  fill: #06579a;
}

.header{
  z-index: 100;
  position: fixed;
  top: 0;
  right: 0;
  height: clamp(50px,calc(85vw / 7.67),85px);
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: #fff;
  padding-right: clamp(15px,calc(27vw / 7.67),27px);
  padding-left: clamp(18px,calc(40vw / 7.67),40px);
  transtion: .3s;
}

.header.header--1.header--scroll {
  width: auto;
}

@keyframes fadeIn {
  0% { display: none; opacity: 0; }
  1% { display: block; opacity: 0; }
  100% { display: block; opacity: 1; }
}
.header--1 .kaneka-logo {
  animation: fadeIn 1s ease-in 0s forwards;
}

@keyframes fadeOut {
  0% { display: block; opacity: 1; }
  100% {display: none; opacity: 0; }
}

.header--1.header--scroll .kaneka-logo {
  /* ブラウザで挙動が揃わないので下記2個は消さないこと */
  display: none;
  animation: fadeOut 1s ease-in .3s forwards;
}

.hd-logo {
  max-width: 150px;
  width: 100%;
}

.kaneka-logo {
  display: block;
  /* width: clamp(87.6742px,calc(138.5469vw / 7.67),138.5469px); */
  /* height: clamp(21.8542px,calc(34.535vw / 7.67),34.535px); */
  width: clamp(75px,calc(138.5469vw / 7.67),138.5469px);
  height: auto;
  aspect-ratio: 9 / 36.106;
}
@media screen and (max-width: 767px) {
.kaneka-logo {
  width: min(calc(75vw / 3.76),75px);
}
}

.menu-button {
  cursor: pointer;
  position: relative;
  width: clamp(52.3022px,calc(87vw / 7.67),87px);
  height: clamp(22.3382px,calc(37vw / 7.67),37px);
  transition: .3s;
  margin-left: auto;
}
.menu-button:hover {
  opacity: .7;
}
.menu-button::before, .menu-button::after ,.menu-button span {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: clamp(2px,calc(3vw / 7.67),3px);
  background-color: #003770;
  transition: .5s;
}
.menu-button::before, .menu-button::after {
  content: "";
}
.menu-button::after {
  top: auto;
  bottom: 0;
}
.menu-ac .menu-button::before, .menu-ac .menu-button::after {
  width: clamp(53px,calc(94vw / 10),94px);
  transform: translate(-50%,-50%) rotate(30deg);
  transform-origin: top;
  top: 50%;
  right: auto;
  left: 50%;
}
.menu-ac .menu-button::after {
  transform: translate(-50%,-50%) rotate(-30deg);
}
.menu-ac .menu-button:hover::before, .menu-ac .menu-button::after {
  transform: translate(-50%,-50%) rotate(-30deg);
}
.menu-ac .menu-button:hover::after {
  transform: translate(-50%,-50%) rotate(30deg);
}
.menu-ac .menu .header{
  position: static;
}
@media screen and (min-width: 768px) {
  .menu-ac .menu .header{
    background-color: transparent;
  }
  .menu-ac .menu-button::before, .menu-ac .menu-button::after {
    background-color: #fff;
  }
}

.menu-wrapper {
  max-width: 894.5px;
  height: 100%;
  margin-left: auto;
}
@media screen and (max-width: 767px) {
  .menu-wrapper {
    height: 100vh;
  }
}

.menu-button span {
  top: 50%;
  transform: translateY(-50%);
  /* width: calc(43.5% / 0.87); */
  transition: .3s;
}
.menu-button:hover span {
  transform: translate(15px,-50%);
}

.menu-ac span {
  transform: translate(15px,-50%);
  opacity: 0;
  width: 0%;
}

.menu {
  position: fixed;
  z-index: 999;
  width: 100svw;
  height: 100svh;
  top: 0;
  left: 0;
  opacity: 0;
  visibility: hidden;
  transition:.3s;
  pointer-events: none;
  background-color: rgba(35, 24, 21, 0);
}

.menu-ac .menu {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
  background-color: rgba(35, 24, 21, .5);
}

nav {
  transform: translateX(100%);
  transition: .5s;
  padding: clamp(20px,calc(70vw / 10),70px);
  width: 100%;
  height: 100%;
}
.menu-ac nav {
  transform: translateX(0);
}
@media screen and (min-width: 768px) {
  nav {
    padding-top: 0;
    grid-template-columns: 1fr auto;
  }
  .menu-ac nav {
  justify-content: space-between;
  }
}
@media screen and (max-width: 767px) {
  .menu-ac nav {
    max-height: calc(100svh - clamp(50px, 11.0821vw, 85px));
  }
}

.menu-banner {
  grid-template-columns: 1fr;
}
@media screen and (min-width: 768px) {
  .menu-banner {
    grid-template-columns: 1fr 1fr 1fr;
  }
}

.menu-banner-item {
  display: block;
  background-color: #fff;
  width: 100%;
  height: 100%;
}

.menu-banner-item p {
  color: #231815;
}

.menu-banner-item span {
  display: block;
  width: 30px;
  height: 30px;
}

.menu-banner-item svg {
  width: 100%;
  height: 100%;
}

.menu-banner-item svg,.menu-banner-item img {
  transition: .3s;
}
.menu-banner-item:hover svg,.menu-banner-item:hover img {
  transform: scale(.93);
}

.svg-icon-cart {
  fill: #231815;
}

@media screen and (min-width: 768px) {
  .sns-list.menu-sns-list {
    grid-template-columns: 52px;
    gap: 20px;
    margin-top: auto;
    margin-bottom: 0;
  }
  .menu-banner {
    grid-area: 2 / 1 / 3 / 3;
  }
  .menu-sns-list {
    grid-area: 1 / 2 / 2 / 3;
  }
}
@media screen and (max-width: 767px) {
  .sns-list.menu-sns-list {
    margin: auto;
  }
}

.menu-list {
  width: 100%;
  max-height: 436.609px;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.sns-x-icon.menu-sns-list--sns-x-icon {
  fill: #fff;
}

.menu-list-item {
  position: relative;
  padding: 2.5px 0 2.5px clamp(50px,calc(75vw / 10),75px);
  grid-template-columns: auto auto;
  gap: 5px 10px;
  justify-content: flex-start;
}
@media screen and (max-width: 767px) {
  .menu-list-item {
    grid-template-columns: auto;
    place-items: flex-start;
  }
}

.menu-list-item p ,.menu-list-item i {
  transition: .3s;
  line-height: 1;
  white-space: nowrap;
}

p.menu-list-item-en {
  font-size: clamp(24.220px,calc(35.2971vw / 10),35.2971px);  
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 700;
  letter-spacing: 0.2rem;
}

p.menu-list-item-jp {
  font-size: clamp(16.8619px,calc(22.8393vw / 10),22.8393px);  
  font-weight: 500;
}

.menu-list-item:hover p ,.menu-list-item:hover p i {
  color: rgba(255, 255, 255, 0.8);
}

.menu-list-item .gumi-deco-move {
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: clamp(45.8925px,calc(60.2236vw / 10),60.2236px);
  display: block;
}
.menu-list-item:hover .gumi-deco-move {
  animation: motimoti 0.6s linear 0s 1;
}
@keyframes motimoti {
  0%   { transform: scale(1.0, 1.0) translate(0%, -50%); }
  15%  { transform: scale(0.9, 0.9) translate(0%, -50%); }
  30%  { transform: scale(1.03, 0.95) translate(0%, -50%); }
  50%  { transform: scale(0.95, 1.0) translate(0%, -50%); }
  70%  { transform: scale(1.03, 0.98) translate(0%, -50%); }
  100% { transform: scale(1.0, 1.0) translate(0%, -50%); }
}


.menu-banner a {
  border-radius: 5px;
  border: 1px #000 solid;
  display: grid;
  place-items: center;
  min-height: clamp(45px,calc(95vw / 10),95px);
  padding: clamp(5px,calc(10vw / 10),10px);
  transition: .3s;
}
.menu-banner a:hover {
  transform: scale(.98);
}

.menu-banner a p {
  font-family: "Zen kaku Gothic New", sans-serif;
  line-height: 1.45;
  font-weight: 500;
}

.menu-banner-item--1 {
  background-image: linear-gradient(45deg,#FDEDE4,#FFFDEA 63%,#FDEFF4);
  text-align: center;
}

.menu-banner-item--1 p {
  font-size: clamp(17px,calc(20vw / 10),20px);
  color: #EB686F;
}

.menu-banner-item--2 ,.menu-banner-item--3 {
  display: grid;
  grid-template-columns: auto auto;
  justify-content: center;
}

a.menu-banner-item--2 {
  gap: clamp(4px,calc(12vw / 10),12px);
  padding: clamp(5px,calc(10vw / 10),10px) 5px clamp(5px,calc(10vw / 10),10px) clamp(10px,calc(20vw / 10),20px);
}

.menu-banner-item--2 p {
  display: inline-block;
}

.menu-banner-item--3 p {
  font-size: clamp(17px,calc(22vw / 10),22px);
}

.sns-x-icon.menu-banner-x-icon {
  fill: #000;
  width: clamp(26.4194px,calc(52.638vw / 10),52.638px);
  height: clamp(27px,calc(53.7947vw / 10),53.7947px);
}

.menu-banner-cart {
  width: clamp(27.6346px,calc(34.7692vw / 10),34.7692px);
  height: clamp(27.6715px,calc(34.8156vw / 10),34.8156px);
}

.fv {
  z-index: 1;
  position: relative;
  padding-top: clamp(50px,calc(85vw / 7.67),85px);
}

.fv h1 {
  position: absolute;
  top: calc(calc(385vw / 14) + clamp(50px,calc(85vw / 7.67),85px));
  left: 50%;
  transform: translateX(-50%);
  width: calc(755.6604vw / 14);
  text-align: center;
}
@media screen and (max-width: 767px) {
  .fv h1 {
    top: calc(calc(258vw / 3.76) + clamp(50px,calc(85vw / 7.67),85px));
    width: calc(354vw / 3.76);
  }
}

.fv-note {
  position: absolute;
  right: calc(25vw / 14);
  bottom: calc(30vw / 14);
  font-size: calc(13vw / 14);
  font-weight: 500;
  color: #fff;
  font-family: "Zen Kaku Gothic New", sans-serif;
  pointer-events: none;
}
@media screen and (max-width: 767px) {
  .fv-note {
    right: calc(10vw / 3.76);
    bottom: calc(18vw / 3.76);
    font-size: calc(9vw / 3.76);
  }
}

.common-title {
  position: relative;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 700;
  font-size: clamp(38px,calc(64.5888vw / 10),64.5888px);
  letter-spacing: 0.1rem;
  color: #003770;
}

.common-title span {
  display: inline-block;
  position: relative;
  font-family: "Zen Old Mincho", sans-serif;
  font-weight: 500;
  font-size: clamp(16px,calc(30vw / 10),30px);
}

.common-title span::before {
  display: inline-block;
  content: "/";
  font-weight: 300;
  font-size: clamp(38px,calc(64.5888vw / 10),64.5888px);
  letter-spacing: 0.1rem;
  margin-left: 0.5rem;
  transform: translate(0,5px) scale(.3,1) skew(-60deg);
}

.introduction {
  position: relative;
}

.greeting .container {
  position: relative;
  padding-top: clamp(35px,calc(65vw / 10),65px);
}

.gumi-deco::before ,.gumi-deco-move {
  z-index: 1;
  content: "";
  position: absolute;
  width: 100px;
  height: 100px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  pointer-events: none;
}

.greeting .container::before {
  top: -24px;
  right: 20px;
  width: clamp(92.0043px,calc(255.5675vw / 10),255.5675px);
  height: clamp(84.4163px,calc(234.4898vw / 10),234.4898px);
  background-image: url("/q10kajitsu-gumi/gumisavesjapan/assets/img/greetings_docogumi1.png");
}

.gumi-deco-move {
  display: block;
  pointer-events: none;
  height: max-content;
}
.gumi-deco-move--1 {
  left: clamp(25px, calc(70vw / 14), 70px);
  bottom: calc(100% + clamp(38px, calc(78vw / 14), 78px));
  width: clamp(62.25px, calc(138.3332vw / 10), 138.3332px);
  transform: translateY(100%);
}
.gumi-deco-move--2 {
  z-index: 1;
  right: clamp(54px,calc(114vw / 14),114px);
  bottom: calc(100% + min(calc(70vw / 14),70px));
  width: clamp(58.9112px,calc(163.6422vw / 10),163.6422px);
  transform: translateY(100%);
}
.gumi-deco-move--3 {
  right: 0;
  bottom: calc(100% + min(calc(157vw / 14),157px));
  width: clamp(53.7296px,calc(149.249vw / 10),149.249px);
  transform: translateY(100%);
}
.gumi-deco-move--4 {
  z-index: 1;
  right: clamp(54px,calc(70vw / 10),70px);
  bottom: calc(100% + min(calc(50vw / 10),50px));
  width: clamp(64.8715px,calc(177.9738vw / 10),177.9738px);
  transform: translateY(60%);
}
.gumi-deco-move--5 {
  right: min(calc(20vw / 10),20px);
  bottom: calc(100% + clamp(120px,calc(160vw / 14),160px));
  width: clamp(56.3046px,calc(143.785vw / 10),143.785px);
  transform: translateY(50%);
}
@media screen and (max-width: 767px) {
  .gumi-deco-move--2 {
    transform: translateY(150%);
    bottom: calc(100% + 40px);
  }
  .gumi-deco-move--3 {
    right: 20px;
    bottom: calc(100% + 60px);
    transform: translateY(150%);
  }
  .gumi-deco-move--4 {
    transform: translateY(150%);
    bottom: calc(100% + 100px);
  }
  .gumi-deco-move--5 {
    right: 20px;
    bottom: calc(100% + 120px);
    transform: translateY(150%);
  }
}

.officer-gumi-deco-move-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.container-w1400 {
  max-width: 1400px;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  position: relative;
}

.greeting-list-img {
  pointer-events: none;
}

.introduction-text {
  position: absolute;
  top: 12%;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 100%;
  pointer-events: none;
  text-align: center;
}

.introduction-text-wrapper {
  display: inline-block;
  position: relative;
  text-align: center;
  pointer-events: all;
}
@media screen and (max-width: 767px) {
  .introduction-text-wrapper {
    padding-left: .25rem;
  }
}

.introduction-text-wrapper::before ,.introduction-text-wrapper::after  {
  content: "";
  z-index: 1;
  position: absolute;
  right: 100%;
  top: 10%;
  width: calc(195vw / 14);
  height: calc(179vw / 14);
  background-image: url("/q10kajitsu-gumi/gumisavesjapan/assets/img/introduction_docogumi1.png");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  pointer-events: none;
}
.introduction-text-wrapper::after  {
  right: auto;
  left: 100%;
  top: auto;
  bottom: 0;
  width: calc(108vw / 14);
  height: calc(108vw / 14);
  background-image: url("/q10kajitsu-gumi/gumisavesjapan/assets/img/introduction_docogumi2.png");
}
@media screen and (max-width: 767px) {
  .introduction-text-wrapper::before {
    width: calc(80.1787vw / 3.76);
    height: calc(75.2579vw / 3.76);
    top: 0;
    transform: translate(50% , -50%);
  }
  .introduction-text-wrapper::after  {
    width: calc(43.74vw / 3.76);
    height: calc(43.74vw / 3.76);
    transform: translate(-60% , 100%);
  }
}

.introduction-text-title * {
  color: #003770;
}

.introduction-text-title h2 {
  font-size: calc(41vw / 14);
  color: #003770;
  font-weight: 600;
  line-height: calc(38 / 25);
  padding: 0 0.5rem 0 1.4rem;
}
@media screen and (max-width: 767px) {
  .introduction-text-title h2 {
    font-size: calc(23vw / 3.76);
  }
}

.introduction-text-title p {
  font-size: calc(20vw / 14);
  padding-right: calc(8vw / 14);
}
@media screen and (max-width: 767px) {
.introduction-text-title p {
    font-size: calc(12vw / 3.76);
    padding-right: calc(4vw / 3.76);
}
}

.introduction-text-description {
  padding-top: calc(30vw / 14);
}
@media screen and (max-width: 767px) {
.introduction-text-description {
  padding-top: calc(20vw / 3.76);
}
}

.introduction-text-description p {
  font-size: calc(22vw / 14);
  font-weight: 600;
  line-height: 2;
  padding: 0 0.5rem 0 1.2rem;
}
/* @media screen and (min-width: 768px) {
  .introduction-text-description p {
    padding: 0 .5rem;
  }
} */
@media screen and (max-width: 767px) {
  .introduction-text-description p {
      font-size: calc(14vw / 3.76);
  }
}


.greeting-wrapper {
  max-width: 1400px;
  width: 100%;
  margin: 0 auto;
  padding: clamp(30px,calc(60vw / 10),60px) 0 clamp(55px,calc(90vw / 10),90px);
  grid-template-columns: 1fr;
  gap: clamp(35px,calc(70vw / 10),70px); 
}

.greeting-list {
  grid-template-columns: 50% 50%;
  margin: 0 auto;
  gap: 0;
  place-items: flex-start;
  align-items: center;
}

.greeting-list--right {
  max-width: 1000px;
}

.greeting-list--right .greeting-list-img {
  max-width: clamp(293px,calc(450vw / 10),450px);   
  margin-left: auto;
}

.greeting-list-text p {
  font-size: clamp(14px,calc(21vw / 10),21px);
  font-weight: 500;
  line-height: calc(41 / 21);
}
.greeting-list-text p b {
  font-size: clamp(21px,calc(30vw / 10),30px);
}

@media screen and (min-width: 768px) {
  /* .greeting-list-img {
    padding: 0 clamp(35px,calc(65vw / 10),65px);
  } */
  .greeting-list--left .greeting-list-img {
    padding-left: 0;
    padding-right: clamp(35px,calc(65vw / 10),65px);
  }
  .greeting-list--right {
    place-items: flex-start;
  }
  .greeting-list--right .greeting-list-text {
     grid-area: 1 / 1 / 2 / 2;
     margin-left: auto;
  }
  .greeting-list--right .greeting-list-img {
     grid-area: 1 / 2 / 2 / 3;
      /* margin: 0 auto;  */
      padding-left: clamp(35px,calc(65vw / 10),65px);
  }
}

@media screen and (max-width: 767px) {
  .greeting-list {
    grid-template-columns: 1fr;
    gap: 35px;
  }
  .greeting-list-text {
    padding: 0 20px;
  }
  .greeting-list--left .greeting-list-img {
    max-width: max(293px,calc(293vw / 3.76));
  }
}

.BlueBack {
    background-image: linear-gradient(40deg,#D1E2EC,#F5F9FA);
}

.NavyBack {
  background-image: linear-gradient(21.8deg,#042A57,#21639B);
}

.NavyBack * {
  color: #fff;
}

.movie .container {
  position: relative;
  padding-top: clamp(45px,calc(85vw / 10),85px);
  padding-bottom: clamp(50px,calc(110vw / 10),110px);
}

.movie-list {
  gap: 45px 50px;
  grid-template-columns: 1fr 1fr;
  padding-top: clamp(45px,calc(60vw / 10),60px);
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
.movie-list {
  max-width: 400px;
  grid-template-columns: 1fr;
}
}

.movie-list-item {
  grid-template-columns: 1fr;
  gap: 5px;
}

.movie-list-item a {
  transition: .3s;
}

.movie-list-item a:hover {
  transform: scale(.98);
}

.movie-list-img {
  width: 100%;
  position: relative;
}

.movie-list-img::after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  transform: translate(-50%,-50%);
  width:calc(97% / 4.779341);
  height:calc(64% / 2.62);
  /* background-image: url('/q10kajitsu-gumi/gumisavesjapan/assets/img/movie_play.svg'); */
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  transition: .3s;
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 97 64"><polygon fill="%23ffffff" points="37.76 48.02 37.76 15.11 64.63 31.9 37.76 48.02"/></svg>'),linear-gradient(22deg,#042A57,#21639B);
  border-radius: 5px;
}
.movie-list-img--comingsoon::after {
  content: none;
}
.movie-list-img:hover::after {
  transform: translate(-50%,-50%) scale(0.9);
}

.movie-list-item p {
  color: #003770;
  font-size: clamp(15px,calc(27vw / 10),27px);
  font-weight: 500;
}

.officer {
  position: relative;
}

.officer-top {
  position: relative;
}

.officer-top .container {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translate(-50%,0);
  padding-top: min(calc(70vw / 10),70px);
}
@media screen and (min-width: 768px) {
  .officer-top .container {
    padding-top: 35px;
  }
}

.officer .gumi-deco::before {
  top: 0;
  right: 20px;
  width: clamp(100.8225px,calc(248.9445vw / 14),248.9445px);
  height: clamp(91.6685px,calc(226.3421vw / 14),226.3421px);
  background-image: url("/q10kajitsu-gumi/gumisavesjapan/assets/img/officer_docogumi1.png");
  transform: translate(min(calc(90vw / 14),90px) , -25%);
}
@media screen and (max-width: 1000px) {
.officer .gumi-deco::before {
    transform: translate(0 , -43%);
    right: 30px;
  }
}

.officer-list {
  grid-template-columns:1fr;
  padding: clamp(55px,calc(85vw / 10),85px) 0 clamp(45px,calc(140vw / 10),140px);
  gap: 60px;
  max-width: 875px;
  margin: 0 auto;
}
@media screen and (min-width: 768px) {
  .officer-list {
    padding-left: 20px;
    padding-right: 20px;
  }
}

.officer-list li.Grid {
  position: relative;
  grid-template-columns:clamp(120px,calc(182.5vw / 10),182.5px) 1fr;
  gap: clamp(20px,calc(25vw / 10),25px) clamp(25px,calc(60vw / 10),60px);
  align-items: flex-start;
}
@media screen and (max-width: 767px) {
.officer-list li.Grid {
  align-items: center;
  gap: 20px 25px;
}
}

.officer-list li.Grid:not(:last-of-type):after {
  content: "";
  width: 100%;
  height: 1px;
  background-color: rgba(35, 24, 21, .5);
  top: calc(100% + 28px);
  left: 0;
  display: block;
  position: absolute;
  pointer-events: none;
}

.officer-list-name {
  place-items: flex-start;
  justify-content: flex-start;
  margin-right: auto;
  gap: 2px;
}

.officer-list-name-title {
  font-size: clamp(14px,calc(21vw / 10),21px);
  font-weight: 500;
  line-height: calc(19 / 14);
}

h3.officer-list-name-person {
  font-size: clamp(21px,calc(38vw / 10),38px);
  font-weight: 500;
  line-height: 1.25;
  padding: 0 ;
  margin: 0;
  color: #003770;
}

.officer-list-text {
  font-size: clamp(14px,calc(20vw / 10),20px);
  font-weight: 500;
  line-height: calc(33 / 20)
}

@media screen and (min-width: 768px) {
  .officer-list-img {
     grid-area: 1 / 1 / 3 / 2;
  }
}

.officer-list-text {
  margin-bottom: auto;
}

@media screen and (max-width: 767px) {
  .officer-list-text {
    grid-area: 2 / 1 / 3 / 3;
  }
}

.news {
  padding: clamp(45px ,calc(70vw / 10), 70px) 0 clamp(50px,calc(70vw / 10),70px);
}

.news-list.gumi-deco::before {
  top: 100%;
  right: clamp(920px,calc(940vw / 10),980px);
  width: min(calc(208vw / 14),208px);
  height: min(calc(192.8333vw / 14),192.8333px);
  background-image: url("/q10kajitsu-gumi/gumisavesjapan/assets/img/news_docogumi1.png");
  transform: translate(0 , -50%);
}
@media screen and (max-width: 767px) {
  .news-list.gumi-deco::before {
    content: none;
  }
}

.news-list {
  grid-template-columns: 1fr;
  gap: clamp(40px,calc(53vw / 10),53px);
  place-items: flex-start;
  align-items: center;
  max-width: 764px;
  margin: 0 auto;
  padding-top: clamp(40px,calc(60vw / 10),60px);
}

.news-list li {
  position: relative;
  width: 100%;
}

.news-list li:not(:last-of-type)::after {
  content: "";
  width: 100%;
  height: 1px;
  border-top: 1px dashed #fff;
  top: calc(100% + clamp(20px,calc(26.5vw / 10),26.5px));
  left:0;
  position: absolute;
  display: block;
}

.news-list .news-list-item {
  width: 100%;
  display: grid;
  grid-template-columns: clamp(75px,calc(115vw / 10),115px) 1fr;
  gap: clamp(20px,calc(60vw / 10),60px);
  grid-auto-rows: auto;
}

.news-list-item:hover * {
  transition: .3s;
}

.news-list-item:hover * {
  color: rgba(255, 255, 255, .9);
}

.news-list-date {
  font-size: clamp(14px,calc(21vw / 10),21px);
  font-weight: 500;
  line-height: calc( 16.8 / 14);
}

.news-list-text {
  font-size: clamp(15px,calc(23vw / 10),23px);
  font-weight: 500;
  line-height: calc( 16.8 / 14);
  text-decoration: underline; 
  text-underline-offset: 1px;
}
.news-list-item:hover .news-list-text {
  text-underline-offset: 2px;
}

.our-gumi {
  position: relative;
  background-image: linear-gradient(-40deg ,#FCE8DC,#FFFDEA 60%,#FBE0D9);
}

.parallax-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.parallax-wrapper-2{
  position: relative;
  width: 100%;
  height: 100%;
  overflow: clip;
}

.bg-our-gumi-parallax {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(500vh + 500%);
  transform: translateY(calc(-200vh - 25%));
  background-image: url("/q10kajitsu-gumi/gumisavesjapan/assets/img/bg_gumimamire.png");
  background-size: 1014px;
}
@media screen and (max-width: 767px) {
.bg-our-gumi-parallax {
  background-size: 500px;
}
}

.our-gumi * {
  font-family: "Zen Kaku Gothic New", sans-serif;
}

.our-gumi .container {
  padding-top: clamp(45px,calc(95vw / 10),95px);
  padding-bottom: clamp(30px,calc(80vw / 10),80px);
}

.our-gumi .container {
  padding-top: clamp(45px,calc(95vw / 10),95px);
  padding-bottom: clamp(30px,calc(80vw / 10),80px);
}

.gumi-container {
  position: relative;
  background-color: #fff;
  padding: clamp(35px,calc(80vw / 10),80px) clamp(25px,calc(80vw / 10),80px) clamp(30px,calc(80vw / 10),80px);
  margin-top: clamp(30px,calc(65vw / 10),65px);
  border-radius: 15.3361px;
}

.gumi-title {
  position: relative;
  max-width: 510px;
  margin: clamp(20px,calc(30vw / 10),30px) auto clamp(40px,calc(60vw / 10),60px);
  padding-top: 10px;
}

.gumi-title-1 {
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  width: clamp(119.875px,calc(200% / 5.1),195px);
}

.gumi-products {
  grid-template-columns: 1fr 1fr 1fr;
  gap: 15px 25px;
  justify-content: center;
  text-align: center;
  margin-bottom: clamp(25px,calc(55vw / 10),55px);
  max-width: 625px;
  margin: 0 auto clamp(20px,calc(45vw / 10),45px);
}
@media screen and (max-width: 767px) {
  .gumi-products {
    gap: 30px;
    grid-template-columns: auto auto;
  }
  .gumi-products-item {
    max-width: 117px;
  }
  .gumi-products-item:first-of-type {
    grid-area: 1 / 1 / 2 / 3;
  }
}

.gumi-products-item {
  position: relative;
  padding-bottom: clamp(20px,calc(30vw / 10),30px);
}

.gumi-products-item p {
  white-space: nowrap;
}

.gumi-products-item span {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  display: block;
  height: clamp(12.5px,calc(17vw / 10),17px);
  margin: 0 auto;
  text-align: center;
}

.gumi-products-item span img {
  height: 100%;
  width: auto;
}

.gumi-text {
  font-size: clamp(12px,calc(15vw / 10),15px);
  font-weight: 400;
  line-height: calc(26 / 15);
}

.gumi-gray-box {
  border-radius: 5px;
  border: 1px solid #000;
  padding: clamp(10px,calc(17vw / 10),17px);
  margin-bottom: 27px;
}

@media screen and (min-width: 768px) {
  .functional-claims {
    grid-template-columns: 81px 1fr;
  }
}

.functional-claims-text-1 {
  text-align: center;
  background-color: #DEDFDF;
  border-radius: 3px;
  width: 100%;
}
@media screen and (min-width: 768px) {
  .functional-claims-text-1 {
    aspect-ratio: 1;
    height: auto;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
  }
  .functional-claims-text-2 {
    margin-right:auto;
  }
}

.gumi-q10 {
  position: relative;
  padding-top: 60px;
}

@media screen and (min-width: 768px) {
  .gumi-q10-title {
    position: absolute;
    right: 100%;
    top: 0;
    transform: translate(100%,150%);
  }
}
@media screen and (max-width: 767px) {
  .gumi-q10-title {
    width: 100%;
  }
}

.gumi-q10-title h4 {
  z-index: 1;
  position: relative;
  color: #fff;
  font-size: 18.0518px;
  font-weight: 500;
  line-height: 27.0777 / 18.0518;
  text-align: center;
  background-color: #EB686F;
}
@media screen and (min-width: 768px) {
  .gumi-q10-title h4 {
    max-width: 120px;
    display: flex;
    flex-direction: column;
    white-space: nowrap;
  }
}
@media screen and (max-width: 767px) {
  .gumi-q10-title h4 {
    width: 100%;
    clip-path: polygon(calc(100% - 9px) 0, 100% 50%, calc(100% - 9px) 100%, 9px 100%, 0 50%, 9px 0);
    height: 100%;
    padding: 5px;
  }
}

.gumi-q10-title h4::before {
  z-index: -1;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  background-color: #EB686F;
  width: 100%;
}
@media screen and (min-width: 768px) {
  .gumi-q10-title h4::before {
    top: 50%;
    left: 50%;
    transform: translate(-50% , -50%) rotate(45deg);
    border-radius: 5px;
    width: 136px;
    height: 136px;
  }
}

.gumi-q10-green {
  background-image: linear-gradient(to right,#DEEBB8,#FAD9D2 62%,#E6F0C9);
  padding: 5px 25px;
  border-radius: 20px;
  margin-bottom: 10px;
}

.gumi-q10-text1 {
  font-size: clamp(15px,calc(23.4579vw / 10),23.4579px);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 5px;
  line-height: 1.25;
}

.gumi-q10-text2 {
  font-size: clamp(17px,calc(26.0995vw / 10),26.0995px);
  font-weight: 700;
  line-height: 1.25;
  font-feature-settings: "palt" 1, "trad" 1;
  text-align: center;
}

.gumi-q10-img {
  max-width: 490px;
  margin: 25px auto 50px;
}

.gumi-q10-point {
  grid-template-columns: 100%;
  margin-bottom: clamp(17px,calc(40vw / 10),40px);
  gap: 35px 20px;
}
@media screen and (min-width: 768px) {
  .gumi-q10-point {
    grid-template-columns: 1fr 1fr;
  }
}

.gumi-q10-point li {
  width: 100%;
  height: 100%;
  position: relative;
  border: 1px solid #000;
  border-radius: 5px;
  padding: clamp(20px,calc(45vw / 10),45px) 0 clamp(20px,calc(35vw / 10),35px);
}

.gumi-q10-point li p {
  text-align: center;
  font-size: clamp(16px,calc(23.4579vw / 10),23.4579px);
  font-weight: 700;
  line-height: 1.2;
}

.gumi-q10-point-item1 {
  background-image: linear-gradient(45deg,#FBDFDC,#FFFDEA);
}

.gumi-q10-point-item1::before ,.gumi-q10-point-item2::before ,.gumi-q10-point-item1::after ,.gumi-q10-point-item2::after {
  z-index: 1;
  content: "";
  display: grid;
  place-items: center;
  position: absolute;
  left: 50%;
  top: 0;
  transform: translate(-50% , -50%);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
.gumi-q10-point-item1::before ,.gumi-q10-point-item2::before {
  width: clamp(80px,calc(115vw / 10),115px);
  height: clamp(70px,calc(100vw / 10),100px);
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 115 100"><path fill="%23ffffff" d="M30.18,23.46c-6.82,1.48-8.02,2.68-9.5,9.5-1.48-6.82-2.68-8.02-9.5-9.5,6.82-1.48,8.02-2.68,9.5-9.5,1.48,6.82,2.68,8.02,9.5,9.5Z"/><path fill="%23231815" d="M20.68,34.14l-.24-1.13c-1.46-6.72-2.59-7.85-9.31-9.31l-1.13-.24,1.13-.24c6.72-1.46,7.85-2.59,9.31-9.31l.24-1.13,.24,1.13c1.46,6.72,2.59,7.85,9.31,9.31l1.13,.24-1.13,.24c-6.72,1.46-7.85,2.59-9.31,9.31l-.24,1.13Zm-8.36-10.68c5.63,1.33,7.03,2.73,8.36,8.37,1.33-5.63,2.73-7.03,8.36-8.37-5.63-1.33-7.03-2.73-8.36-8.37-1.33,5.63-2.73,7.03-8.36,8.37Z"/><path fill="%23ffffff" d="M107.18,44.46c-6.82,1.48-8.02,2.68-9.5,9.5-1.48-6.82-2.68-8.02-9.5-9.5,6.82-1.48,8.02-2.68,9.5-9.5,1.48,6.82,2.68,8.02,9.5,9.5Z"/><path fill="%23231815" d="M97.68,55.14l-.24-1.13c-1.46-6.72-2.59-7.85-9.31-9.31l-1.13-.24,1.13-.24c6.72-1.46,7.85-2.59,9.31-9.31l.24-1.13,.24,1.13c1.46,6.72,2.59,7.85,9.31,9.31l1.13,.24-1.13,.24c-6.72,1.46-7.85,2.59-9.31,9.31l-.24,1.13Zm-8.36-10.68c5.63,1.33,7.03,2.73,8.36,8.37,1.33-5.63,2.73-7.03,8.36-8.37-5.63-1.33-7.03-2.73-8.36-8.37-1.33,5.63-2.73,7.03-8.36,8.37Z"/><path fill="%23ffffff" d="M35.18,72.46c-6.82,1.48-8.02,2.68-9.5,9.5-1.48-6.82-2.68-8.02-9.5-9.5,6.82-1.48,8.02-2.68,9.5-9.5,1.48,6.82,2.68,8.02,9.5,9.5Z"/><path fill="%23231815" d="M25.68,83.14l-.24-1.13c-1.46-6.72-2.59-7.85-9.31-9.31l-1.13-.24,1.13-.24c6.72-1.46,7.85-2.59,9.31-9.31l.24-1.13,.24,1.13c1.46,6.72,2.59,7.85,9.31,9.31l1.13,.24-1.13,.24c-6.72,1.46-7.85,2.59-9.31,9.31l-.24,1.13Zm-8.36-10.68c5.63,1.33,7.03,2.73,8.36,8.37,1.33-5.63,2.73-7.03,8.36-8.37-5.63-1.33-7.03-2.73-8.36-8.37-1.33,5.63-2.73,7.03-8.36,8.37Z"/></svg>');
}
.gumi-q10-point-item2::before {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 115 100"><path fill="%23231815" d="M6.28,47.85l16.63-6.59,2.44,14.96c.5,3.07-1.78,5.43-4.58,5.89-1.36,.22-2.86-.29-3.1-1.73-.34-2.09,2.02-4.51,4.44-4.9,.68-.11,1.44-.08,1.92,.08l-1.55-9.53-14.36,5.67,1.78,10.92c.5,3.07-1.78,5.43-4.58,5.89-1.36,.22-2.86-.29-3.1-1.73-.34-2.09,2.02-4.51,4.44-4.9,.68-.11,1.44-.08,1.92,.08l-2.3-14.1Z"/><path fill="%23231815" d="M100,13.49v4.71l-6.32-3.44v12.58c0,2.91-2.46,4.76-5.13,4.76-1.29,0-2.6-.7-2.6-2.07,0-1.99,2.55-3.86,4.85-3.86,.64,0,1.34,.14,1.76,.36V9.96h.7l6.74,3.53Z"/><path fill="%23231815" d="M110.79,51.31l-.52,4.68-5.9-4.12-1.39,12.5c-.32,2.89-2.98,4.46-5.62,4.17-1.28-.14-2.51-.98-2.36-2.35,.22-1.98,2.96-3.56,5.24-3.31,.64,.07,1.32,.29,1.71,.56l1.83-16.46,.7,.08,6.3,4.25Z"/></svg>');
}

.gumi-q10-point-item1::after ,.gumi-q10-point-item2::after {
  width: clamp(37.6069px,calc(55.0146vw / 10),55.0146px);
  height: clamp(32.5684px,calc(47.6445vw / 10),47.6445px);
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 55.02 47.64"><path fill="%23231815" d="M24.63,16.59c-.49,0-.67-.11-.67-.38,0-.05,.03-.22,.05-.41l.05-.19c.13-.57,.19-.59,.76-.59h2.32c.62,0,.7,.08,.7,.7v16.6c0,.62-.08,.7-.7,.7h-.27c-.62,0-.7-.08-.7-.7v-15.74h-1.54Z"/></svg>'),
  url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 37.61 32.57"><polygon fill="%23ffffff" points="28.04 .28 9.56 .28 .32 16.28 9.56 32.29 28.04 32.29 37.28 16.28 28.04 .28"/><path fill="%23231815" d="M28.21,32.57H9.4L0,16.28l.08-.14L9.4,0H28.21l9.4,16.28-.08,.14-9.32,16.14Zm-18.48-.56H27.88l9.08-15.72L27.88,.56H9.73L.65,16.28l9.08,15.72Z"/><polygon fill="%23ffffff" points="10.74 30.25 2.68 16.28 10.74 2.32 26.87 2.32 34.93 16.28 26.87 30.25 10.74 30.25"/><path fill="%23231815" d="M27.03,30.53H10.58L2.35,16.28l.08-.14L10.58,2.04H27.03l8.22,14.24-.08,.14-8.14,14.11Zm-16.13-.56h15.8l7.9-13.68L26.7,2.6H10.9L3,16.28l7.9,13.68Z"/></svg>');
}
.gumi-q10-point-item2::after {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 55.02 47.64"><path fill="%23231815" d="M29.47,31.44c.62,0,.7,.08,.7,.7v.19c0,.62-.08,.7-.7,.7h-5.72c-.49,0-.7-.11-.7-.38,0-.08,.05-.24,.16-.46l3.29-6.8c1.75-3.59,2.19-4.94,2.19-6.56s-.7-2.51-1.92-2.51c-1.38,0-2.08,1.05-2.08,3.16,0,.38-.16,.46-.67,.46h-.24c-.57,0-.7-.11-.7-.49,0-3,1.29-4.67,3.64-4.67s3.67,1.57,3.67,4.02c0,2.02-.43,3.29-2.38,7.18l-2.75,5.45h4.21Z"/>></svg>'),
  url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 37.61 32.57"><polygon fill="%23ffffff" points="28.04 .28 9.56 .28 .32 16.28 9.56 32.29 28.04 32.29 37.28 16.28 28.04 .28"/><path fill="%23231815" d="M28.21,32.57H9.4L0,16.28l.08-.14L9.4,0H28.21l9.4,16.28-.08,.14-9.32,16.14Zm-18.48-.56H27.88l9.08-15.72L27.88,.56H9.73L.65,16.28l9.08,15.72Z"/><polygon fill="%23ffffff" points="10.74 30.25 2.68 16.28 10.74 2.32 26.87 2.32 34.93 16.28 26.87 30.25 10.74 30.25"/><path fill="%23231815" d="M27.03,30.53H10.58L2.35,16.28l.08-.14L10.58,2.04H27.03l8.22,14.24-.08,.14-8.14,14.11Zm-16.13-.56h15.8l7.9-13.68L26.7,2.6H10.9L3,16.28l7.9,13.68Z"/></svg>');
}

.gumi-q10-point-item2 {
  background-image: linear-gradient(45deg,#FFFDEA,#D8EACA 91%);
}

.gumi-q10-note {
  text-align: justify;
  font-size: clamp(13px,calc(19.2846vw / 10),19.2846px);
  font-weight: 700;
  line-height: calc(20 / 13);
  margin-bottom: clamp(30px,calc(100vw / 14),100px);
}
@media screen and (min-width: 768px) {
  .gumi-q10-note {
    text-align: center;
  }
}

.gumi-q10-info {
  grid-template-columns: 100%;
  margin-bottom: clamp(30px,calc(55vw / 10),55px);
  gap: 20px;
}
@media screen and (min-width: 768px) {
  .gumi-q10-info {
    grid-template-columns: 1fr 1fr;
  }
}

.gumi-q10-info-item {
  height: 100%;
  border: 1px solid #231815;
  border-radius: 5px;
  padding: 25px clamp(5px,calc(10vw / 10),10px);
  color: #000;
  transition: .3s;
  text-align: center;
}
.gumi-q10-info-item:hover {
  transform: scale(.98);
}

.gumi-q10-info-img {
  display: flex;
  align-items: center;
}

.gumi-q10-info-item--1 p {
  font-size: clamp(17px,calc(24vw / 10),24px);
  color: #EB686F;
  font-weight: 500;
}

.gumi-q10-info-img1 ,.gumi-q10-info-img2 ,.gumi-q10-info-img3 {
  max-width: 96.923px;
}

.gumi-q10-info-item--1:hover .gumi-q10-info-img1 {
  animation: motimoti2 1.1s linear 0s 1;
}
.gumi-q10-info-item--1:hover .gumi-q10-info-img2 {
  animation: motimoti2 0.7s linear .12s 1;
}
.gumi-q10-info-item--1:hover .gumi-q10-info-img3 {
  animation: motimoti2 0.9s linear .26s 1;
}

@keyframes motimoti2 {
  0%   { transform: scale(1.0, 1.0) translate(0%, 0); }
  15%  { transform: scale(0.9, 0.9) translate(0%, 0); }
  30%  { transform: scale(1.03, 0.95) translate(0%, 0); }
  50%  { transform: scale(0.95, 1.0) translate(0%, 0); }
  70%  { transform: scale(1.03, 0.98) translate(0%, 0); }
  100% { transform: scale(1.0, 1.0) translate(0%, 0); }
}


.gumi-q10-info-item--1 {
  transition: .3s;
  background-image: linear-gradient(45deg,#FDEDE4,#FFFDEA 63%,#FDEDE4);
}

.gumi-q10-info-item--2 {
  font-size: clamp(17px,calc(24vw / 10),24px);
  font-weight: 500;
  line-height: calc(34.077 / 24);
}

.gumi-q10-info-item-xicon {
  display: block;
  transition: .3s;
  width: clamp(35.7835px,calc(52.638vw / 10),52.638px);
  height: clamp(36.5698px,calc(52.638vw / 10),53.7947px);
}

.gumi-q10-info-item--2:hover .gumi-q10-info-item-xicon {
  transform: scale(0.95);
}

.gumi-shop-title {
  border-bottom: 1px solid #000;
  padding-bottom: clamp(5px,calc(15vw / 10),15px);
  margin-bottom: clamp(15px,calc(25vw / 10),25px);
  text-align: center;
  font-size: clamp(14px,calc(24vw / 10),24px);
  font-weight: 500;
}

.gumi-shop-list {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  column-gap: 85px;
  row-gap: 20px;
}

.gumi-shop-list-item {
  transition: .3s;
  min-width: 140px;
}

.gumi-shop-list-item:hover {
  transform: scale(.98);
}

.gumi-shop-list-item--1 {
  width: calc(173.4271% / 8.4);
  max-width: clamp(143.0773px,calc(173.4271vw / 10),173.4271px);
}
.gumi-shop-list-item--2 {
  width: calc(242.2586% / 8.4);
  min-width: 170px;
  max-width: clamp(199.8633px,calc(242.2586vw / 10),242.2586px);
}
.gumi-shop-list-item--3 {
  width: calc(184.7388% / 8.4);
  max-width: clamp(152.4095px,calc(184.7388vw / 10),184.7388px);
}

.sns {
  text-align: center;
  padding: clamp(35px,calc(80vw / 10),80px) 0 15px;
}

/* .sns .container {
  padding-left: 60px;
  padding-right: 60px;
  max-width: 1120px;
}
@media screen and (max-width: 767px) {
.sns .container {
  padding-left: 44px;
  padding-right: 44px;
}
} */

.sns-share {
  display: inline-block;
  margin: 0 auto;
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 110.4 9.92"><polygon fill="%23231815" points="48.1 9.92 48.1 1 0 1 0 0 49.1 0 49.1 7.88 59.23 0 110.4 0 110.4 1 59.57 1 48.1 9.92"/></svg>');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: bottom center;
  padding-bottom: clamp(15px,calc(25vw / 10),25px);
}

.sns-share p {
  font-size: clamp(17px,calc(28vw / 10),28px);
  font-weight: 700;
  line-height: 1.25;
  font-family: "Zen Kaku Gothic New", sans-serif;
}

.sns-list {
  margin: 35px auto 45px;
  grid-template-columns: repeat(3,clamp(41px,calc(70vw / 10),70px));
  gap: clamp(15px,calc(20vw / 10),20px);
}

.sns-list a {
  display: block;
  max-width: clamp(41px,calc(58vw / 10),58px);
  max-height: clamp(41px,calc(58vw / 10),58px);
  width: 100%;
  transition: .3s;
}

.sns-list a:hover {
  transform: scale(1.1);
  opacity: .9;
}

.sns-list img {
  height: 100%;
}

.sns-list svg {
  height: 100%;
  max-height: clamp(41px,calc(68vw / 10),68px);
}


.sns-x-icon {
  fill: #231815;
}

#svg-icon-line .cls-1 {
  fill: #fff;
}
#svg-icon-line .cls-2 {
  fill: #00a75b;
}

#svg-icon-facebook .cls-1 {
  fill: #fff;
}

#svg-icon-facebook .cls-2 {
  fill: #2c62ae;
}

.footer-note {
  text-align: right;
  font-size: clamp(11px,calc(13vw / 10),13px);
  font-weight: 500;
  font-family: "Zen Kaku Gothic New", sans-serif;
}

.footer{ 
  background-color: #015696;
  text-align: right;
  padding: clamp(15px,calc(22vw / 10),22px) 0;
}

.copyright {
  font-size: clamp(10px,calc(15vw / 10),15px);
  color: #fff;
  font-family: "Zen Kaku Gothic New", sans-serif;
}
