/** Shopify CDN: Minification failed

Line 99:5 "witdh" is not a known CSS property
Line 483:12 Expected identifier but found whitespace
Line 483:17 Unexpected ";"
Line 676:0 Unexpected "{"

**/
   * {
     margin: 0;
     padding: 0;
   }
   img {
     border: 0;
   }
   body {
     width: auto;
     font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
     font-size: 16px;
     background: #fff;
   }
   h2 {
     font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
     font-color: FF0000;
     padding-top: 2em;
     font-size: 32px;
   }
   h3 {
     font-family: "Serif";
     font-color: FF0000;
     padding-bottom: 18px;
     font-size: 24px;
   }
   a:link {
     text-decoration: underline;
     color: #5d5d5d;
     font-size: 16px;
     text-align: left;
   }
   a:hover {
     text-decoration: none;
     color: #c7c7c7;
   }
   /*---説明---*/
   #mainVisual {
     width: auto;
     height: auto;
   }
   p.mainVisual {
     width: 1000px, flex;
     font-size: 16px;
     border-bottom: none;
     padding: 10px 0;
   }
   #container {
     width: absolute;
     font-family: serif;
     font-size: 16px;
   }
   p.mainText {
     display: flex;
     width: absolute;
     text-align: absolute;
     font-size: 15px;
     padding: 2em 0 2em;
   }
   a.mainText {
     font-size: 13px;
     text-align: left;
   }
   .wrapper {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
     gap: 0em;
     padding-top: 0em;
     padding-bottom: 0em;
     line-height: inherit;
   }
   p.wrapperText {
     display: flex;
     width: 480px;
     padding: 1em 1em;
     padding-bottom: 0em;
   }
   .wrapper2 {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(250px, 2fr));
     padding-top: 70px;
     line-height: inherit
   }
   .clear /*---ホームパーティ---*/
   #homeparty {
     width: auto;
     font-family: serif;
     font-size: 16px;
   }
   p.mainText {
     display: flex;
     witdh: auto;
     font-size: 16px;
     padding: 2em 0 2em;
   }
   a.mainText {
     font-size: 13px;
     text-align: left;
   }
   .wrapper {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
     gap: 0em padding-top: 0em;
     padding-bottom: 0em;
     line-height: inherit;
   }
   p.wrapperText {
     display: flex;
     width: 480px;
     padding: 1em 1em;
     padding-bottom: 1em;
   }
   /*---友達---*/
   #friends {
     width: auto;
     height: auto;
   }
   img.friendsVisual {
   
       width: auto;
       height: auto;
       padding: 10em;
     }
     p.mainVisual {
       width: auto;
       font-size: 16px;
       border-bottom: none;
       align: left;
     }
     p.friendsText {
       width: 480px, flex;
       font-size: 16px;
       padding: 1em 0 1em;
     }
     a.friendsText {
       font-size: 16px;
       padding: 1em 0 1em;
     }
     .wrapper {
       display: grid;
       grid-template-columns: repeat(auto-fill, minmax(250fr, 2fr));
       gap: 0em;
       padding-top: 80px;
       padding-bottom: 20px;
     }
     p.wrapperText {
       width: 480px;
       padding: 1em 1em;
       padding-bottom: 1em;
     }
     /*---------oem---------*/
     #ordermade {
       width: 100%;
       margin: 0 auto 80px;
       max-width: auto;
       text-align: center;
       font-size: 15px;
       line-height: 1.7;
     }
     #ordermade a, a:link, a:hover, a:visited, a:active {
       text-decoration: inherit;
       color: #524372;
     }
     #ordermade h2 {
       font-size: 22px;
     }
     #ordermade .subtitle {
       font-size: 18px;
       margin: 10px 0 30px;
     }
     #ordermade .explanation {
       font-family: "serif";
       font-size: 16px;
       margin: 10px 0 30px;
     }
     #ordermade p {
       margin: 0;
     }
     #ordermade .label {
       font-family: "Arial Black", Gadget, "sans-serif";
       font-weight: bold;
       font-size: 18px;
       padding: 10px auto 5px;
     }
     #ordermade .btn_contact {
       width: 100%;
       text-align: center;
       margin: 20px 0;
     }
     #ordermade .btn_contact p {
       width: 100%;
       text-align: center;
       font-size: 18px;
       margin: 10px auto;
     }
     #ordermade .btn_contact img {
       margin: 0 auto 0;
     }
     /*---種類---*/
     #ordermade #type {
       width: 100%;
       background-color: #eee;
       padding: 40px 0 20px;
       margin: 20px 0;
       text-align: center;
     }
     #ordermade #type .wrap {
       width: 96%;
       margin: 20px auto 10px;
       display: flex;
       flex-wrap: wrap;
     }
     #ordermade #type .wrap .type {
       width: calc(50% - 4%);
       margin: 3% 1% 3% 1%;
       padding: 1%;
       background-color: #fff;
     }
     #ordermade #type .wrap .box {
       padding: 20px 0;
       border-bottom: 2px solid #eee;
     }
     #ordermade #type .wrap .box table {
       font-size: 13px;
       border-collapse: collapse;
       border-spacing: 0px;
     }
     #ordermade #type .wrap .box table, th, td {
       border: none;
     }
     #ordermade #type .wrap p {
       font-weight: bold;
       font-size: 16px;
     }
     /*---素材---*/
     #ordermade #materials table {
       border-collapse: collapse;
       border-spacing: 0;
       table-layout: fixed;
       width: 800px;
     }
     table tr:last-child {
       border-bottom: solid 1px #ddd;
     }
     table th {
       background-color: #dddddd;
       text-align: center;
       padding: 7px 0;
       border-right: solid 1px #ddd;
       border-left: solid 1px #ddd;
       border-top: solid 1px #ddd;
       width: 200px;
     }
     table th:nth-child(1) {
       background-color: #dddddd;
     }
     table th:nth-child(3) {
       background-color: #dddddd;
       color: black;
     }
     table tr:nth-child(2) td {
       font-size: 30px;
     }
     table td {
       text-align: center;
       padding: 7px 0;
       border-right: solid 1px #ddd;
       border-left: solid 1px #ddd;
       border-bottom: solid 1px #ddd;
       width: 200px;
     }
     table td a {
       background-color: #dddddd;
       color: black;
       padding: 5px 20px;
       border-radius: 30px;
       font-weight: bold;
     }
     table .popular {
       width: 200px;
     }
     table th.popular {
       position: relative;
     }
     table th.popular span.no1 {
       position: absolute;
       left: 0;
       right: 0;
       margin: auto;
       top: -10px;
       left: calc(100% - 30px);
       background: #bdcc28;
       width: 60px;
       font-size: 10px;
       border-radius: 15px;
       line-height: 1;
       padding: 5px;
     }
     table th.popular span.inner {
       position: absolute;
       left: 0;
       right: 0;
       margin: auto;
       color: white;
       background-color: #524372;
       left: 0;
       bottom: 0;
       display: block;
       width: 200px;
       padding: 10px 0;
     }
     /*---目的---*/
     #ordermade #purpose {
       width: 100%;
       margin: 80px 0;
       text-align: center;
     }
     #ordermade #purpose .section {
       width: 100%;
       margin-top: 20px;
       text-align: left;
     }
     /*---事例---*/
     #ordermade #example {
       width: 100%;
       margin: 50px 0;
     }
     #ordermade #example .example {
       width: 80%;
       margin: 20px auto 10px;
       display: flex;
       flex-wrap: wrap;
     }
     #ordermade #example .example .box {
       width: calc(50% - 4%);
       margin: 2%;
       text-align: left;
     }
     /*---flow---*/
     #ordermade #flow {
       width: 100%;
       padding: 20px 0;
       margin: 50px 0;
     }
     #ordermade #flow table, th, td {
       border: none;
       border-collapse: collapse;
       border-spacing: 0px;
       text-align: center;
       padding: 0;
     }
     #ordermade #flow table .flow_box {
       width: 100%;
       height: 190px;
       border: 1px solid #999;
       text-align: center;
       padding: 20px 0 40px;
       margin: 0;
     }
     #ordermade #flow table .flow_box span {
       font-size: 16px;
       font-weight: bold;
       line-height: 1.5;
     }
     #ordermade #flow table .flow_txt {
       margin-top: 10px;
       text-align: left;
     }
     #ordermade #flow table .yajirushi {
       margin: 60px 0 0;
       width: 30px;
       padding: 0;
     }
     #ordermade #flow table .yajirushi img {
       width: 30px;
       margin: 0;
       padding: 0;
     }

     /*---CREATORS---*/
      *{margin: 0; padding: 0;}
    img {border: 0;}
    
    body {
      font-family:serif;
      font-size:16px;
      background:#fff;
    }

	/*---メイン---*/  
 
   #creatorcontainer {
      width: auto;
