@charset "utf-8";
html {font-size: 62.5%}
body {
background-color: #FFFFFF;
min-width: 1080px;
font-size: 1.6rem;
letter-spacing: 0.15em;
line-height: 2.1;
font-family: "Noto Serif JP", serif;
font-weight: 500;
font-style: normal;
color: #2E2E2E;
-webkit-text-size-adjust: 100%;
animation: fadeIn 2s ease 0s 1 normal;
-webkit-animation: fadeIn 2s ease 0s 1 normal;
}
@keyframes fadeIn {
0% {opacity: 0}
100% {opacity: 1}
}
@-webkit-keyframes fadeIn {
0% {opacity: 0}
100% {opacity: 1}
}
select,input,button,textarea,button {font:99%;}
table {font-size:inherit;font:100%;}
pre,code,kbd,samp,tt {
font-family:monospace;
font-size:108%;
line-height:100%;
}

.jost,.en {
font-family: "Jost", sans-serif;
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;
}
.yugo{
font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
}



a:link {
color: #000000;
transition: .3s;
}
a:visited {
color: #000000;
text-decoration: none;
}
a:hover {
color: #000000;
text-decoration: underline;
}
a:active {
color: #000000;
text-decoration: none;
}
a.btn img {
-webkit-transition: 0.3s ease-in-out;
-moz-transition: 0.3s ease-in-out;
-o-transition: 0.3s ease-in-out;
transition: 0.3s ease-in-out;
-ms-filter: 'alpha(opacity=100)';
filter: alpha(opacity=100);
-moz-opacity: 1;
opacity: 1;
}
a:hover.btn img {
-ms-filter: 'alpha(opacity=60)';
filter: alpha(opacity=30);
-moz-opacity: 0.40;
opacity: 0.40;
}
a {
outline: none;
}
::selection {
background: #000000;
color: #FFFFFF;
}
::-moz-selection {
background:#000000;
color:#FFFFFF;
}
::-webkit-selection {
background:#000000;
color:#FFFFFF;
}
strong {
font-weight: bold;
}
.pc {
display: inherit!important;
}
.sp {
display: none!important;
}
#wrapper {
overflow: hidden
}
/*--HEADER-------------*/
header {
height: 100vh;
color: #000;
position: relative;
}
header.index {
color: #FFF;
}
header .inner {
width: calc(100% - 100px);
padding: 50px;
position: relative;
z-index: 10;
}
header a {
text-decoration: none;
}
header h1 {
margin-bottom: 20px;
}
header .en {
font-size: 14px;
font-family: "Jost", sans-serif;
margin-bottom: 30px;
}
header .en.bk {
color: #000;
}


.single-scroll-down-animation{
position: absolute;
	z-index: 9;
	left: 0;
	right: 0;
	bottom: 2vh
}
.scroll-down4{
  width: 1px;
  height: 120px;
  background: #FFF;
  animation: scrollDown4 2s ease infinite;
  margin: 0 auto;	
}

@keyframes scrollDown4{
	0%{
    transform-origin: top;
    transform: scaleY(0);
  }
  45%{
    transform-origin: top;
    transform: scaleY(1);
  }
  55%{
    transform-origin: bottom;
    transform: scaleY(1);
  }
  100%{
    transform-origin: bottom;
    transform: scaleY(0);
  }
}


/*--MAINVIS-------------*/
#mainVis {
position: fixed;
	width: 100%;
	height: 100vh;
	left: 0;
	top: 0;
	z-index: 1;
}
#mainVis_inner {
position: relative;
	width: 100%;
	height: 100vh;
}
#mainVis .movie {
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
}
#mainVis .movie video {
	position: absolute;
	top: 50%;
	left: 50%;
	display: block;
	width: auto;
	height: auto;
	min-width: 100%;
	min-height: 100%;
	transform: translate(-50%,-50%);
}



/*SP NAV*/
#panel-btn{
  display: inline-block;
  position: fixed;
  width: 40px;
  height: 40px;
  margin: 5px 0 10px;
  border-radius: 50%;
  right: 50px;
  top: 50px;
  z-index: 9999999;
	animation-duration: 2s;
}
#panel-btn-icon{
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 18px;
  height: 2px;
  margin: -1px 0 0 -7px;
  background: #FFF;
  transition: .2s;
}
#panel-btn-icon:before, #panel-btn-icon:after{
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 18px;
  height: 2px;
  background: #FFF;
  transition: .3s;
}
#panel-btn.bk #panel-btn-icon,
#panel-btn.bk #panel-btn-icon:before,
#panel-btn.bk #panel-btn-icon:after{
  background: #000;
}
#panel-btn.sub_bk #panel-btn-icon,
#panel-btn.sub_bk #panel-btn-icon:before,
#panel-btn.sub_bk #panel-btn-icon:after{
  background: #000;
}

#panel-btn-icon:before{
  margin-top: -6px;
}
#panel-btn-icon:after{
  margin-top: 4px;
}
#panel-btn .close{
  background: transparent!important;
}
#panel-btn.sub_bk .close{
  background: transparent!important;
}
#panel-btn .close:before, #panel-btn .close:after{
  margin-top: 0;
  background: #272727;
}
#panel-btn .close:before{
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}
#panel-btn .close:after{
  transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
}

#btn_ec{
position: fixed;
right: 53px;
top: 120px;
z-index: 999;
font-family: "Jost", sans-serif;
font-size: 1.4rem;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
}
#btn_ec a{
text-decoration: none;
color: #000;
padding: 15px 6px 15px 5px;
background-color: rgba(255,255,255,0.80);
border-radius: 50px;
}
#btn_ec a:hover{
	text-decoration: none;
	color: #FFF!important;
	background-color: rgba(0,0,0,1.00);
}
#btn_ec.close a,
#btn_ec.bk a{
color: #000
}

/*--NAVIGATION-------------*/
#gnav {
position: fixed;
background-color: #FFF;
right: 0;
top: 0;
z-index: 15;
display: none
}
#gnav .inner {
height: 100vh;
padding: 50px 220px 50px 50px;
}
#gnav .inner .ttl{
margin-bottom: 50px;
}
#gnav .inner .ttl a{
text-decoration: none
} 
#gnav ul#nav_global {
margin-bottom: 2em
}
#gnav ul#nav_global li {
font-size: 2.0rem;
margin-bottom: 2em
}
#gnav ul#nav_global li .en{
font-size: 1.4rem;
}
#gnav ul#nav_global li a{
text-decoration: none
}
#gnav ul#nav_global li a .en{
	border-top: 2px solid #FFF;
}
#gnav ul#nav_global li a:hover .en{
	border-top: 2px solid #272727;
}
#gnav ul#nav_sub {
margin-bottom: 4em
}
#gnav ul#nav_sub li {
font-size: 1.4rem;
margin-bottom: 1em
}
#gnav ul#nav_sub li a{
text-decoration: none
}
#gnav ul#nav_sub li a{
	border-bottom: 2px solid #FFF;
}
#gnav ul#nav_sub li a:hover {
	border-bottom: 2px solid #272727;
}

/*--INDEX_CONT-------------*/
#index_cont{
position: relative;
background-color: #FFF;
z-index: 10;
}
/*--INDEX_OUTLINE-------------*/
#index_outline{
width: 100%;
text-align: center;
padding-top: 50vh;
padding-bottom: 50vh;
position: relative;
z-index: 10;
background-color: rgba(0,0,0,0.40)
}
#index_outline img{
width: 60%;
height: auto
}

/*--INDEX_CRAFTMAN-------------*/
#index_craftman{
padding-top: 200px;
padding-bottom: 200px;
}
.heading{
width: 80%;
margin-left: auto;
margin-right: auto;
margin-bottom: 2em
}
.heading h2{
font-size: 2.4rem;
margin-bottom: 1em
}

