/*--------------------------------------------
Auter:Atsushi Honda
URL:https://sekilala-design.com
Copyright(c)2025 sekilala all rights reserved.
----------------------------------------------*/
  /*改行 */
@media screen and (min-width: 768px){   
  .br-pc{ display:block; }
  .br-sp{ display:none; }
}
@media screen and (max-width: 767px){   
  .br-pc{ display:none; }
  .br-sp{ display:block; }
}
  /*ページ内スクロール */
html{
  scroll-behavior: smooth;
  overflow-x: hidden;   /* 横はここで切る */
}

body{
  margin:0;
  background: #fff;
  overflow-x: visible;  /* ← stickyを生かす */
    
}

h1{
	text-indent:-9999px;
	font-size:1px;
	text-align:center;
	margin:0px;
	padding:0px;
}

/*
link color
----------------------------------------------*/
a{
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
    -ms-transition: 0.5s;
    transition: 0.5s;
	text-decoration:none;
	color:#00ff00;
	border-bottom:none;
}

a:hover,
a:visited {
  color: #00ff00;
}
/*
works_box
----------------------------------------------*/
.works_box{ 
  width:100%;
  margin:140px 0 80px;
}


.works{
	width:100vw;
  }

/*
top_sp
----------------------------------------------*/
.index_box{
width:100%;   
}

.top_contact{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-weight:100;
    color: #000;
	font-size:16px;
	letter-spacing:0.07em;
	text-align:center;
    cursor: pointer;
    border: 1px solid #00ff00;
    width: 160px;
    height: 40px;
    line-height: 36px;
    border-radius: 100vh;
    right:20px;
    top:20px;
    position:fixed;
    z-index:1001;
}
.sam_top{
    width: 100vw;
}
.index_sambox_top{
    width: 100%;
    flex-grow:0;
    overflow:hidden;
    position:relative;	/* 相対位置指定 */
}
.index_sambox_top:before {
  animation: img-wrap 3s cubic-bezier(.4, 0, .2, 1) forwards;
  background: #000000;
  right: 0;
  top: 0;
  bottom: 0;
  left: 0;
  pointer-events: none;
  position: absolute;
  z-index: 1;
}
.index_sambox_top .mask {
	width: 100vw;
    height: 100vw;
	position:		absolute;	/* 絶対位置指定 */
	opacity:		0;	/* マスクを表示しない */
	background-color:	rgb(255 255 255 / 0.8);	/* マスクは半透明 */
	-webkit-transition:	all 0.2s ease;
	transition:		all 0.2s ease;
}
.index_sambox_top:hover .mask {
	opacity:		1;	/* マスクを表示する */
}
 .photo_240{
	width:100%;
	margin:0 auto;
}
.index_text_top{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-weight:400;
	width:100%;
	margin:44% auto 0px auto;
	font-size:18px;
	line-height:24px;
	letter-spacing:0.1em;
	text-align:center;
	float:left;
    color:#000000;
}
.index_empty_top{
    width: 100%;
    flex-grow:0;
    margin:0px auto 20px auto;
    overflow:hidden;
    position:relative;	/* 相対位置指定 */
}
.mvv{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-size:16px;
	font-weight:400;
	width:auto;
	margin:40px 20px 40px 20px;
	line-height:36px;
	letter-spacing:0.04em;
    justify-content: center;
    color:#000;
	text-align: justify;
}

.sam_category02, .sam_category03{
    width: 100%;
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    gap:0px 0px;
}

.newsbox{
    width: auto;
    flex-grow:0;
    margin:60px 60px 0px 60px;
    overflow:hidden;
    position:relative;	/* 相対位置指定 */    
}