　　　height: auto;
　　　text-align: center;
      padding: 3px;      
      margin: 0 auto;
    }
 

 #creatorcontainer	.wrapper1 {
  display: grid;
  grid-template-columns: repeat(4, [col-start] 1fr);
  gap: 10px;
		padding-bottom: 2em;
}
	

 #creatorcontainer .wrapper {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
  gap: 1em;
	padding-top: 2em;
  padding-right: 2em;
 line-height: inherit
	 
}

	 #creatorcontainer p.wrapperText {
	 width: inherit;
	 padding-top: 1em;	
     padding-right: 2em;
	
	}

    /*---Company Overview---*/

        #overviewcontainer {
      width: auto;
      height: auto;
      margin: 0 auto;
    }
	  
	 #overviewcontainer .wrapper1 {
  display: grid;
  grid-template-columns: repeat(4, [col-start] 1fr);
  gap: 20px;
}
	
	  
	#overviewcontainer h2 {
      backgraound: none;
	  font-family: "MS Serif", "New York", "serif";	 	 
      font-size: 32px;
      width: auto;
      height: auto;
      text-align: left;
      padding-top: 50px;
	  padding-bottom: 25px;
      text-decoration: underline;
    }
	  
	 #overviewcontainer h3 {
      font-family:"Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
      font-size: 21px;
      width: auto;
      height:auto;
      text-align:left;
      padding-top: 20px;
    }
	 #overviewcontainer .mainVisual {align-content: flex-end}	
	
	  
 
   #overviewcontainer ul.outline-list.pc-mb130.sp-mb100 {
  list-style: none;
		padding-bottom: 20px;
  
}
	  
   #overviewcontainer ul .li {
      width: auto;
      height: auto;
      margin-bottom: 20px;
	  }
      float: auto;
      text-align: left;
	  
    }
	 ul.buisinessdetails {
  list-style: inside;
		padding-bottom: 20px;
  
}
	  
   ul .li {
      width: auto;
      height: auto;
      margin-bottom: 20px;
      float: auto;
      text-align: left;
	  
    }
	  