ul#index_craftman_list{
width: 100%;
}
ul#index_craftman_list li{
margin-bottom: 10px;
overflow: hidden;
position: relative
}
ul#index_craftman_list li .aside{
width: 14%;
float: left;
position: relative
}
ul#index_craftman_list li .aside .ttl{
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
position: absolute;
right: 2em;
top: 1em;
white-space: nowrap;
transition: .3s
}
ul#index_craftman_list li:hover .aside .ttl{
opacity: 0
}


ul#index_craftman_list li .cont{
width: 86%;
float: right;
position: relative;
}
ul#index_craftman_list li .cont .meta{
position: absolute;
left: 80px;
top: 50%;
transform: translateY(-50%);
z-index: 10;
color: #FFF;
opacity: 0;
transition: .3s
}
ul#index_craftman_list li:hover .cont .meta{
opacity: 1;
}
ul#index_craftman_list li .cont .ttl{
margin-bottom: 3em;
}
ul#index_craftman_list li .cont .label{
margin-bottom: 1em;
font-size: 1.8rem;
}
ul#index_craftman_list li .cont .name{
margin-bottom: 1em;
font-size: 2.2rem;
}
ul#index_craftman_list li .cont .place{
font-size: 1.4rem;
}

ul#index_craftman_list li .cont .ph{
position: relative;
z-index: 0
}
ul#index_craftman_list li .cont .ph img{
width: 100%;
height: auto;
object-fit: cover
}

.overray {
position: absolute;
width: 100%;
height: 800px;
display: inline-block;
background-image: linear-gradient(to right, rgba(0,0,0,0) 50%, rgba(0,0,0,0.70) 50%);
mix-blend-mode: multiply;
background-position: 0 0;
background-size: 200% auto;
transition: all .3s ease 0s;
text-decoration: none;
z-index: 10
}
.overray:hover {
	cursor: pointer;
	background-position: -100% 0;
	color: #fff;
}

/*--INDEX_PRODUCT-------------*/
#index_product{
margin-bottom: 200px;
}
#slide_product{
position: relative
}
.swiper-slide img{
width: 100%;
height: auto
}
#index_product .read{
padding-top: 3em;
text-align: center
}
.swiper-button-next,
.swiper-button-prev {
  --swiper-navigation-color: #FFF;
}
.swiper-pagination-bullet {
  background-color: #000!important;
}


/*--INDEX_POTTERY-------------*/
#index_pottery{
background-color: #F5F2E9;
padding-top: 160px;
padding-bottom: 100px;
}
#index_pottery_map{
width: 1180px;
margin-left: auto;
margin-right: auto;
padding-top: 100px;
}
#index_pottery_map .map{
	float: left;
	width: 600px;
	height: 600px;
	background-image: url(../../images/index_map.svg);
	background-size: contain;
	background-repeat: no-repeat;
}
#index_pottery_map .map.map_aomori{
	background-image: url(../../images/index_map_aomori.svg);
}
#index_pottery_map .map.map_miyagi{
	background-image: url(../../images/index_map_miyagi.svg);
}
#index_pottery_map .map.map_akita{
	background-image: url(../../images/index_map_akita.svg);
}
#index_pottery_map .map.map_yamagata{
	background-image: url(../../images/index_map_yamagata.svg);
}
#index_pottery_map .map.map_fukushima{
	background-image: url(../../images/index_map_fukushima.svg);
}
#index_pottery_map .map.map_ibaraki{
	background-image: url(../../images/index_map_ibaraki.svg);
}
#index_pottery_map .map.map_tochigi{
	background-image: url(../../images/index_map_tochigi.svg);
}
/*-----20260326 add-----*/
#index_pottery_map .map.map_toyama{
	background-image: url(../../images/index_map_toyama.svg);
}
/*-----20260312 add-----*/
#index_pottery_map .map.map_fukui{
	background-image: url(../../images/index_map_fukui.svg);
}
#index_pottery_map .map.map_gifu{
	background-image: url(../../images/index_map_gifu.svg);
}
#index_pottery_map .map.map_aichi{
	background-image: url(../../images/index_map_aichi.svg);
}
#index_pottery_map .map.map_mie{
	background-image: url(../../images/index_map_mie.svg);
}
#index_pottery_map .map.map_shiga{
	background-image: url(../../images/index_map_shiga.svg);
}
#index_pottery_map .map.map_kyoto{
	background-image: url(../../images/index_map_kyoto.svg);
}
/*-----20250314 add-----*/
#index_pottery_map .map.map_hyogo{
	background-image: url(../../images/index_map_hyogo.svg);
}
/*-----20251211 add-----*/
#index_pottery_map .map.map_okayama{
	background-image: url(../../images/index_map_okayama.svg);
}
/*-----20251016 add-----*/
#index_pottery_map .map.map_hiroshima{
	background-image: url(../../images/index_map_hiroshima.svg);
}
/*-----20260129 add-----*/
#index_pottery_map .map.map_yamaguchi{
	background-image: url(../../images/index_map_yamaguchi.svg);
}
/*-----20251106 add-----*/
#index_pottery_map .map.map_kochi{
	background-image: url(../../images/index_map_kochi.svg);
}
#index_pottery_map .map.map_saga{
	background-image: url(../../images/index_map_saga.svg);
}
#index_pottery_map .map.map_nagasaki{
	background-image: url(../../images/index_map_nagasaki.svg);
}
#index_pottery_map .map.map_miyazaki{
	background-image: url(../../images/index_map_miyazaki.svg);
}
/*-----20260115 add-----*/
#index_pottery_map .map.map_kagoshima{
	background-image: url(../../images/index_map_kagoshima.svg);
}

#index_pottery_map .list{
	float: right;
	position: relative;
}
#index_pottery_map .list tr:hover .place::before{
content: "●";
position: absolute;
left: -1.5em
}
#index_pottery_map .list tr{
cursor: pointer
}
#index_pottery_map .list th{
font-size: 1.2rem
}
#index_pottery_map .list td{
border-bottom: 1px solid #9FA0A0;
padding: 0.5em 2em 0.5em 0
}

/*-----20251021 add-----*/
/* アコーディオンの基本スタイル */
.accordion-table{
	width: 500px;
}
.accordion-content {
display: block;       /* display:none は使わない */
height: 0;            /* 高さを0にして折りたたむ */
overflow: hidden;     /* 中身を隠す */
transition: height 0.3s ease;
}
.accordion-content.open {
height: auto;
display: table-row;
}
.accordion-content .place_width{
width: 36%;
}

.accordion-header th {
	font-weight: 600;
	position: relative;
	user-select: none;
	width: 100%;
	border-bottom: 1px solid #9FA0A0;
	padding: 0.5em 2em 0.5em 0;
}
.accordion-header th::before{
	content: "|";
	font-weight: bold;
	padding-left: 4px;
}

/* タイトル＋アイコンを左右に配置 */
.accordion-title {
	font-family: 'Noto Serif JP';
	cursor: pointer;
}
.accordion-title_region{
	display: inline-block;
	font-size: 18px;
}
.accordion-icon {
	float: right;
	font-weight: bold;
	font-size: 18px;
	transition: transform 0.3s ease;
}
.accordion-header.open .accordion-icon {
	transform: rotate(180deg); 
}

@media screen and (max-width: 520px) {
	.accordion-title_region, .accordion-icon {
		font-size: 15px;
	}
}