.newsbox .mask {
	width:			100%;
	height:			100%;
	position:		absolute;	/* 絶対位置指定 */
	top:			0;
	left:			0;
	opacity:		0;	/* マスクを表示しない */
	background-color:	rgb(255 255 255 / 0.8);	/* マスクは半透明 */
	-webkit-transition:	all 0.2s ease;
	transition:		all 0.2s ease;
}
.newsbox:hover .mask {
	opacity:		1;	/* マスクを表示する */
}
.news_text_240{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-weight:400;
	width:200px;
	margin:40% 20px 0px 20px;
	font-size:18px;
	line-height:24px;
	letter-spacing:0.04em;
	text-align:center;
	float:left;
    color:#000000;
}
.news_category_text_240{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-weight:400;
	width:100%;
	margin:24px 0px 0px 0px;
	font-size:12px;
	line-height:10px;
	letter-spacing:0.04em;
	text-align:center;
	float:left;
    cursor: pointer;
}
.top_news{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-weight:100;
    color: #000;
	margin:20px auto 120px auto;
	font-size:20px;
	letter-spacing:0.1em;
	text-align:center;
    cursor: pointer;
    border: 1px solid #00ff00;
    width: 160px;
    height: 40px;
    line-height: 40px;
    border-radius: 100vh;
}
.sam_top_works{
    width: 100%;
    margin:120px auto 0px auto;
}
.index_sambox_top_works{
    width: 100%;
	height:100%;
    margin:0px auto 0px auto;
    overflow:hidden;
    position:relative;	/* 相対位置指定 */
    float: left;
}
.index_sambox_top_works:before {
  animation: img-wrap 3s cubic-bezier(.4, 0, .2, 1) forwards;
  background: #000000;
  right: 0;
  top: 0;
  bottom: 0;
  left: 0;
  pointer-events: none;
  position: absolute;
  z-index: 1;
}
.index_sambox_top_works .mask {
	width:			100%;
	height:			100%;
	position:		absolute;	/* 絶対位置指定 */
	top:			0;
	left:			0;
	opacity:		0;	/* マスクを表示しない */
	background-color:	rgb(255 255 255 / 0.8);	/* マスクは半透明 */
	-webkit-transition:	all 0.2s ease;
	transition:		all 0.2s ease;
}
.index_sambox_top_works:hover .mask {
	opacity:		1;	/* マスクを表示する */
}
.index_text_top_works{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-weight:400;
	width:100%;
	margin:44% auto 0px auto;
	font-size:18px;
	line-height:24px;
	letter-spacing:0.1em;
	text-align:center;
	float:left;
    color:#000000;
}

.index_empty_top_works{
    width: 280px;
    flex-grow:0;
    margin:0px auto 20px auto;
    overflow:hidden;
    position:relative;	/* 相対位置指定 */
}

.top_news, .top_about, .moretext{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-weight:100;
    color: #000;
	margin:20px auto 120px auto;
	font-size:16px;
	letter-spacing:0.1em;
	text-align:center;
    cursor: pointer;
    border: 1px solid #00ff00;
    width: 160px;
    height: 40px;
    line-height: 36px;
    border-radius: 100vh;
}

.copyright, .sekilala_text{
display:none;
}


.online{
	letter-spacing:0.1em;
	text-align:center;
    cursor: pointer;
    width: 100%;
}
.online_text{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-size:14px;
	font-weight:400;
	width:auto;
	margin:20px 20px 0px 20px;
	line-height:24px;
	letter-spacing:0.02em;
    justify-content: center;
    color:#000;
    text-align:justify;
}
.online_link{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-weight:100;
    color: #000;
	margin:20px auto 80px auto;
	font-size:16px;
	letter-spacing:0.1em;
	text-align:center;
    cursor: pointer;
    border: 1px solid #00ff00;
    width: 290px;
    height: 40px;
    line-height: 36px;
    border-radius: 100vh;
}


