@charset "utf-8";
/* CSS Document */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
html {
  font-size: 62.5%;
}
body {
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  line-height: 1.5;
  color: #2F2F3A;
  max-width: 100%;
  font-size: 1.6rem;
  background-color: #F5F6F8;
}
#wrapper {
  max-width: 402px;
  height: auto;
  margin: 0 auto;
}
#top #header {
  background-color: #FFE8B6;
  margin-bottom: 0;
}
.inner {
  width: 89.84%;
  display: flex;
  justify-content: space-between;
  margin: 0 auto;
}
a {
  text-decoration: none;
  color: #2F2F3A;
}
a:hover {
  color: #A7B7FF;
  cursor: pointer;
}
a img {
  transition: .3s ease-in-out;
}
a img:hover {
  opacity: 1;
  filter: saturate(210%);
  cursor: pointer;
}
a img:active {
  opacity: 1;
  filter: saturate(210%);
  cursor: pointer;
}
a:active {
  color: #FFE8B6;
}
h1 {
  font-size: 6.4rem;
}
h2 {
  font-size: 4.8rem;
}
h3 {
  font-size: 3.8rem;
}
h4 {
  font-size: 2.8rem;
}
p {
  font-size: 1.8rem;
}
#g_nav ul li {
  list-style: none;
}
/*ハンバーガー*/
.hamburger {
  width: 60px;
  height: 60px;
  position: relative;
  border: none;
  background: transparent;
  background-color: #A7B7FF;
  aspect-ratio: 1 / 1; /* 比率を固定 */
  cursor: pointer;
}
.hamburger span {
  display: block;
  width: 60%;
  height: 3px;
  background: #ffffff;
  position: absolute;
  left: 20%;
  transition: 0.3s;
}
/* 上 */
.hamburger span:nth-child(1) {
  top: 20%;
}
/* 真ん中 */
.hamburger span:nth-child(2) {
  top: 50%;
  transform: translateY(-50%);
}
/* 下 */
.hamburger span:nth-child(3) {
  bottom: 20%;
}
.hamburger.active span:nth-child(1) {
  transform: rotate(45deg);
  top: 50%;
}
.hamburger.active span:nth-child(2) {
  opacity: 0;
}
.hamburger.active span:nth-child(3) {
  transform: rotate(-45deg);
  bottom: auto;
  top: 50%;
}
/* 初期状態は隠す */
.nav-menu {
  position: fixed;
  z-index: 99;
  top: 0;
  right: -100%;
  width: 70%;
  height: 100vh;
  background: #FDFEFF;
  transition: 0.3s;
}
/* 開いたとき */
/*---*/
.nav-menu.active {
  right: 0;
  padding-left: 20px;
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 500;
  font-style: normal;
  font-size: 3.6rem;
  border-bottom: 2px solid #8C815E;
}
/*hero*/
.hero_text {
  height: 806px;
  background-color: #FFE8B6;
}
.hero_text h1 {
  width: 71.64%;
  margin: 0 auto;
  padding-top: 170px;
  padding-bottom: 180px;
  font-size: 3.6rem;
}
.hero_text p {
  color: #595959;
  font-size: 3.6rem;
  text-align: center;
}
.fixd_nemuneko_group {
  padding-top: 100px;
  background-image: url(../img/sm_hero.png);
  background-position: center top;
  background-repeat: no-repeat;
  background-size: contain;
}
.fixd_nemuneko_text {
  margin-right: 20px;
  text-align: right;
}
.fixd_nemuneko {
  width: 89.64px;
  height: 44.67px;
  position: sticky;
  z-index: 10;
  top: 80%;
  left: 90%;
}
/*リキッドグラスの設定*/
.sm_concept {
  width: 81.09%;
  height: 783px;
  margin: 130px auto;
  display: flex;
  justify-content: center; /* 水平中央 */
  align-items: center; /* 垂直中央 */
}
.sm_concept, .wire_liquid {
  position: relative;
  border-radius: 28px;
  isolation: isolate;
  box-shadow: 3px 3px 21px -16px rgba(47, 47, 58, 0.3);
}
.sm_concept::before, .wire_liquid::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: 28px;
  box-shadow: inset 6px 6px 3px -16px rgba(256, 256, 256, 0.9);
  background-color: rgba(255, 255, 255, 0);
}
.sm_concept::after, .wire_liquid::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: 28px;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  filter: url(#glass-distortion);
  -webkit-filter: url(#glass-distortion);
  isolation: isolate;
}
/*当たり判定を消す*/
.sm_concept::before, .sm_concept::after, .wire_liquid::before, .wire_liquid::after {
  pointer-events: none;
}
/*ここまで*/
.sm_concept_inner p:first-child {
  margin-bottom: 160px;
}
.wire_liquid {
  width: 81.09%;
  height: 393px;
  margin: 130px auto;
  display: flex;
  justify-content: center; /* 水平中央 */
  align-items: center; /* 垂直中央 */
}
/*.wire_col2 img{
	display: inline-block;
}*/
.wire_liquid_inner {
  text-align: center;
}
.wire_liquid_inner h2, .wire_liquid_inner p {
  font-size: 24px;
}
.wire_liquid_inner h2 {
  margin-bottom: 60px;
}
.wire_liquid_inner p {
  margin-bottom: 10px;
}
.wire_col2 {
  display: flex;
}
/*指さしsvgのcolor変更設定*/
.link_color a {
  color: #595959;
}
.link_color a:hover {
  color: #2F2F3A;
}
.link_color a:active {
  color: #A7B7FF;
}
.link_color a svg {
  fill: #fff;
}
.link_color:hover svg {
  fill: #A7B7FF;
}
.link_color:active svg {
  fill: #A7B7FF;
}
/*ここまで*/
#top_ABOUT,#top_PRODUCT,#top_PEOPLE{
    margin-top: 130px;
    margin-bottom: 130px;
}
#top_ABOUT {
  height: 374px;
  background-image: url(../img/sm_top_about_group.png);
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
}
#top_PRODUCT {
  height: 374px;
  background-image: url(../img/sm_top_products.png);
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
}
#top_PEOPLE {
  height: 374px;
  background-image: url(../img/sm_top_people.png);
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
}
#top_ABOUT .top_about_contents, #top_PEOPLE .top_people_contents {
  padding-right: 20px;
  text-align: right;
}
#top_PRODUCT .top_product_contents {
  padding-left: 20px;
}
#top_ABOUT .top_about_col2, #top_PEOPLE .top_people_col2 {
  width: fit-content;
  padding: 13.5px 23.5px;
  margin-left: auto;
  display: flex;
  background-color: #FFE8B6;
  border-radius: 50px;
}
#top_PRODUCT .top_product_col2 {
  width: fit-content;
  padding: 13.5px 23.5px;
  margin-right: auto;
  display: flex;
  background-color: #FFE8B6;
  border-radius: 50px;
}
#top_ABOUT .top_about_col2 p, #top_PRODUCT .top_product_col2 p, #top_PEOPLE .top_people_col2 p {
  font-size: 1.3rem;
}
.top_about_text h2, .top_about_text p, .top_product_text h2, .top_product_text p, .top_people_text h2, .top_people_text p, .top_recruit_text h2, .top_recruit_text p:first-child {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}
.top_about_text h2 {
  color: #29D9B9;
}
.top_product_text h2 {
  color: #F25F29;
}
.top_people_text h2 {
  color: #F25790;
}
.top_recruit_text h2 {
  color: #1D8FF2;
}
.top_about_text h3, .top_product_text h3, .top_people_text h3, .top_about_text p, .top_product_text p, .top_people_text p, .top_recruit_text h3, .top_recruit_text p {
  font-size: 2.8rem;
  color: #595959;
}
.top_about_text h3 {
  margin-bottom: 40px;
}
.top_product_text h3, .top_people_text h3 {
  margin-bottom: 80px;
}
.top_about_text p, .top_product_text p, .top_people_text p {
  padding-top: 70px;
}
.top_recruit :hover a p {
  color: #A7B7FF;
}
/*リキッドグラス設定2*/
.top_recruit_contents {
  width: 402px;
  height: 402px;
  position: relative;
  border-radius: 50%;
  isolation: isolate;
  box-shadow: 3px 3px 21px -16px rgba(47, 47, 58, 0.3);
}
.top_recruit_contents::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: 50px;
  box-shadow: inset 6px 6px 3px -16px rgba(256, 256, 256, 0.9);
  background-color: rgba(255, 255, 255, 0);
}
.top_recruit_contents::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: 50px;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  filter: url(#glass-distortion);
  -webkit-filter: url(#glass-distortion);
  isolation: isolate;
}
/*当たり判定を消す*/
.top_recruit_contents::before, .top_recruit_contents::after {
  pointer-events: none;
}
/*ここまで*/
.top_recruit_col2 {
  width: fit-content;
  padding: 13.5px 23.5px;
  margin: 0 auto;
  display: flex;
  background-color: #FFE8B6;
  border-radius: 50px;
}
.top_recruit_col2 p {
  font-size: 1.3rem;
}
.top_recruit_text h2 {
  margin-bottom: 30px;
}
.top_recruit_text h3 {
  margin-bottom: 75px;
}
.top_recruit_contents {
  display: flex;
  justify-content: center; /* 水平中央 */
  align-items: center; /* 垂直中央 */
}
.top_recruit_Container {
  padding-bottom: 130px;
}
/*---footer---*/
footer {
  background-color: #2f2f3a;
  color: #FFFFFF;
  font-size: 1.3rem;
}
footer a {
  color: #FFFFFF;
}
.footer_atc_text p {
  font-size: 1.3rem;
}
.footer_gradation {
  width: 100%;
  height: 130px;
  display: block;
  background-image: linear-gradient(#f5f6f8, #7c7ca1 54%, #2f2f3a);
}
.footer_atc_col2 {
  margin: 0 auto;
  max-width: 300px;
  display: flex;
}
.footer_atc_text {
  padding-right: 20px;
}
.recruit_entry{
	  width: fit-content;
	margin: 0 auto;
		padding-top: 130px;
	padding-bottom: 238px;
}
.recruit_entry p{
	margin-bottom: 40px;
	font-size: 1.3rem;
}
.recruit_entry_btn_Container{
	  position: relative; /* 基準にする */
  width: 100%;
}
.recruit_entry_btn{
  position: absolute;
  right: 25%; /* ボタンを中央に配置 */
	display: flex;
	align-items: center;
}
.recruit_entry_btn svg{
	  fill: #fff;
margin-right: 35px;
}
/*指さしsvgのcolor変更設定*/
.recruit_entry_btn:hover svg {
  fill: #A7B7FF;
}
.recruit_entry_btn:active svg {
  fill: #A7B7FF;
}

/*
.footer_atc_btn img,.footer_logo img {
  transition: .2s ease-in-out;

}
.footer_atc_btn:hover a img,.footer_logo:hover a img {
    opacity: 1;
     filter: saturate(210%);
}
.footer_atc_btn:active a img {
    opacity: 1;
     filter: saturate(210%);
}*/
.footer_logo {
  margin: 110px auto 50px auto;
  text-align: center;
}
.footer_nav dl {
  max-width: 150px;
  margin: 0 auto;
}
.footer_text_2col {
  display: flex;
  flex-wrap: wrap;
}
.footer_text {
  max-width: 100%;
}
.footer_nav {
  margin-bottom: 20px;
  line-height: 1.8;
}
.footer_link {
  display: flex;
  flex-wrap: wrap;
}
.footer_link dt {
  display: inline-block;
  text-align: left;
  width: 50%;
}
.footer_link dd {
  display: inline-block;
  text-align: left;
  width: 50%;
}
.footer_bottom {
  text-align: center;
}
.footer_bottom p {
  font-size: 1.3rem;
}
/*------------#about--------------*/
#about #header {
  background-color: #F5F6F8;
}
#about h1 {
  margin-top: 50px;
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
  color: #29D9B9;
}
/*リキッドグラス設定about*/
.heading_liquidglass, .about_liquidglass, .about_data_Container, .liquidglass_frame{
      width: 81.09%;
}
.heading_liquidglass, .about_liquidglass, .about_data_Container, .liquidglass_frame,.liquidglass_frame_shop {

  position: relative;
  border-radius: 28%;
  isolation: isolate;
  box-shadow: 3px 3px 21px -16px rgba(47, 47, 58, 0.3);
  margin: 20px auto;
  display: flex;
  justify-content: center; /* 水平中央 */
  align-items: center; /* 垂直中央 */
}
.heading_liquidglass {
  height: 379px;
}
.heading_liquidglass::before, .about_liquidglass::before, .about_data_Containe::beforer.liquidglass_frame::before,.liquidglass_frame_shop::before{
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: 28px;
  box-shadow: inset 6px 6px 3px -16px rgba(256, 256, 256, 0.9);
  background-color: rgba(255, 255, 255, 0);
}
.heading_liquidglass::after, .about_liquidglass::after, .about_data_Container::after.liquidglass_frame::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: 28px;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  filter: url(#glass-distortion);
  -webkit-filter: url(#glass-distortion);
  isolation: isolate;
}
/*当たり判定を消す*/
.heading_liquidglass::before, .heading_liquidglass::after, .about_liquidglass::before, .about_liquidglass::after, .about_data_Containe::beforer, .about_data_Container::after, .liquidglass_frame::before, .liquidglass_frame::after,.liquidglass_frame_shop::after{
  pointer-events: none;
}
/*ここまで*/
/**/
.heading_text_Container h2 {
  width: 219px;
  height: 80px;
  margin-bottom: 44px;
  background-image: url(../img/sm_textbg_about1.png);
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  font-size: 3.6rem;
  line-height: 80px;
  text-align: center;
}
.heading_text_Container p:first-child {}
.heading_text_Container p:last-child {
  margin-top: 20px;
  color: #595959;
}
.about_bg, .about_bg_2 {
  width: 211px;
  height: 174px;
  margin: 130px auto 55px auto;
  background-image: url(../img/sm_textbg_about2.png);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.about_bg, .about_bg_2 h2 {
  line-height: 1.21;
}
.about_liquidglass {
  width: 100%;
  height: auto;
  margin-bottom: 130px;
  padding: 62px 20px;
}
.about_bg_2 {
  width: 279px;
  height: 174px;
  background-image: url(../img/sm_textbg_about3.png);
}
.about_outline {
  padding-bottom: 130px;
}
.about_data_Container {
  width: 100%;
  height: 442px;
}
.about_data_text {
  font-size: 18px;
  padding-left: 20px;
  padding-right: 20px;
}
.about_data_text h3 {
  font-size: 18px;
  margin-bottom: 20px;
}
.about_data_text p:last-child {
  margin-top: 20px;
}
.about_data {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}
.about_data dt {
  display: inline-block;
  text-align: left;
  width: 30%;
}
.about_data dd {
  display: inline-block;
  text-align: left;
  width: 70%;
}
/*下層共通・見出し配置*/
.sub_heading {
  width: fit-content;
  margin-top: 50px;
  margin-bottom: 130px;
}
.sub_heading h1 {
  margin-bottom: 70px;
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}
.sub_heading h2 {
  text-align: right;
  font-size: 2.8rem;
}
/**/
#product h1 {
  color: #F25F29;
}
#people h1 {
  color: #F25790;
}
#recruit h1 {
  color: #1D8FF2;
}
#entry h1 {
  color: #1D8FF2;
}
/*------------#product--------------*/
.product_Container {
  width: 100%;
	padding-bottom: 130px;
}
.product_introduction {
  width: 100%;
  height: auto;
	margin-top: 130px;
}
.product_text {
  width: fit-content;
}
.product_heading p {
  margin-top: 40px;
  margin-bottom: 10px;
}
.product_heading h3 {
  font-size: 1.8rem;
  margin-bottom: 17px;
}
.product_text p {
  font-size: 1.3rem;
}
.product_paragraph {
  text-align: center;
}
#product .liquidglass_frame {
  width: fit-content;
  margin: 10px 0 0 auto;
  border-radius: 38%;
}
#product .liquidglass_frame::before, #product .liquidglass_frame::after {
  border-radius: 38%;
}
#product .liquidglass_frame_inner {
  display: inline-block;
  padding: 30px 15px;
}
/****ゆがませる*****/
.product_introduction {
  position: relative;
  overflow: hidden;
}
/* 背景レイヤー */
.product_introduction .product_bg {
  position: absolute;
  inset: 0;
  background-image: url(../img/sm_textbg_products1_nemumeko.png);
  background-size: 60%;
  background-position: left top;
  background-repeat: no-repeat;
  z-index: 0;
}
.product_introduction .product_bg_2{
      position: absolute;
  inset: 0;
  background-image: url(../img/sm_textbg_products2_makkuramogura.png);
  background-size: 60%;
  background-position: left top;
  background-repeat: no-repeat;
  z-index: 0;
}