/*--INDEX_COMPENSATION生涯保証-------------*/
#index_compensation{
padding-top: 150px;
padding-bottom: 150px;
text-align: center
}
#index_compensation .main_read{
margin-bottom: 150px;
font-size: 2.4rem
}
#index_compensation .ph_image{
margin-bottom: 150px;
}
#index_compensation .ph_image img{
width: 100%;
height: auto
}
#index_compensation .cont h2{
margin-bottom: 1.5em;
font-size: 2.4rem
}
#index_compensation .cont .read{
margin-bottom: 1.5em;
font-size: 2.0rem
}
#index_compensation .cont p{
margin-bottom: 1em;
line-height: 2.3;
}
.btn_more{
margin-top: 5em;
text-align: center;
line-height: 1;
}
.btn_more a{
	display: inline-block;
	border: 1px solid #242424;
	padding: 10px 50px;
	font-size: 1.2rem;
	text-decoration: none;
}
.btn_more a:hover{
	background-color: #242424;
	color: #FFF
}

/*--FOOTER-------------*/
footer {
position: relative;
background-color: #FFF;
z-index: 10;
clear: both;
padding-top: 70px;
padding-bottom: 50px;
text-align: center
}

footer ul {
margin-bottom: 2.5em
}
footer li {
display: inline-block;
margin-right: 10px;
margin-left: 10px;
}
footer li a{
text-decoration: none;
}
footer ul.sns {
font-size: 2.4rem
}
footer ul.corporate {
font-size: 1.4rem
}


/*--SUB_PAGE-------------*/
#mainVis_sub {
position: fixed;
	width: 100%;
	height: 100vh;
	left: 0;
	top: 0;
	z-index: 0;
	color: #FFF
}
#mainVis_inner_sub {
position: relative;
	width: 100%;
	height: 100vh;
}
#mainVis_sub img {
	width: 100%;
	height: 100vh;
	object-fit: cover
}
#contents_sub{
width: 100%;
background-color: #FFF;
position: relative;
z-index: 10
}
/*--PRODUCT-------------*/

#mainVis_sub_product {
position: fixed;
	width: 100%;
	height: 100vh;
	left: 0;
	top: 0;
	z-index: 0;
	color: #FFF
}
#mainVis_inner_sub_product {
position: relative;
	width: 100%;
	height: 100vh;
}
#mainVis_sub_product img {
	width: 100%;
	height: 100vh;
	object-fit: cover
}

#product_outline{
text-align: center;
padding-top: 3em;
}
#product_outline h2{
font-size: 2.4rem;
}
#product_outline .ttl_en{
font-size: 1.6rem;
font-family: "Jost", sans-serif;
margin-bottom: 2em;
font-weight: 300
}
#product_outline .arrow{
padding-top: 4em
}

.product_wrap .product_header{
text-align: center;
padding-top: 4em;
padding-bottom: 3em;
}
.product_wrap .product_header .name{
font-size: 2.0rem;
}
.product_wrap .product_header .place{
font-size: 1.4rem;
}
.product_wrap .product_header .line{
width: 15px;
height: 1px;
background-color: #000;
display: inline-block
}
.product_wrap .product_header .label{
font-size: 1.4rem;
}
.product_wrap ul{
	background-color: #F5F2E9;
	border-top: 1px solid #231815;
}
.product_wrap ul li{
	border-bottom: 1px solid #231815;
}
.product_wrap ul li .ph{
width: 35%;
float: left
}
.product_wrap ul li .ph img{
width: 100%;
height: 450px;
object-fit: cover
}
.product_wrap ul li .cont{
width: 65%;
float: right;
display: flex
}
.product_wrap ul li .cont .txt{
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
padding: 30px;
line-height: 2.5;
max-height: 390px;
}
.product_wrap ul li .cont .txt .ttl{
font-size: 2.0rem;
padding-left: 0.5em
}
.product_wrap ul li:nth-child(2n) .ph{
float: right
}
.product_wrap ul li:nth-child(2n) .cont{
float: left;
flex-direction: row-reverse;
}

/*20241224追記*/
.product_wrap .btn_ec{
	text-align: center;
	font-family: "Jost", sans-serif;
	font-size: 1.4rem;
	padding-top: 1em;
	margin-bottom: 200px;
}
.product_wrap .btn_ec a{
text-decoration: none;
color: #FFF;
padding: 6px 60px;
background-color: #000;
border-radius: 50px;
border: 1px solid #000;
}
.product_wrap .btn_ec a:hover{
text-decoration: none;
color: #000!important;
background-color: #FFF;
border: 1px solid #000;
}
/*20241224追記　ここまで*/

/*--CRAFTMAN-------------*/
header.craftman{
color: #FFF
}
header.craftman h1 {
margin-bottom: 10px;
}
header.craftman .en {
font-size: 11px;
font-family: "Jost", sans-serif;
margin-bottom: 30px;
}

#mainVis_sub .main_ttl{
	position: absolute;
	width: 100%;
	text-align: center;
	margin: auto;
	top: 5vh;
	z-index: 11;
}
#mainVis_sub .main_ttl span{
	font-size: 22px;
	font-family: "Jost", sans-serif;
	font-weight: 300;
	color: #FFF;
	border-bottom: 1px solid #FFFFFF;
}
#mainVis_sub .meta{
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
line-height: 2.5;
position: absolute;
z-index: 11;
}
#mainVis_sub .meta .label{
font-size: 2.4rem
}
#mainVis_sub .meta .name{
font-size: 3.8rem
}
#mainVis_sub .meta .place{
font-size: 1.8rem
}
#mainVis_sub .credit{
position: absolute;
z-index: 11;
font-family: "Jost", sans-serif;
font-size: 1.4rem;
font-weight: 300
}
#mainVis_sub .credit p{
margin-bottom: 0.3em
} 

#mainVis_sub.craftman01 .meta{
top: 31vh;
left: 16vw
}
#mainVis_sub.craftman01 .credit{
bottom: 10vh;
left: 16vw
}

#mainVis_sub.craftman02 .meta{
top: 46vh;
left: 16vw
}
#mainVis_sub.craftman02 .credit{
bottom: 10vh;
right: 10vw
}

/*3/13 add*/
#mainVis_sub.craftman03 .meta{
	top: 55vh;
	left: 20vw
}
#mainVis_sub.craftman03 .credit{
	bottom: 20vh;
	right: 8vw
}

/*20250702 add*/
#mainVis_sub.craftman04 .meta{
	color: #2e2e2e;
	top: 32vh;
	left: 15vw
}
#mainVis_sub.craftman04 .credit{
	color: #fff;
	bottom: 8vh;
	right: 8vw;
}

/*20250815 add*/
#mainVis_sub.craftman05 .main_ttl{
	text-shadow: #333 0 0 8px;
}
#mainVis_sub.craftman05 .meta{
	top: 50vh;
	left: 15vw
}
#mainVis_sub.craftman05 .credit{
	color: #fff;
	bottom: 10vh;
	right: 10vw;
	text-shadow: #333 0 0 8px;
}

/*20250815 add*/
#mainVis_sub.craftman06 .main_ttl{
	text-shadow: #333 0 0 8px;
}
#mainVis_sub.craftman06 .meta{
	top: 66vh;
	left: 13vw
}
#mainVis_sub.craftman06 .credit{
	color: #fff;
	bottom: 10vh;
	right: 10vw;
	text-shadow: #333 0 0 8px;
}

/*20250924 add*/
#mainVis_sub.craftman07 .main_ttl{
	text-shadow: #333 0 0 8px;
}
#mainVis_sub.craftman07 .meta{
	top: 70vh;
	left: 20vw
}
#mainVis_sub.craftman07 .credit{
	color: #fff;
	bottom: 10vh;
	right: 15vw;
	text-shadow: #333 0 0 8px;
}