/*
contents
----------------------------------------------*/
.contents_title{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-size:64px;
	font-weight:100;
	max-width:100%;
	margin:0px 0px 40px 20px;
	line-height:26px;
	letter-spacing:-1px;
	text-align:left;
    color:#00ff00;
    clear: both;
}
/*.contents_title move*/
.contents_title{ 
animation-name: contents_title; 
-webkit-animation-name: contents_title; /* Safari & Chrome */
animation-iteration-count: 1; 
-webkit-animation-iteration-count: 1; /* Safari & Chrome */
animation-duration: 2s;
-webkit-animation-duration: 2s;/* Safari & Chrome */
animation-fill-mode: forwards;
-webkit-animation-fill-mode: forwards;/* Safari & Chrome */
 }
 @keyframes contents_title { 
0% {
transform:translate(0px, -30px);
-webkit-transform:translate(0px, -30px);
opacity: 0.0;
}
100%{
transform:translate(0px, 0px);
-webkit-transform:translate(0px, 0px);
opacity: 1.0;
}
}
/*
about, contact
----------------------------------------------*/
.about{
	margin:0px 0px 80px 0px;
}
.about_text, .contact_text{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
	margin:5px 30px 0px 30px;
	width:auto;
	font-size:16px;
    font-weight:400;
	line-height:36px;
	letter-spacing:0.1px;
	text-align:left;
	color:#000;
}
/*.about_text, contact move*/
.about_text, .contact_text{ 
animation-name: abouttext; 
-webkit-animation-name: abouttext; /* Safari & Chrome */
animation-iteration-count: 1; 
-webkit-animation-iteration-count: 1; /* Safari & Chrome */
animation-duration: 2s;
-webkit-animation-duration: 2s;/* Safari & Chrome */
animation-fill-mode: forwards;
-webkit-animation-fill-mode: forwards;/* Safari & Chrome */
 }
 
@keyframes abouttext { 
0% {
transform:translate(0px, 30px);
-webkit-transform:translate(0px, 30px);
}
100%{
transform:translate(0px, 0px);
-webkit-transform:translate(0px, 0px);
}
}

.about_us_midashi{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
	margin:120px 0px 0px 0px;
    font-size:32px;
    font-weight:400;
	line-height:28px;
	letter-spacing:0.1px;
	text-align:left;
	color:#000;
	border-bottom: 2px solid #00ff00;
    display: inline-block;
}
.about_us_honbun{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
	margin:20px 0px 40px 0px;
	font-size:18px;
    font-weight:400;
	line-height:32px;
	letter-spacing:0.07em;
	text-align:left;
	color:#000;
}
.online_honbun{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
	margin:20px auto 40px auto;
	font-size:14px;
    font-weight:400;
	line-height:28px;
	letter-spacing:0.02em;
	text-align:left;
	color:#000;
}
.online_logo{
	margin:20px auto 40px auto;
	text-align:center;
}


/*メール*/
.contact_mail{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-weight:100;
    color: #000;
	font-size:18px;
	letter-spacing:0.1em;
	text-align:center;
    cursor: pointer;
    border: 1px solid #00ff00;
    width: 320px;
    height: 40px;
    line-height: 40px;
    border-radius: 100vh;
    margin:20px 0px 0px 0px;
}
/*
media
----------------------------------------------*/



.media_box{ 
  width:100%;
  margin:140px 0 50px;
}



/* ===================================
   最下のマージン
=================================== */


.media_sam_flame{
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    gap: 0px 0px;    
}
.media_sam{
    width:50%;
}
.index_empty_240{
    width: 280px;
    flex-grow:0;
    margin:0px auto 20px auto;
    overflow:hidden;
    position:relative;	/* 相対位置指定 */
}
.media_text_box{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-weight:600;
	margin:120px 0px 0px 20px;
	font-size:16px;
	line-height:18px;
	letter-spacing:0.5px;
	text-align:left;
	color:#000;
}
.webmedia_text_box{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-weight:600;
	margin:120px 0px 0px 20px;
	font-size:16px;
	line-height:18px;
	letter-spacing:0.5px;
	text-align:left;
	color:#000;
}
.media_sam_text span{
	font-weight:400;
	font-size:12px;
}
.media_sam_text{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
	font-weight:300;
	margin:4px 10px 20px 10px;
	font-size:10px;
	line-height:20px;
	letter-spacing:0.5px;
	color:#000;
}
.interview_sam_text{
    font-family: "Zen Kaku Gothic New";
	font-weight:100;
	margin:0px 20px 0px 20px;
	font-size:10px;
	line-height:24px;
	letter-spacing:0.5px;
	color:#000;
}
.interview_sam_text span{
	font-weight:400;
	font-size:16px;
	line-height:24px;
	letter-spacing:0.07em;
	color:#000;
}
/*
media詳細ページ
----------------------------------------------*/
.media_title_text span{
    font-weight:300;
	font-size:18px;
	line-height:20px;
	letter-spacing:0px;
}
.media_title_text{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-weight:400;
	margin:40px 0px 0px 20px;
	font-size:16px;
	line-height:24px;
	letter-spacing:1px;
	text-align:left;
}
.media_text_02{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-weight:400;
	margin:30px 0px 20px 20px;
	font-size:16px;
	line-height:24px;
	letter-spacing:1px;
	text-align:left;
}
.media_photo img{
	display: block;
}