a:link {
		color: #000;
  border-radius: 0;
}


   #overviewcontainer .clear {
      clear: both;
    }
	  
   
    
    #overviewnews {
      width: auto;
      height: auto;
      margin-top: 15px;
      float: left;
    }
	  
		
  #overviewnews  p.newsText {
      font-size: 14px;
      border-bottom: 1px dashed #000;
      padding: 10px 0;
    }
		
  
	#overviewevent .wrapper {
  display: grid;
  grid-template-columns: repeat(2, [col-start] 1fr);
  gap: 20px;
}	

	#overviewevent  .btn--gray,
a.btn--gray {
  color: #fff;
  background-color: #808391;
}
#overviewevent .btn--gray:hover,
a.btn--gray:hover {
  color: #fff;
  background: #808391;
}
	
 /*----About Us----*/   
#aboutcontainer {
      width: auto;
      font-family:serif;
      font-size:16px;
	  }

#aboutcontainer .video-wrapper {
  overflow: hidden;
  position: relative;
  width: 100%;
	 aspect-ratio: 2.35/ 1;
  /* height: 620px;  高さ固定 */
  margin: auto;
}
 
#aboutcontainer .video-wrapper::before {
  content: "";
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  background-color: rgba(0, 0, 0, 0);
}
 
#aboutcontainer .video-wrapper video {
  width: 100%;  /* 明示的に幅を設定（必須） */
  height: 100%; /* 明示的に高さを設定（必須） */
  object-fit: cover;  /* ラッパーにに収まるように拡大縮小 */
  object-position:0%;  /* 動画の位置の調整 */
}
#aboutcontainer .video-txt{
	width: 100%;
	margin-top: 3px;
	}
#aboutcontainer .video-txt p{
	text-align: right; 
	margin: 0;
	font-size: 13px;

	}
#aboutcontainer .video-txt a{
		text-decoration: underline;
	color:#000;
	}
	
/* ビューポート幅が 480px 以下の場合はビデオを非表示にして背景画像を表示 */
@media screen and (max-width: 480px) {
 #aboutcontainer .video-wrapper {
	width: 100%;
    /* height:300px;  高さの調整 */
    background: url(/cdn/shop/files/aboutus_movie_mb.jpg?v=1720582866);  /* 別途背景画像を用意 */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  }
 
  #aboutcontainer .video-wrapper video {
	  width: 100%;
    /*display: none;   ビデオを非表示（背景画像を表示するため） */
  }
	#aboutcontainer .video-txt{
		margin-bottom:50px;
	}
}
	  

	 p.mainText {
      font-size: 15px;
      padding: 1em 0 1em;
    }
	
	a.mainText {
		font-size: 13px;
		text-align: left;
	}
	
	#aboutcontainer .wrapper1 {
  display: grid;
  grid-template-columns: repeat(4, [col-start] 1fr);
  gap: 10px;
		padding-bottom: 2em;
}
	

#aboutcontainer .wrapper {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1em;
	padding-top: 2em;
  padding-right: 2em;
 line-height: inherit
	 
}

	p.wrapperText {
	 width: inherit;
	 padding-top: 1em;	
     padding-right: 2em;
	
	}
	

	#aboutlist {
		width: inherit; align-content: flex-start;
		font-family: serif;
		font-size: 10px;
	}
	
	ul.about-mediahistory {
	margin-left: 0;
    padding-left: 0;
    line-height: 1;
		}
	ol, ul {
    box-sizing: border-box;
}
	ul li {
    list-style-type: none;
    font-size: 10px;
}
	
	#aboutlist .day {
		margin-top: 1px;
	}



{
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
	

#aboutlist h5 {
 font-size: 12px;
}

#aboutsustainability
	{
      width: auto;
      font-family:serif;
      font-size:16px;
	  }

	 p.mainText {
      font-size: 15px;
      padding: 1em 0 1em;
    }
	
	a.mainText {
		font-size: 13px;
		text-align: left;
	}
	
	
		
	#aboutsustainability	.wrapper2 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));

  gap: 1em;
	padding-top: 2em;
  padding-right: 2em;
 line-height: inherit
	 
	}

	p.wrapperText {
	 width: inherit;
	 padding-top: 1em;
	 padding-right: 2em;
	}