/*20251016 add*/
#mainVis_sub.craftman08 .meta{
	top: 56vh;
	left: 15vw;
	text-shadow: #333 0 0 8px;
}
#mainVis_sub.craftman08 .credit{
	color: #fff;
	bottom: 16vh;
	right: 15vw;
	text-shadow: #333 0 0 8px;
}

/*20251120 add*/
#mainVis_sub.craftman09 .meta{
	top: 56vh;
	left: 15vw;
	text-shadow: #333 0 0 8px;
}
#mainVis_sub.craftman09 .credit{
	color: #fff;
	bottom: 18vh;
	right: 20vw;
	text-shadow: #333 0 0 8px;
}

/*20260115 add*/
#mainVis_sub.craftman10 .meta{
	top: 56vh;
	left: 18vw;
	text-shadow: #333 0 0 8px;
}
#mainVis_sub.craftman10 .credit{
	color: #fff;
	bottom: 16vh;
	right: 12vw;
	text-shadow: #333 0 0 8px;
}

/*20260212 add*/
#mainVis_sub.craftman11 .meta{
	top: 56vh;
	left: 18vw;
	text-shadow: #333 0 0 8px;
}
#mainVis_sub.craftman11 .credit{
	color: #fff;
	bottom: 16vh;
	right: 18vw;
	text-shadow: #333 0 0 8px;
}

/*20260305 add*/
#mainVis_sub.craftman12 .meta{
	top: 24vh;
	left: 70vw;
	text-shadow: #333 0 0 8px;
}
#mainVis_sub.craftman12 .credit{
	color: #fff;
	bottom: 10vh;
	right: 12vw;
	text-shadow: #333 0 0 8px;
}

/*20260326 add*/
#mainVis_sub.craftman13 .meta{
	top: 70vh;
	left: 10vw;
	text-shadow: #333 0 0 8px;
}
#mainVis_sub.craftman13 .credit{
	color: #fff;
	bottom: 10vh;
	right: 12vw;
	text-shadow: #333 0 0 8px;
}

.craftman_cont{
padding-top: 4em
}
.craftman_cont h2{
font-size: 2.4rem;
text-align: center;
margin-bottom: 6em
}
.craftman_cont p{
margin-bottom: 1em
}
.craftman_cont p.notice{
font-size: 1.2rem;
margin-top: 3em
}
.cont_ttl{
font-size: 1.8rem;
margin-bottom: 2em
}

.pd_top{
padding-top: 5em;
}
.pd_bottom{
padding-bottom: 5em
}
.gap_left{
margin-left: -3vw
}
.gap_right{
margin-right: -3vw
}
.gap_top{
margin-top: -360px;
}



.block_ph_wide img,
.block_center img,
.block_ph_normal img,
.block_ph_small img,
.block_ph_full img,
.block_ph_small_single img{
width: 100%;
height: auto
}

.craftman_cont .outline {
width: 780px;
margin-left: auto;
margin-right: auto;
margin-bottom: 8em
}

.craftman_cont .outline.multiple {
width: 1080px;
margin-left: auto;
margin-right: auto;
margin-bottom: 8em
}
.craftman_cont .outline .ttl{
font-size: 2.0rem;
text-align: center;
margin-bottom: 2em
}
.craftman_cont .outline.multiple .txt_first{
width: 48%;
float: left
}
.craftman_cont .outline.multiple .txt_second{
width: 48%;
float: right
}
.craftman_cont .cap{
padding-top: 0.5em;
font-size: 1.2rem;
}


.block_ph_wide{
width: calc(100% - calc(calc(100% - 1080px) / 2));
margin-bottom: 8em
}
.block_ph_wide.fl_L .cap{
text-align: right
}

.block_ph_normal{
width: calc(100% - calc(calc(100% - 680px) / 2));
margin-bottom: 8em
}
.block_ph_normal.fl_L .cap{
text-align: right
}

.block_ph_small{
width: 70%;
margin-bottom: 8em
}

.craftman08 .block_center.cFix {
	margin-bottom: 0;
}


.block_center{
width: 1080px;
margin-left: auto;
margin-right: auto;
margin-bottom: 8em
}

.block_center .cont_first{
width: 46%;
float: left;
}
.block_center .cont_second{
width: 46%;
float: right
}

.block_center.many_txt .cont_first{
width: 67%;
float: left;
}
.block_center.many_txt .cont_second{
width: 25%;
float: right
}


.block_txt_normal{
width: 70%;
}


.ph_left_end{
width: calc(calc(calc(100vw - 1080px) / 2) + calc(1080px * 0.46));
margin-left: calc(calc(calc(100vw - 1080px) / 2) * -1);
}
.ph_right_end{
width: calc(calc(calc(100vw - 1080px) / 2) + calc(1080px * 0.46));
margin-right: calc(calc(calc(100vw - 1080px) / 2) * -1);
}
.cap.right_end{
width: calc(calc(calc(100vw - 1080px) / 2) + calc(1080px * 0.46));
}
.ph_small{
width: 70%;
}

.block_ph_full{
width:100%;
margin-bottom: 8em;
text-align: center !important
}


.craftman_cont .end_comment {
width: 780px;
margin-left: auto;
margin-right: auto;
margin-bottom: 8em
}
.craftman_cont .end_comment .ttl{
font-size: 2.0rem;
text-align: center;
margin-bottom: 2em
}

.craftman_cont .end_credit {
	width: 1080px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 8em;
	border-top: 1px solid #231815;
	border-bottom: 1px solid #231815;
	padding-top: 5em;
	padding-bottom: 5em;
	text-align: center
}
.craftman_cont .end_credit .name{
	font-size: 2.4rem;
}
.craftman_cont .end_credit .name_en{
	font-size: 1.4rem;
	margin-bottom: 3em
}
.craftman_cont .end_credit .ttl_meta{
	font-weight: 600;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, sans-serif;
}

.craftman_cont .end_product {
	width: 1080px;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 8em;
}
.craftman_cont .end_product .photo{
	width: 45%;
	float: right
}
.craftman_cont .end_product .photo img{
	width: 100%;
	height: 400px;
	object-fit: cover
}
.craftman_cont .end_product .txt{
	width: calc(55% - 120px);
	float: left;
	padding: 0px 60px
}

.craftman_cont .end_product .ttl{
	font-size: 2.0rem;
	margin-bottom: 1em
}

.craftman_cont .end_product .btn_more{
	text-align: left
}





.block_left_two_column{
width: 1080px;
margin-left: 10vw;
margin-right: auto;
margin-bottom: 8em
}
.block_left_two_column .inner{
column-count: 2;
column-gap: 8%;   
}
.block_right_two_column{
width: 1080px;
margin-left: auto;
margin-right: 10vw;
margin-bottom: 8em
}
.block_right_two_column .inner{
column-count: 2;
column-gap: 8%;   
}
.block_ph_small_single{
width: 30%;
margin-left: 10vw;
margin-right: 10vw;
margin-bottom: 8em
}

.two_col_right{
	width: 1080px;
	margin-right: 10vw;
	margin-left: auto;
	margin-bottom: 8em;
}

.two_col{
	display: flex;
	gap: 4%;
}

.two_col .cont_first,
.two_col .cont_second{
	width: 48%;
}















/*--------------- sp ---------------*/