/* テキスト */
.product_text {
  padding-left: 20px;
  position: relative;
  z-index: 1;
}
/* ガラス */
.liquidglass_frame {
  position: relative;
  z-index: 2;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  background: rgba(255, 255, 255, 0.1);
}
/****ここまで*****/
#product .liquidglass_frame_shop{
    margin-top: 30px;
    border-radius: 20%;
}
#product .liquidglass_frame_shop,.on-lineshop_Container{
    width: 100%;
}
.on-lineshop_col_2 {
  width: 100%;
      margin: 0 auto;
  display: flex;
  justify-content: space-around;
}
.on-lineshop_item {
        width: 100%;

    padding: 0;
}
.shop_bg {
    width: 100%;
padding: 0 10px;
  background-color: #A7B7FF;
}
.on-lineshop_item h4{
    padding-left: 10px;
      font-weight: 400;
    font-size: 1.8rem;
}
.on-lineshop_item p:last-child{
    font-size: 1.3rem;
        padding-left: 10px;
    padding-bottom: 10px;

}

/*------------#people--------------*/
.people_yamada_Container,.people_mori_Container ,.people_saitou_Container{
padding-top: 130px;
	padding-bottom: 130px;
}
.people_yamada_Container img,.people_mori_Container img,.people_saitou_Container img{
	display: block;
	margin: 0 auto;
}
#people .liquidglass_frame{
  width: 81.09%;
}
.people_text{
	padding: 30px 5px;
}
.people_heading h2{
	font-size: 2.8rem;
	text-align: center;
	margin-bottom: 5px;
}
.people_heading span{
	font-size: 1.8rem;
}
.people_heading p{
	font-size: 1.8rem;
	text-align: center;
	margin-bottom: 32px;
}
.people_paragraph p{
	margin-bottom: 10px;
}
.people_paragraph p:last-child{
	margin-bottom: 0;
}