/*
award
----------------------------------------------*/
.award_title{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-size:64px;
	font-weight:100;
	margin:160px 0px 40px 20px;
	line-height:60px;
	letter-spacing:0px;
    color:#00ff00;
}

.awards_year{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-weight:600;
	margin:60px 0px 20px 0px;
	font-size:16px;
	line-height:18px;
	letter-spacing:1px;
	text-align:left;
	color:#000;
    clear: both;
}
.awards_text{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-weight:200;
	margin:0px 0px 0px 20px;
	font-size:16px;
	line-height:24px;
	letter-spacing:1px;
	text-align:left;
    float: left;
	color:#000;
}
.awards_text span{
    font-weight:400;
	font-size:20px;
	line-height:24px;
	letter-spacing:1px;
	color:#000;
}
.midashi span{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
	font-weight:400;
	font-size:24px;
	line-height:28px;
	letter-spacing:0px;
	color:#00ff00;
}
.midashi{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
	font-weight:200;
	margin:5px 0px 0px 0px;
	font-size:16px;
	line-height:20px;
	letter-spacing:0px;
}
.midashi a{
    color:#000;
}
.midashi a:hover {
    color:#000;
}


/*
photo
----------------------------------------------*/
.top_photo{
margin:0px 0px 0px 0px;
padding:0px 0px 0px 0px;
height:auto;
}
.top_photo img {
width:100%;
}
.top_photo> a {
border-bottom:none;
}

.btn_top{
width:20px;
height:20px;
margin:0px 0px 0px 0px;
padding:0px 0px 0px 0px;
float:left;
}


/* =====================================
   works thumbnail（SP 3列・flexなし）
===================================== */


.index_sambox_240.is-hide {
  opacity: 0;
  transform: scale(0.9);
  pointer-events: none;
  display: none;
}


  .sam_category{
    width: 100%;
    margin: 0 0 40px 0;
    padding: 0;
    font-size: 0;
  }


  .index_sambox_240,
  .index_empty_240{
    display: inline-block;
    width: calc(100% / 3);
    vertical-align: top;
    box-sizing: border-box;
  transition: opacity .3s ease, transform .3s ease;
  }

  .index_sambox_240{
    position: relative;
    overflow: hidden;
    line-height: 0;
  }

  .index_sambox_240::before {
    content: "";
    animation: img-wrap 3s cubic-bezier(.4, 0, .2, 1) forwards;
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
  }

  .index_sambox_240:hover .mask {
    opacity: 1;
  }

  .index_sambox_240 .mask {
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
    opacity: 0;
    background-color: rgb(255 255 255 / 0.8);
    transition: all 0.2s ease;
  }

  .index_text_240{
    font-family: "Zen Kaku Gothic New";
    font-weight: 400;
    width: 100%;
    margin-top: 44%;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0.1em;
    text-align: center;
    color: #000;
  }

/*
works
----------------------------------------------*/

.works-images {
  margin: 0;
  padding: 0;
}

.works-images li {
  list-style: none;
  margin-bottom: 0px; /* 好きな余白 */
}

.photo{
    width:100%;
	margin:0px 0px 0px 0px;
}
.photo img{
	margin:0px 0px 0px 0px;
  display: block;
}