@media screen and (max-width: 520px) {
html {font-size: 62.5%}
body {
background-color: #FFFFFF;
min-width: 320px;
font-size: 1.4rem;
letter-spacing: 0.15em;
line-height: 2.1;
font-family: "Noto Serif JP", serif;
font-weight: 500;
font-style: normal;
color: #2E2E2E;
-webkit-text-size-adjust: 100%;
animation: fadeIn 2s ease 0s 1 normal;
-webkit-animation: fadeIn 2s ease 0s 1 normal;
}
select,input,button,textarea,button {font:99%;}
table {font-size:inherit;font:100%;}
pre,code,kbd,samp,tt {
font-family:monospace;
font-size:108%;
line-height:100%;
}

.jost,.en {
font-family: "Jost", sans-serif;
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;
}
.yugo{
font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
}



a:link {
color: #000000;
transition: .3s;
}
a:visited {
color: #000000;
text-decoration: none;
}
a:hover {
color: #000000;
text-decoration: underline;
}
a:active {
color: #000000;
text-decoration: none;
}
a.btn img {
-webkit-transition: 0.3s ease-in-out;
-moz-transition: 0.3s ease-in-out;
-o-transition: 0.3s ease-in-out;
transition: 0.3s ease-in-out;
-ms-filter: 'alpha(opacity=100)';
filter: alpha(opacity=100);
-moz-opacity: 1;
opacity: 1;
}
a:hover.btn img {
-ms-filter: 'alpha(opacity=60)';
filter: alpha(opacity=30);
-moz-opacity: 0.40;
opacity: 0.40;
}
a {
outline: none;
}
::selection {
background: #000000;
color: #FFFFFF;
}
::-moz-selection {
background:#000000;
color:#FFFFFF;
}
::-webkit-selection {
background:#000000;
color:#FFFFFF;
}
strong {
font-weight: bold;
}
.pc {
display: none!important;
}
.sp {
display: inherit!important;
}
#wrapper {
overflow: hidden
}
/*--HEADER-------------*/
header {
height: 100vh;
color: #000;
position: relative;
}
header .inner {
width: calc(100% - 50px);
padding: 25px;
position: relative;
z-index: 10;
}
header a {
text-decoration: none;
}
header h1 {
margin-bottom: 20px;
}
header .en {
font-size: 14px;
font-family: "Jost", sans-serif;
margin-bottom: 30px;
}
header.index .en {
font-size: 8px;
}
.single-scroll-down-animation{
display: none
}

/*--MAINVIS-------------*/
#mainVis {
position: fixed;
	width: 100%;
	height: 100vh;
	left: 0;
	top: 0;
	z-index: 1;
}
#mainVis_inner {
position: relative;
	width: 100%;
	height: 100vh;
}
#mainVis .movie {
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
}
#mainVis .movie video {
	position: absolute;
	top: auto;
	left: auto;
	display: block;
	width: 100%;
	height: auto;
	min-width: auto;
	min-height: auto;
	transform: translate(0%,0%);
}

.company_logo img{
	width: 45%;
	height: auto;
}

/*SP NAV*/
#panel-btn{
  display: inline-block;
  position: fixed;
  width: 40px;
  height: 40px;
  margin: 5px 0 10px;
  border-radius: 50%;
  right: 25px;
  top: 25px;
  z-index: 9999999;
animation-duration: 2s;
}
#panel-btn-icon{
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 18px;
  height: 2px;
  margin: -1px 0 0 -7px;
  background: #272727;
  transition: .2s;
}
#panel-btn-icon:before, #panel-btn-icon:after{
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 18px;
  height: 2px;
  background: #272727;
  transition: .3s;
}
#panel-btn-icon:before{
  margin-top: -6px;
}
#panel-btn-icon:after{
  margin-top: 4px;
}
#panel-btn .close{
  background: transparent;
}
#panel-btn .close:before, #panel-btn .close:after{
  margin-top: 0;
  background: #272727;
}
#panel-btn .close:before{
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}
#panel-btn .close:after{
  transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
}

#btn_ec{
position: fixed;
right: 28px;
top: 80px;
z-index: 999;
font-family: "Jost", sans-serif;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
}
#btn_ec a{
text-decoration: none;
color: #000;
padding: 15px 6px 15px 5px;
background-color: rgba(255,255,255,0.80);
border-radius: 50px;
}
#btn_ec.close a,
#btn_ec.bk a{
color: #000
}

/*--NAVIGATION-------------*/
#gnav {
position: fixed;
background-color: #FFF;
right: 0;
top: 0;
z-index: 15;
display: none;
width: 100%;
height: 100vh;
overflow-y: scroll
}
#gnav .inner {
height: auto;
padding: 50px 50px 130px 50px;
}
#gnav .inner .ttl{
margin-bottom: 50px;
}
#gnav .inner .ttl a{
text-decoration: none
}
#gnav ul#nav_global {
margin-bottom: 2em
}
#gnav ul#nav_global li {
font-size: 2.0rem;
margin-bottom: 0.7em
}
#gnav ul#nav_global li .en{
font-size: 1.4rem;
}
#gnav ul#nav_global li a{
text-decoration: none
}
#gnav ul#nav_global li a .en{
	border-top: 2px solid #FFF;
}
#gnav ul#nav_global li a:hover .en{
	border-top: 2px solid #272727;
}
#gnav ul#nav_sub {
margin-bottom: 4em
}
#gnav ul#nav_sub li {
font-size: 1.4rem;
margin-bottom: 0.7em
}
#gnav ul#nav_sub li a{
text-decoration: none
}
#gnav ul#nav_sub li a{
	border-bottom: 2px solid #FFF;
}
#gnav ul#nav_sub li a:hover {
	border-bottom: 2px solid #272727;
}

/*--INDEX_CONT-------------*/
#index_cont{
position: relative;
background-color: #FFF;
z-index: 10;
}
/*--INDEX_OUTLINE-------------*/
#index_outline{
width: 100%;
text-align: center;
padding-top: 30vh;
padding-bottom: 30vh;
position: relative;
z-index: 10;
background-color: rgba(0,0,0,0.40)
}
#index_outline img{
width: 60%;
height: auto
}
#index_outline .outline{
width: 80%;
margin-left: auto;
margin-right: auto;
color: #FFF;
font-size: 1.4rem;
line-height: 2.6;
}
#index_outline .outline .ttl{
font-size: 1.7rem;
}
#index_outline .outline p{
margin-bottom: 2.5em
}

/*--INDEX_CRAFTMAN-------------*/
#index_craftman{
padding-top: 100px;
padding-bottom: 100px;
}
.heading{
width: 90%;
margin-left: auto;
margin-right: auto;
margin-bottom: 2em
}
.heading h2{
font-size: 2.2rem;
margin-bottom: 1em
}

ul#index_craftman_list{
width: 100%;
}
ul#index_craftman_list li{
margin-bottom: 10px;
overflow: hidden;
position: relative
}
ul#index_craftman_list li .aside{
width: 14%;
float: left;
position: relative
}
ul#index_craftman_list li .aside .ttl{
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
position: absolute;
right: 1em;
top: 1em;
white-space: nowrap;
font-size: 1.4rem
}
ul#index_craftman_list li:hover .aside .ttl{
opacity: 1
}

ul#index_craftman_list li .cont{
width: 86%;
float: right;
position: relative
}
ul#index_craftman_list li .cont .meta{
position: absolute;
left: 20px;
top: 70%;
transform: translateY(-50%);
z-index: 10;
color: #FFF;
line-height: 1;
opacity: 1;
transition: .3s
}
ul#index_craftman_list li .cont .ttl{
margin-bottom: 3em;
}
ul#index_craftman_list li .cont .num{
margin-bottom: 1em;
font-size: 1.4rem;
}
ul#index_craftman_list li .cont .label{
margin-bottom: 1em;
font-size: 1.8rem;
}
ul#index_craftman_list li .cont .name{
margin-bottom: 1em;
font-size: 2.2rem;
}
ul#index_craftman_list li .cont .place{
font-size: 1.4rem;
}

ul#index_craftman_list li .cont .ph{
position: relative;
z-index: 0;
overflow: hidden
}
ul#index_craftman_list li .cont .ph img{
width: auto;
height: 70vw;
object-fit: cover;
position: relative;
left: -56vw;
}