/*------------#recruit--------------*/
.recruit_Container{
	margin-bottom: 130px;
}
#recruit .liquidglass_frame{
	width: 100%;
	  justify-content: flex-start; /* 左寄せ */
	border-radius: 20%;
}
#recruit .liquidglass_frame_inner{
padding: 10px 20px;
}
.recruit_Container h2{
	font-size: 1.8rem;
}
.recruit_heading{
	margin-left: 15px;
	margin-bottom: 30px;
	padding-left: 5px;
	padding-right: 20px;
	  background-image: url(../img/sm_textbg_recruit1.png);
  background-size: contain;
  background-position: left top;
  background-repeat: no-repeat;
}
.recruit_heading h2{
	padding-top: 45px;
}
.recruit_heading ul{
	padding-bottom: 30px;
}
.recruit_text ul,.recruit_text dl{
	padding-bottom: 20px;
}
.recruit_message{
	margin-top: 20px;
}
.recruit_flow{
	margin: 30px 20px;
  background-image: url(../img/sm_textbg_recruit2.png);
  background-size: cover;
  background-position: left top;
  background-repeat: no-repeat;
}
.recruit_flow h2{
	padding: 22px 0 20px 0;
}
.recruit_flow span{
	margin-right: 5px;
}
.recruit_flow p{
	padding-bottom: 22px;
}
/* 箇条書きをすっきりさせる設定 */
.recruit_heading ul,.recruit_text ul,.entry_form ul{
  list-style-position: inside; /* 点が内側 */
  padding-left: 0;
  margin-left: 10px; /* 適切なインデントをマージンで調整 */
}
.recruit_heading li::marker,.recruit_text li::marker,.entry_form li::marker{
  font-size: 0.5em; /* 点の大きさ調整 */
}
/*------------#entry--------------*/
/*ここからfoam*/
.entry_form ul{
    margin-bottom: 30px;
}
 input[type="text"],input[type="email"],input[type="tel"]{
    width: 100%;
}
textarea{
    width: 100%;
}
.entry_form{
    padding-left: 20px;
    padding-right: 20px;
}
.entry_form span{
    font-size: 1.4rem;
}
.entry_form p{
    margin-bottom: 25px;
}
.post p{
    margin-bottom: 5px;
}
.post p:last-child{
    margin-bottom: 25px;
}
input[type="submit"] {
  display: block;
  margin: 40px auto;
}
input[type="submit"]:hover{
        cursor: pointer;
}
.entry{
    padding-bottom: 130px;
}
/*
.heading_liquidglass::before,
.about_liquidglass::before,
.about_data_Container::before,
.liquidglass_frame::before,
.liquidglass_frame_shop::before {
  content: '';
  position: absolute;
  inset: 0;
}

.heading_liquidglass::after,
.about_liquidglass::after,
.about_data_Container::after,
.liquidglass_frame::after,
.liquidglass_frame_shop::after {
  content: '';
  position: absolute;
  inset: 0;
}
*/
/*
  filter: brightness(1.5);
*/
/*
color
base F5F6F8
main A7B7FF
accent FFE8B6

sub-btns
subG 29D9B9
subO F25F29
subP F25790
subB 1D8FF2

text1 2F2F3A
text2 595959

.montserrat-<uniquifier> {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;


.montserrat-<uniquifier> {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;

.zen-maru-gothic-regular {
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.zen-maru-gothic-medium {
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 500;
  font-style: normal;
}
}
}
*/