.top_title{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-size:22px;
	font-weight:300;
	max-width:100%;
	margin:140px 32px 4px 16px;
	line-height:26px;
	letter-spacing:0.04em;
	text-align:left;
    color:#000;
}
.top_title_s{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-size:12px;
	font-weight:200;
	max-width:100%;
	margin:0px 32px 16px 16px;
	float:left;
	line-height:16px;
	letter-spacing:0.04em;
	text-align:left;
    color:#000;
}

.credit_text{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-weight:300;
	max-width:100%;
	margin:40px 32px 40px 32px;
	font-size:14px;
	line-height:20px;
	letter-spacing:0.04em;
	text-align:left;
    color:#000;
}
.credit_text dl {
  display: block;
  flex-wrap: wrap;
}
.credit_text dt {
  width: 200px; /* 左側の幅 */
  font-weight: normal;
}
.credit_text dd {
  width: calc(100% - 0px); /* 残りの幅 */
  margin: 0;
  margin-bottom: 0.5em;
}


.material_text,
.processing_text,
.credit_awards_text,
.books_text,
.web_text{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-weight:300;
	max-width:100%;
	margin:16px 32px 20px 32px;
	font-size:14px;
	line-height:20px;
	letter-spacing:0.04em;
	text-align:left;
    color:#000;
}
.material_text a,
.processing_text a,
.credit_awards_text a,
.books_text a,
.web_text a{
	color:#00ff00;
}
.material_text dd,
.processing_text dd,
.credit_awards_text dd,
.books_text dd,
.web_text dd
{
  display: block;
  flex-wrap: wrap;
}
.material_text dd,
.processing_text dd,
.credit_awards_text dd,
.books_text dd,
.web_text dd
{
  width: 200px; /* 左側の幅 */
  font-weight: normal;
}
.material_text dd,
.processing_text dd,
.credit_awards_text dd,
.books_text dd,
.web_text dd
{
  width: calc(100% - 0px); /* 残りの幅 */
  margin: 0;
  margin-bottom: 0.5em;
}

.works_consept{
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    margin:40px 32px 20px 32px;
	font-weight:300;
	max-width:100%;
	font-size:14px;
	line-height:24px;
	letter-spacing:0em;
    color:#000;
	text-align:justify;
}

/*
honbun_text
----------------------------------------------*/


/*.about_text, .awards_text, .contact_text move*/
.about_text, .awards_text, .contact_text{ 
animation-name: about_text, awards_text, contact_text; 
-webkit-animation-name: about_text, awards_text, contact_text; /* Safari & Chrome */
animation-iteration-count: 1; 
-webkit-animation-iteration-count: 1; /* Safari & Chrome */
animation-duration: 2s;
-webkit-animation-duration: 2s;/* Safari & Chrome */
animation-fill-mode: forwards;
-webkit-animation-fill-mode: forwards;/* Safari & Chrome */
 }
 @keyframes about_text { 
0% {
transform:translate(0px, 30px);
-webkit-transform:translate(0px, 30px);
}
100%{
transform:translate(0px, 0px);
-webkit-transform:translate(0px, 0px);
}
}
 @keyframes awards_text { 
0% {
transform:translate(0px, 30px);
-webkit-transform:translate(0px, 30px);
}
100%{
transform:translate(0px, 0px);
-webkit-transform:translate(0px, 0px);
}
}
 @keyframes contact_text { 
0% {
transform:translate(0px, 30px);
-webkit-transform:translate(0px, 30px);
}
100%{
transform:translate(0px, 0px);
-webkit-transform:translate(0px, 0px);
}
}

/*
sns icon
----------------------------------------------*/
.snsicon{
width:50px;
height:50px;
margin:30px 40px 40px 0px;
float:left;
}

.snsicon img{
	width:120%;
	height:120%;
}
.snsicon> a {
border-bottom:none;
}



/*
PC MENU
----------------------------------------------*/

#container .mix {
	display:none;
}

dd.filter {
	display:none;
}

dd.filter:hover{
	display:none;
}