.overray {
position: absolute;
width: 100%;
height: 800px;
display: inline-block;
background-image: linear-gradient(to right, rgba(0,0,0,0) 50%, rgba(0,0,0,0.70) 50%);
mix-blend-mode: multiply;
background-position: 0 0;
background-size: 200% auto;
transition: all .3s ease 0s;
text-decoration: none;
z-index: 10
}
.overray:hover {
	cursor: pointer;
	background-position: -100% 0;
	color: #fff;
}

/*--INDEX_PRODUCT-------------*/
#index_product{
margin-bottom: 200px;
}
#slide_product{
position: relative
}
.swiper-slide img{
width: 100vw;
height: 80vw;
object-fit: cover
}
#index_product .read{
padding-top: 3em;
text-align: center
}
.swiper-button-next,
.swiper-button-prev {
  --swiper-navigation-color: #FFF;
}
.swiper-pagination-bullet {
  background-color: #000!important;
}

/*--INDEX_POTTERY-------------*/
#index_pottery{
background-color: #F5F2E9;
padding-top: 80px;
padding-bottom: 50px;
}
#index_pottery_map{
width: 90%;
margin-left: auto;
margin-right: auto;
padding-top: 0px;
}
#index_pottery_map .map{
	float: none;
	width: 80%;
	height: auto;
	background-image: none;
	background-size: contain;
	background-repeat: no-repeat;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 50px;
}
#index_pottery_map .map img{
	width: 100%;
	height: auto;
}
#index_pottery_map .map.map_aomori{
	background-image: url(../../images/index_map_aomori.svg);
}
#index_pottery_map .map.map_miyagi{
	background-image: url(../../images/index_map_miyagi.svg);
}
#index_pottery_map .map.map_akita{
	background-image: url(../../images/index_map_akita.svg);
}
#index_pottery_map .map.map_yamagata{
	background-image: url(../../images/index_map_yamagata.svg);
}
#index_pottery_map .map.map_fukushima{
	background-image: url(../../images/index_map_fukushima.svg);
}
#index_pottery_map .map.map_ibaraki{
	background-image: url(../../images/index_map_ibaraki.svg);
}
#index_pottery_map .map.map_tochigi{
	background-image: url(../../images/index_map_tochigi.svg);
}
/*-----20260326 add-----*/
#index_pottery_map .map.map_toyama{
	background-image: url(../../images/index_map_toyama.svg);
}
#index_pottery_map .map.map_fukui{
	background-image: url(../../images/index_map_fukui.svg);
}
#index_pottery_map .map.map_gifu{
	background-image: url(../../images/index_map_gifu.svg);
}
#index_pottery_map .map.map_mie{
	background-image: url(../../images/index_map_mie.svg);
}
#index_pottery_map .map.map_shiga{
	background-image: url(../../images/index_map_shiga.svg);
}
#index_pottery_map .map.map_kyoto{
	background-image: url(../../images/index_map_kyoto.svg);
}
/*-----20250314 add-----*/
#index_pottery_map .map.map_hyogo{
	background-image: url(../../images/index_map_hyogo.svg);
}
/*-----20251211 add-----*/
#index_pottery_map .map.map_okayama{
	background-image: url(../../images/index_map_okayama.svg);
}
/*-----20251016 add-----*/
#index_pottery_map .map.map_hiroshima{
	background-image: url(../../images/index_map_hiroshima.svg);
}
/*-----20260129 add-----*/
#index_pottery_map .map.map_yamaguchi{
	background-image: url(../../images/index_map_yamaguchi.svg);
}
/*-----20251106 add-----*/
#index_pottery_map .map.map_kochi{
	background-image: url(../../images/index_map_kochi.svg);
}
#index_pottery_map .map.map_saga{
	background-image: url(../../images/index_map_saga.svg);
}
#index_pottery_map .map.map_nagasaki{
	background-image: url(../../images/index_map_nagasaki.svg);
}
#index_pottery_map .map.map_miyazaki{
	background-image: url(../../images/index_map_miyazaki.svg);
}
/*-----20260115 add-----*/
#index_pottery_map .map.map_kagoshima{
	background-image: url(../../images/index_map_kagoshima.svg);
}

#index_pottery_map .list{
	float: none;
	position: relative;
	width: 100%;
}
#index_pottery_map .list table{
width: 100%;
}
#index_pottery_map .list tr:hover .place::before{
content: "●";
position: absolute;
left: -1.5em
}
#index_pottery_map .list tr{
cursor: pointer
}
#index_pottery_map .list th{
font-size: 1.2rem
}
#index_pottery_map .list td{
border-top: 1px solid #9FA0A0;
padding: 0.5em 1em 0.5em 0;
font-size: 1.3rem
}

/*--INDEX_COMPENSATION生涯保証-------------*/
#index_compensation{
padding-top: 80px;
padding-bottom: 80px;
text-align: center
}
#index_compensation .main_read{
margin-bottom: 80px;
font-size: 1.8rem
}
#index_compensation .ph_image{
margin-bottom: 70px;
}
#index_compensation .ph_image img{
width: 100%;
height: auto
}
#index_compensation .cont h2{
margin-bottom: 1.5em;
font-size: 2.0rem
}
#index_compensation .cont .read{
margin-bottom: 1.5em;
font-size: 1.8rem
}
#index_compensation .cont p{
margin-bottom: 2em;
line-height: 2.3;
}
.btn_more{
margin-top: 5em;
text-align-last: center;
line-height: 1;
}
.btn_more a{
	display: inline-block;
	border: 1px solid #242424;
	padding: 10px 50px;
	font-size: 1.2rem;
	text-decoration: none;
}

/*--FOOTER-------------*/
footer {
position: relative;
background-color: #FFF;
z-index: 10;
clear: both;
padding-top: 20px;
padding-bottom: 50px;
text-align: center
}

footer ul {
margin-bottom: 2.5em
}
footer li {
display: inline-block;
margin-right: 10px;
margin-left: 10px;
}
footer li a{
text-decoration: none;
}
footer ul.sns {
font-size: 2.4rem
}
footer ul.corporate {
font-size: 1.4rem
}
footer ul.corporate li{
display: block
}


/*--SUB_PAGE-------------*/
#mainVis_sub {
position: relative;
	width: 100%;
	height: 100vh;
	left: 0;
	top: 0;
	z-index: 0;
	color: #000
}
#mainVis_inner_sub {
position: relative;
	width: 100%;
	height: 100vh;
}
#mainVis_sub img {
	width: 100%;
	height: 55vh;
	object-fit: cover
}
#contents_sub{
width: 100%;
background-color: #FFF;
position: relative;
z-index: 10
}
/*--PRODUCT-------------*/
#product_outline{
text-align: center;
padding-top: 3em;
width: 90%;
margin-left: auto;
margin-right: auto
}
#product_outline h2{
font-size: 2.4rem;
}
#product_outline .ttl_en{
font-size: 1.6rem;
font-family: "Jost", sans-serif;
margin-bottom: 2em;
font-weight: 300
}
#product_outline .arrow{
padding-top: 4em
}

.product_wrap .product_header{
text-align: center;
padding-top: 4em;
padding-bottom: 3em;
}
.product_wrap .product_header .name{
font-size: 2.0rem;
}
.product_wrap .product_header .place{
font-size: 1.4rem;
}
.product_wrap .product_header .line{
width: 15px;
height: 1px;
background-color: #000;
display: inline-block
}
.product_wrap .product_header .label{
font-size: 1.4rem;
}
.product_wrap ul{
	background-color: #F5F2E9;
	border-top: 1px solid #231815;
}
.product_wrap ul li{
	border-bottom: 1px solid #231815;
}
.product_wrap ul li .ph{
width: 100%;
float: none
}
.product_wrap ul li .ph img{
width: 100%;
height: 100vw;
object-fit: cover
}
.product_wrap ul li .cont{
width: 100%;
float: none;
display: flex
}
.product_wrap ul li .cont .txt{
-ms-writing-mode: lr-tb;
writing-mode: horizontal-tb;
padding: 30px;
line-height: 2.5;
max-height: 1000px;
}
.product_wrap ul li .cont .txt .ttl{
font-size: 2.0rem;
padding-left: 0.5em
}
.product_wrap ul li:nth-child(2n) .ph{
float: none
}
.product_wrap ul li:nth-child(2n) .cont{
float: none;
flex-direction: row;
}


/*--CRAFTMAN-------------*/
header.craftman{
height: auto;
color: #000;
}
header.craftman h1 {
margin-bottom: 10px;
}
header.craftman .en {
font-size: 11px;
font-family: "Jost", sans-serif;
margin-bottom: 30px;
}

#mainVis_sub .main_ttl{
	position: absolute;
	width: 100%;
	text-align: center;
	margin: auto;
	top: 56vh;
	z-index: 11;
	color: #000
}
#mainVis_sub .main_ttl span{
	font-size: 22px;
	font-family: "Jost", sans-serif;
	font-weight: 300;
	color: #000;
	border-bottom: 1px solid #000;
}
#mainVis_sub .meta{
-ms-writing-mode: lr-tb;
writing-mode: horizontal-tb;
line-height: 2.5;
position: absolute;
z-index: 11;
text-align: center;
line-height: 1.7
}
#mainVis_sub .meta .label{
font-size: 2.0rem
}
#mainVis_sub .meta .name{
font-size: 2.6rem
}
#mainVis_sub .meta .place{
font-size: 1.4rem
}
#mainVis_sub .credit{
position: absolute;
z-index: 11;
font-family: "Jost", sans-serif;
font-size: 1.2rem;
font-weight: 300
}
#mainVis_sub .credit p{
margin-bottom: 0.3em
} 

#mainVis_sub.craftman01 .meta{
top: 31vh;
left: 16vw
}
#mainVis_sub.craftman01 .credit{
bottom: 10vh;
left: 16vw
}

#mainVis_sub.craftman02 .meta{
top: 46vh;
left: 16vw
}
#mainVis_sub.craftman02 .credit{
bottom: 10vh;
right: 10vw
}
#mainVis_sub.craftman03 .meta{
top: 55vh;
left: 20vw
}
#mainVis_sub.craftman03 .credit{
bottom: 20vh;
right: 8vw
}
#mainVis_sub.craftman05 .main_ttl{
	text-shadow: none;
}
#mainVis_sub.craftman05 .credit{
	text-shadow: none;
	color: #000;
}
#mainVis_sub.craftman06 .main_ttl{
	text-shadow: none;
}
#mainVis_sub.craftman06 .credit{
	text-shadow: none;
	color: #000;
}
#mainVis_sub.craftman07 .main_ttl{
	text-shadow: none;
}
#mainVis_sub.craftman07 .credit{
	text-shadow: none;
	color: #000;
}
#mainVis_sub.craftman08 .meta{
	text-shadow: none;
}
#mainVis_sub.craftman08 .credit{
	text-shadow: none;
	color: #000;
}
#mainVis_sub.craftman09 .meta{
	text-shadow: none;
}
#mainVis_sub.craftman09 .credit{
	text-shadow: none;
	color: #000;
}
#mainVis_sub.craftman10 .meta{
	text-shadow: none;
}
#mainVis_sub.craftman10 .credit{
	text-shadow: none;
	color: #000;
}

#mainVis_sub.craftman11 .meta{
	text-shadow: none;
}
#mainVis_sub.craftman11 .credit{
	text-shadow: none;
	color: #000;
}

#mainVis_sub.craftman12 .meta{
	text-shadow: none;
}
#mainVis_sub.craftman12 .credit{
	text-shadow: none;
	color: #000;
}

#mainVis_sub.craftman13 .meta{
	text-shadow: none;
}
#mainVis_sub.craftman13 .credit{
	text-shadow: none;
	color: #000;
}


#mainVis_sub .meta{
top: 63vh!important;
left: 0!important;
right: 0!important;

}
#mainVis_sub .credit{
top: 83vh!important;
bottom: auto!important;
left: 0!important;
right: 0!important;
color: #000;
text-align: center;
line-height: 1.5
}
#mainVis_sub .credit br{
display: none
}

.craftman_cont{
padding-top: 1em
}
.craftman_cont h2{
font-size: 2.2rem;
text-align: center;
margin-bottom: 3em
}
.craftman_cont p{
margin-bottom: 1em
}
.craftman_cont p.notice{
font-size: 1.2rem;
margin-top: 3em
}
.cont_ttl{
font-size: 1.8rem;
margin-bottom: 2em
}

.pd_top{
padding-top: 5em;
}
.pd_bottom{
padding-bottom: 2em
}
.gap_left{
margin-left: 0vw
}
.gap_right{
margin-right: 0vw
}
.gap_top{
margin-top: 0px;
}



.block_ph_wide img,
.block_center img,
.block_ph_normal img,
.block_ph_small img,
.block_ph_full img,
.block_ph_small_single img{
width: 100%;
height: auto
}

.craftman_cont .outline {
width: 90%;
margin-left: auto;
margin-right: auto;
margin-bottom: 4em
}

.craftman_cont .outline.multiple {
width: 90%;
margin-left: auto;
margin-right: auto;
margin-bottom: 4em
}
.craftman_cont .outline .ttl{
font-size: 2.0rem;
text-align: center;
margin-bottom: 2em
}
.craftman_cont .outline.multiple .txt_first{
width: 100%;
float: none
}
.craftman_cont .outline.multiple .txt_second{
width: 100%;
float: none
}
.craftman_cont .cap{
padding-top: 0.5em;
font-size: 1.2rem;
padding-left: 1em;
padding-right: 1em
}
.craftman_cont .cap br{
display: none
}

.block_ph_wide{
width: 100%;
margin-bottom: 4em
}
.block_ph_wide.fl_L .cap{
text-align: left
}

.block_ph_normal{
width: 100%;
margin-bottom: 4em
}
.block_ph_normal.fl_L .cap{
text-align: left
}

.block_ph_small{
width:100%;
margin-bottom: 4em
}

.block_ph_small.seto{
	margin-bottom: 0;
}


.block_center{
width: 100%;
margin-left: auto;
margin-right: auto;
margin-bottom: 4em
}

.block_center .cont_first{
width: 90%;
float: none;
margin-left: auto;
margin-right: auto;
margin-bottom: 4em
}
.block_center .cont_second{
width: 90%;
float: none;
margin-left: auto;
margin-right: auto
}

.block_center.many_txt .cont_first{
width: 90%;
float: none;
margin-left: auto;
margin-right: auto
}
.block_center.many_txt .cont_second{
width: 90%;
float: none;
margin-left: auto;
margin-right: auto
}


.block_txt_normal{
width: 90%;
margin-left: auto;
margin-right: auto
}
.block_txt_normal.fl_R{
float: none!important
}
/*20250314 add*/
.block_txt_normal.fl_L{
float: none!important
}

.ph_left_end{
width: 90%;
margin-left: auto;
margin-right: auto
}
.ph_right_end{
width: 90%;
margin-left: auto;
margin-right: auto
}
.cap.right_end{
width: 90%;
margin-left: auto;
margin-right: auto
}
.ph_small{
width: 90%;
margin-left: auto;
margin-right: auto
}
.ph_small.fl_R{
float: none!important
}