.tagbox, tag01, tag02 {
	display:none;
}

 
 /*
  spmenu
 ---------------------------------------------------*/
  .menu_back {
    display:block;
    position:fixed;
    bottom :0px;
	text-align:center;
    left:0px;
    width:100%;
    height:50px;
    background:#00ff00;
	z-index:99;
} 
  /*
  sp menu ハンバーガーボタンの背景カラー
 ---------------------------------------------------*/
 .spmenu_btn {
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-weight:100;
    display:block;
    position:fixed;
    bottom :16px;
    left:15px;
    width:30px;
    height:12px;
    background:#e0e0e0;
    border-top:10px solid #00ff00;
    border-bottom:10px solid #00ff00;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
    -moz-transition:all 0.3s;
    -webkit-transition:all 0.3s;
    transition:all 0.3s;
    z-index:100;
}
  /*
  sp menu ハンバーガー ×ボタンカラー
 ---------------------------------------------------*/
.spmenu_btn:before {
    content:'';
    position:absolute;
    width:30px;
    height:1px;
    background:#fff;
    top:-3px;
    right:0;
    -moz-transition:all 0.3s;
    -webkit-transition:all 0.3s;
    transition:all 0.3s;
}
  /*
  sp menu ハンバーガー ×ボタンカラー
 ---------------------------------------------------*/
.spmenu_btn:after {
    content:'';
    position:absolute;
    width:30px;
    height:1px;
    background:#fff;
    bottom:-5px;
    right:0;
    -moz-transition:all 0.3s;
    -webkit-transition:all 0.3s;
    transition:all 0.3s;
}
.spmenu_btn.active {
    background:#fff;
}
.spmenu_btn.active:before {
    -moz-transform:rotate(-135deg);
    -webkit-transform:rotate(-135deg);
    transform:rotate(-135deg);
    top:0;
    right:0;
    background:#fff;
}
.spmenu_btn.active:after {
    -moz-transform:rotate(135deg);
    -webkit-transform:rotate(135deg);
    transform:rotate(135deg);
    bottom:0;
    right:0;
    background:#fff;
}
 
nav {
    display:block;
    width:100%;
    margin:0 auto;
}
nav li a {
    display:block;
    width:100%;
    color:#000;
    margin:0 auto;
    padding:14px;
    left:0%;
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
    position:relative;
    border-bottom:0px solid #999;
}

 /*
  spmenu_位置調整
 ---------------------------------------------------*/

ul {
    display: block;
    list-style-type: disc;
    margin-block-start: 4em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 0px;
}


 /*
  spmenu_news, awards, media~
 ---------------------------------------------------*/

.spmenu {
	font-feature-settings: "palt";
    font-family: "Zen Kaku Gothic New";
    font-size:34px;
	font-weight:200;
	letter-spacing:0.07em;
    display:none;/*このdisplay:noneは必要*/
    position:fixed;
    width:100%;
	height:100%;
    bottom :0px;
	left:0px;
	line-height:38px;
	text-align:center;
	z-index:20;
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(4px);
}
.spmenu a{
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
    -ms-transition: 0.5s;
    transition: 0.5s;
	text-decoration:none;
	color:#00ff00;
	border-bottom:none;
}
.spmenu a:visited {
	color:#00ff00;
}
.spmenu a:hover {
    color: #00ff00;
}

 /*
  spmenu_works
 ---------------------------------------------------*/


.slideBox_spworks{
	display: none;
}

/*top_photo*/
.index02_box{
	float: left;
	position: absolute;
	z-index: 98;
	left: 0px;
	width:100%;
	height:100%;
	margin:0px;    
}

 /*top_photo*/
.viewer, .viewer ul, .viewer ul li {
display: none;
}

 .viewer, .viewer ul, .viewer ul li a{
	border-bottom:none;
}

.fontweight600{
	font-weight:600;
}
	
 /*top_photo*/