.block_ph_full{
width:100%;
margin-bottom: 8em;
text-align: center!important
}


.craftman_cont .end_comment {
width: 90%;
margin-left: auto;
margin-right: auto;
margin-bottom: 8em
}
.craftman_cont .end_comment .ttl{
font-size: 2.0rem;
text-align: center;
margin-bottom: 2em
}

.craftman_cont .end_credit {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 8em;
	border-top: 1px solid #231815;
	border-bottom: 1px solid #231815;
	padding-top: 5em;
	padding-bottom: 5em;
	text-align: center
}
.craftman_cont .end_credit .name{
	font-size: 2.4rem;
}
.craftman_cont .end_credit .name_en{
	font-size: 1.4rem;
	margin-bottom: 3em
}
.craftman_cont .end_credit .ttl_meta{
	font-weight: 600;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, sans-serif;
}

.craftman_cont .end_product {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 8em;
}
.craftman_cont .end_product .photo{
	width: 100%;
	float: none;
	margin-bottom: 2em
}
.craftman_cont .end_product .photo img{
	width: 100%;
	height: 400px;
	object-fit: cover
}
.craftman_cont .end_product .txt{
	width: calc(100% - 0px);
	float: none;
	padding: 0px 0px
}

.craftman_cont .end_product .ttl{
	font-size: 2.0rem;
	margin-bottom: 1em
}

.craftman_cont .end_product .btn_more{
	text-align: left
}





.block_left_two_column{
width: 90%;
margin-left: auto;
margin-right: auto;
margin-bottom: 4em
}
.block_left_two_column .inner{
column-count: 1;
column-gap: 8%;   
}
.block_right_two_column{
width: 90%;
margin-left: auto;
margin-right: auto;
margin-bottom: 4em
}
.block_right_two_column .inner{
column-count: 1;
column-gap: 8%;   
}
.block_ph_small_single{
width: 90%;
margin-left: auto;
margin-right: auto;
margin-bottom: 4em
}
.block_ph_small_single.fl_R{
float: none
}

.two_col_right{
	width: 90%;
	margin: 0 auto;
	margin-bottom: 4em;
}

.two_col{
	display: block;
	gap: 0;
}

.two_col .cont_first,
.two_col .cont_second{
	width: 100%;
}


}

.product_img{
cursor:pointer;
}

.product_wrap .ph.product_link {
position: relative;
display: inline-block;
}
.product_wrap .ph.product_link::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  opacity: 0;
  transition: opacity 0.3s;
  pointer-events: none;
}

.product_wrap .ph.product_link::after {
  content: 'Online Shopを見る';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
	color: white;
  opacity: 0;
  transition: opacity 0.3s;
  pointer-events: none;
}

.ph.product_link:hover::before,
.ph.product_link:hover::after {
  opacity: 1;
}

/* 20251016 add 職人ページへリンク */
.craftmanPage_link{
	position: relative;
display: inline-block;
}

.craftmanPage_link::before{
	content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  opacity: 0;
  transition: opacity 0.3s;
  pointer-events: none;
}

.craftmanPage_link::after {
	content: '特集ページを見る';
	position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
	color: white;
  opacity: 0;
  transition: opacity 0.3s;
  pointer-events: none;
}

.craftmanPage_link:hover::before,
.craftmanPage_link:hover::after{
	opacity: 1;
}

/*20250702 add*/
.block_ph_small_soma{
	width: 70%;
	margin-bottom: 0;
}

.block_center .cap_right .cap{
	text-align: right;
}

.block_txt_wide{
	width: 86%;
}

.pd_top_16{
	padding-top: 16px;
}

.pd_top_32{
	padding-top: 32px;
}

.pd_top_40{
	padding-top: 40px;
}

.pd_top_64{
	padding-top: 64px;
}

.pd_top_120{
	padding-top: 120px;
}

.pd_top_160{
	padding-top: 160px;
}

.pd_24pct{
	padding-top: 24%;
}

.pd_26pct{
	padding-top: 26%;
}

.pd_hf{
	padding-top: 37%;
}

.pd_btm_32{
	padding-bottom: 32px;
}

.mg_none{
	margin: 0;
}

.cap.cap_iga{
	text-align: right;
}

@media screen and (max-width: 520px) {
	.block_ph_small_soma{
		width: 100%;
	}
	.block_center .cap_right .cap{
		text-align: left;
	}
	.block_txt_wide{
		width: 90%;
		margin-left: auto;
		margin-right: auto
	}
	#mainVis_sub.craftman04 .credit{
		color: #2e2e2e;
	}
	.br_credit_soma{
		display: block !important;
	}
	.br_credit_komine{
		display: block !important;
	}
	.pd_top_16, .pd_top_40, .pd_top_120, .pd_top_160, .pd_hf, .pd_top, .pd_24pct, .pd_26pct{
		padding-top: 0;
	}
	.sp_center{
		margin: 0 auto;
	}
	.cap.cap_iga{
		text-align: left;
	}
}

/*--------- 20251016 職人一覧 -----------*/
header.craftman-list{
	height: 60vh;
	background-image: url(../../images/_craftman/craftman-list_mv.jpg);
}

.mv_heading{
	width: 1080px;
	margin: 0 auto;
	text-align: center;
	position: relative;
	top: -36vh;
}

.mv_heading h2{
	font-size: 2.4rem;
}

.mv_heading .ttl_en{
	font-size: 1.6rem;
	font-family: "Jost", sans-serif;
	margin-bottom: 2em;
	font-weight: 300
}

.craftman-list_content{
	width: 1080px;
	margin: 0 auto;
	display: flex;
	gap: 40px;
	flex-wrap: wrap;
}

.craftman-list_item a{
	display: inline-block;
	background-color: #000;
}

.craftman-list_item a:hover img{
	opacity: 0.4;
	transition: 0.3s;
}

.craftman-list_item img{
	display: block;
	width: 520px;
}

.craftman-list_item .num{
	font-size: 1.6rem;
	font-family: "Jost", sans-serif;
	font-weight: 300;
	padding: 1.2rem 0 1.6rem;
	line-height: 1.6rem;
}

.craftman-list_item .label{
	line-height: 1.6rem;
}

.craftman-list_item .name{
	font-size: 2.2rem;
	line-height: 2.2rem;
	padding-top: 1.2rem;
}

/* ページネーション */
.pagination {
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  margin: 12rem 0 8rem;
}

.pagination button {
  padding: 0.3rem 0.6rem;
  border: none;
  background: none;
  cursor: pointer;
	color: #999;
  font-size: 1.6rem;
	font-family: "Noto Serif JP", serif;;
}

.pagination button:hover:not(:disabled) {
  background: #f2f2f2;
}

.pagination button.active {
  font-weight: bold;
  color: #333;
  text-decoration: underline;
}

.pagination button:disabled {
  opacity: 0.5;
  cursor: default;
}

@media screen and (max-width: 520px) {
	header.craftman-list .en{
		font-size: 1.1rem;
		margin-top: 1.1rem;
	}

	.mv_container{
		display: block;
		height: 8rem;
	}

	.mv_heading{
		width: 90%;
		position: relative;
		top: -35vh;
	}

	.br_none{
		display: none;
	}

	.craftman-list_content{
		width: 90%;
		display: block;
	}

	.craftman-list_item{
		width: 100%;
		margin-bottom: 3.2rem;
	}

	.craftman-list_item .num{
		padding: 0 0 1.2rem;
	}

	.craftman-list_item .label{
		line-height: 1.6rem;
	}

	.craftman-list_item .name{
		font-size: 2rem;
		line-height: 2rem;
		padding-top: 1rem;
	}	
	
	.craftman-list_item img{
		display: block;
		width: 100%;
	}
}