.viewer_sp, .viewer_sp ul, .viewer_sp ul li {
max-width:100%;
width:100vw;
height:100vh;
min-height:100vh;
left:0%;
botom:0%;
margin:0;
float:left;
position: fixed;
z-index:-1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;

  /* 左右中央寄せ */
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;

  /* 上下中央寄せ */
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
 .viewer_sp, .viewer_sp ul, .viewer_sp ul li a{
	border-bottom:none;
}
.fontweight600{
	font-weight:600;
}
.open_spec, slideBox_spec, pcmenu{
display: none;
}

/*
SP_menu
----------------------------------------------*/
.sns_box{
	float: left;
	left: 0px;
	width: 100%;
	height: 30px;
	margin: 20px auto 60px auto;  
	text-align:center;
}





/*SP display: none;
===================================*/

.category_text_top{
    display: none;
}
.index_honbun_text_top{
    display: none;
}
.pcmenu {
    display: none;
}
.privacy{
    display: none;
}
.fb{
    display: none;
}


/* =====================================
   works filter（SP最適化・整理版）
===================================== */

/* ---------- wrap ---------- */
.works-filter-wrap{
  position: static; 
  top: 0;
  z-index: 1000;
  width: 100vw;                 /* ← 画面幅 */
  margin-left: calc(50% - 50vw);/* ← 親の制約を強制解除 */
    margin: 0px 0px 0px 0px;
  padding: 12px 0;
  background: rgba(255,255,255,0.7);
  backdrop-filter: blur(4px);
  box-sizing: border-box;

      display: flex;
  align-items: flex-start; /* ブロック単位で揃える */
}


/* ---------- 共通 ---------- */
.works-filter,
.works-filter-02{
  font-family: "Zen Kaku Gothic New";
  padding: 0px;               /* ← 余白はここ */
  box-sizing: border-box;
  overflow-x: auto;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
    
}

/* スクロールバー非表示（iOS/Chrome） */
.works-filter::-webkit-scrollbar,
.works-filter-02::-webkit-scrollbar{
}

/* ---------- 上段（カテゴリ） ---------- */
.works-filter{
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.08em;
    margin: 10px 0px 10px 20px;
line-height: 1.5;
    width: 20%;
}

/* ---------- 下段（地域） ---------- */
.works-filter-02{
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.08em;
    margin: 10px 0px 0px 54px;
line-height: 1.5;
    width: 16%;
}

/* ---------- input ---------- */
.works-filter input,
.works-filter-02 input{
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

/* ---------- label ---------- */
.works-filter label,
.works-filter-02 label{
  cursor: pointer;
}

/* ---------- text ---------- */
.works-filter span,
.works-filter-02 span{
  color: #b5b5b5;
  position: relative;
  padding-bottom: 3px;
  transition: color 0.25s ease;
}

/* underline（初期は非表示） */
.works-filter span::after,
.works-filter-02 span::after{
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: #00ff00;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.25s ease;
}

/* checked */
.works-filter input:checked + span,
.works-filter-02 input:checked + span{
  color: #00ff00;
}
.works-filter input:checked + span::after,
.works-filter-02 input:checked + span::after{
  transform: scaleX(1);
}

/* hover（PC対策） */
@media (hover: hover){
  .works-filter label:hover span,
  .works-filter-02 label:hover span{
    color: #00ff00;
  }
  .works-filter label:hover span::after,
  .works-filter-02 label:hover span::after{
    transform: scaleX(1);
  }
}

/* aタグ */
.works-filter a,
.works-filter-02 a{
  color: inherit;
  text-decoration: none;
}

/* videoサムネ */
.photo_240 video{
  width: 100%;
  height: auto;
  display: block;
}

/* =====================================
   works filter（SP 改行対応）
===================================== */
@media screen and (max-width: 768px){

  .works-filter,
  .works-filter-02{
    display: flex;
    flex-wrap: wrap;
    overflow-x: visible;
    white-space: normal;
    gap: 10px 14px; /* 行間 / 横間隔 */
  }

  .works-filter label,
  .works-filter-02 label{
    white-space: nowrap; /* 単語途中で折らせない */
  }
}

/* =====================================
   works filter（SP：地域フィルター非表示）
===================================== */
@media screen and (max-width: 768px){
  .works-filter-02{
  }
}
/* =====================================
   works filter（SP：カテゴリー背景透かし）
===================================== */
@media screen and (max-width: 768px){
  .works-filter {
    z-index: 1001; 
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(4px);
  }
}


/* ===================================
   最下のマージン
=================================== */
.page-bottom-space {
  height: 40px;
}