/*
	Theme Name: WerkStatt Child Theme
	Theme URI: http://themeforest.net/user/fuelthemes
	Description: <strong>A Premium theme for magazine, editor, community and more! WordPress Theme by <a href="http://www.themeforest.net/user/fuelthemes">fuelthemes</a></strong> – Update notifications available on Twitter and Themeforest <a href="http://twitter.com/anteksiler">Follow us on twitter</a> – <a href="http://themeforest.net/user/fuelthemes">Follow us on Themeforest</a>
	Version: 1.0.0
	Author: fuelthemes
	Template: werkstatt
	Text Domain: werkstatt
*/
/*
#about{
	background-image:url(http://localhost:8888/wordpress2/wp-content/uploads/2025/08/back.png);
	background-repeat:no-repeat;
	background-position: right -100px bottom -160px!important;
	background-size: 500px;
	background-color: rgba(255, 255, 255, 0.8);
	background-blend-mode: overlay;
	animation: blurLoop 4s infinite ease-in-out;
}
*/

.products-overlay h6 a,
.products-overlay h3 a{
	width:100%;
}

.products-overlay h6 a:after,
.products-overlay h3 a:after{
	display:none;
}

.slick-dots li{
	background: rgba(255, 255, 255, 0.2);
}

/* 初期状態は非表示 */
.thb-image-slider {
  opacity: 0;
  visibility: hidden;
}

/* Slick初期化後にフェードイン */
.thb-image-slider.slick-initialized {
  visibility: visible;
  animation: sliderFadeIn 1.5s ease-out both;
}

@keyframes sliderFadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}


.grecaptcha-badge {
  visibility: hidden;
}


/* =====================================
   メインビジュアル 縦書きキャッチコピー
===================================== */

/* 画像とテキストの親要素 */
.hero-vertical > .vc_column-inner > .wpb_wrapper {
    position: relative;
}

/* キャッチコピーの配置 */
.hero-vertical .hero-copy {
    position: absolute;
    top: 52%;
    right: 13%;
    transform: translateY(-50%);
    z-index: 10;
    width: max-content;
    max-width: none;
    margin: 0 !important;
    padding: 0;
}

/* 縦書きの基本設定 */
.hero-vertical .hero-copy .wpb_wrapper {
    writing-mode: vertical-rl;
    -webkit-writing-mode: vertical-rl;
    text-orientation: mixed;
    color: #fff;
    font-size: 24px;
    font-weight: 400;
    line-height: 2.6;
    letter-spacing: 0.15em;
}

/* spanを縦書きの各列にする */
.hero-vertical .hero-copy span {
    display: block;
    white-space: nowrap;
    color: #fff;
	font-size: 21px;
}

/* WPBakeryが生成するpタグの調整 */
.hero-vertical .hero-copy p {
    margin: 0 !important;
    padding: 0;
    color: #fff;
}

.button-width button.vc_general.vc_btn3{
	width:250px;
	text-align:left;
}


/* Row間の余白を調整 */
.order-flow {
    position: relative;
    margin-bottom: 0 !important;
}

/* 2番目以降のRowの上部に余白を作る */
.order-flow + .order-flow {
    padding-top: 70px !important;
    position: relative;
}

/* 三角形を表示 */
.order-flow + .order-flow::before {
    content: "" !important;
    display: block !important;
    position: absolute;
    top: 24px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-top: 22px solid #050D35;
    z-index: 10;
    pointer-events: none;
}

/* テキストを上下中央揃え */
.order-flow .wpb_text_column > .wpb_wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex: 1;
}

/* カラムを横並びにして高さを揃える */
.order-flow > .thb-row-clip {
    display: flex !important;
    flex-wrap: wrap;
    align-items: stretch !important;
    gap: 0 !important;
    width: 100%;
}

/* カラム外側の余白を削除 */
.order-flow > .thb-row-clip > .wpb_column {
    display: flex !important;
    flex-direction: column;
    align-self: stretch !important;
    padding: 0px !important;
    margin: 0 !important;
}

/* カラム内側の余白を削除・高さを揃える */
.order-flow > .thb-row-clip > .wpb_column > .vc_column-inner {
    display: flex !important;
    flex-direction: column;
    flex: 1;
    width: 100%;
    padding: 20px !important;
    margin: 0 !important;
    box-sizing: border-box;
}

/* 内部コンテンツをカラムいっぱいに広げる */
.order-flow > .thb-row-clip > .wpb_column > .vc_column-inner > .wpb_wrapper {
    display: flex;
    flex-direction: column;
    flex: 1;
}

/* テキストブロックの高さを揃える */
.order-flow .wpb_text_column {
    display: flex;
    flex-direction: column;
    flex: 1;
    margin-bottom: 0 !important;
}

.order-flow .wpb_text_column > .wpb_wrapper {
    flex: 1;
}

/* PC：左25%、右75% */
@media (min-width: 768px) {
    .order-flow > .thb-row-clip > .medium-3 {
        flex: 0 0 25%;
        max-width: 25%;
    }

    .order-flow > .thb-row-clip > .medium-9 {
        flex: 0 0 75%;
        max-width: 75%;
    }
}

/* SP：縦並び */
@media (max-width: 767px) {
    .order-flow > .thb-row-clip > .wpb_column {
        flex: 0 0 100%;
        max-width: 100%;
    }
}


.single-post #wrapper [role=main]{
	background: #ECE9E4;
}

.post .post-category{
	display:none;
}


/* 画像とテキスト全体 */
.products-overlay > .vc_column-inner > .wpb_wrapper {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    aspect-ratio: 3 / 2;
    gap: 8px;
    overflow: hidden;
}

/* 背景となる画像 */
.products-overlay .wpb_single_image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
}

.products-overlay .vc_figure,
.products-overlay .vc_single_image-wrapper,
.products-overlay .vc_single_image-img {
    display: block;
    width: 100%;
    height: 100%;
}

.products-overlay .vc_single_image-img {
    object-fit: cover;
}

/* テキストを画像より前面に配置 */
.products-overlay > .vc_column-inner > .wpb_wrapper > .wpb_text_column {
    position: relative;
    z-index: 1;
    width: 100%;
    margin: 0;
}

/* テキストの余白 */
.products-overlay .wpb_text_column h6,
.products-overlay .wpb_text_column h3 {
    margin: 0;
    text-align: center;
}

body .vc_btn3-container.vc_btn3-left{
	text-align : right;
}


.vc_btn3-container.vc_do_btn .vc_btn3 {
  position: relative;
  padding-right: 75px !important;
}

/* 細く長い矢印 */
.vc_btn3-container.vc_do_btn .vc_btn3::after {
  content: "";
  position: absolute;
  right: 25px;
  top: 50%;
  width: 30px;
  height: 8px;
  border-bottom: 1px solid currentColor;
  border-right: 1px solid currentColor;
  transform: translateY(-75%) skewX(45deg);
  pointer-events: none;
}


.vc_btn3.vc_btn3-style-outline, .vc_btn3.vc_btn3-style-outline-custom, .vc_btn3.vc_btn3-style-outline-custom:focus, .vc_btn3.vc_btn3-style-outline-custom:hover, .vc_btn3.vc_btn3-style-outline:focus, .vc_btn3.vc_btn3-style-outline:hover{
	 border-width: 1px!important;
}

.white-text p, .white-text h1, .white-text h2, .white-text h3, .white-text h4, .white-text h5, .white-text h6, .white-text td, .white-text th, .white-text a{
	color:#ffffff!important;
}

body, .post.style9 .post-meta{
	font-family: "times-new-roman", "hiragino-mincho-pron", serif;
	font-weight: 300;
}

.header.hover{
	background-color:#F5F5F5;
}

.menu-item a{
	letter-spacing: 0.1em;
	font-family: "times-new-roman", "hiragino-mincho-pron", serif;
	font-weight: 300;
}

h1, h2, h3, h4, h5, h6{
	font-family: "times-new-roman", "hiragino-mincho-pron", serif;
	font-weight: 600;
}

h1, h2, h3, h4, h5, h6{
	letter-spacing: 1px;
	line-height: 1.6;
}


footer h1, footer h2, footer h3, footer h4, footer h5, footer h6{
	color:#fff;
	margin-bottom:0;
}


h1{
	font-size: 36px;
}

h2{
	font-size: 28px;
}

h3{
	font-size: 24px;
}

h4{
	font-size: 21px;
}

h5{
	font-size: 18px;
}

h6{
	font-size: 16px;
	color:#929292!important;
}

p{
	font-size:16px;
	line-height : 1.8;
}

li{
	font-size: 14px;
	line-height: 2;
}

footer p, .widget p, .widget{
	font-size: 16px;
}

label{
	font-size: 14px;
}

body .wpcf7-spinner{
	display:none;
}

body input[type="submit"], body .button, body .btn{
	border: 2px solid #000D3A;
	width:100%;
	background-color : #000D3A;
	height:60px;
	display : inline-block;
	line-height: 60px;
	text-align: center;
}

body input[type="submit"]:hover, body .button:hover, body .btn:hover{
	background-color: #D9DDE3!important;
	color: #222222;
	border: 2px solid #D9DDE3;
	opacity:1;
}

p:has(input[type="submit"]){
	text-align: center;
}

#sb_instagram .sb_instagram_header, .sb_instagram_header{
	padding: 0 0 12px 0;
}

body #sb_instagram #sbi_load .sbi_load_btn, body #sb_instagram .sbi_follow_btn a{
	color: #fff!important;
}

body .vc_btn3.vc_btn3-color-inverse.vc_btn3-style-outline{
	color: #111;
	border-color: #111;
	font-weight: 500;
	min-width:150px;
}

input[type="submit"].thb-border-style, .button.thb-border-style, .btn.thb-border-style{
	font-weight: 500;
}

body .vc_btn3.vc_btn3-color-inverse.vc_btn3-style-outline:focus, body .vc_btn3.vc_btn3-color-inverse.vc_btn3-style-outline:hover{
	border-color: #111;
	background-color: #111;
}

#mobile-menu .thb-close path{
	stroke: #fff;
}

#mobile-menu .menu-footer{
	color: #111111;
}

.thb-portfolio .type-portfolio.title-center .portfolio-link{
	background: rgba(211, 202, 178, 0.7);
}

#mobile-menu{
	background: #d3cab2;
}

.thb-mobile-menu a{
	color: #111111;
}

#scroll_to_top{
	border: 1px solid #777777;
}

#scroll_to_top svg{
	fill: #777777;
}

.pc{
	display: flex;
}

.sp{
	display: none!important;
}

.grecaptcha-badge{
	z-index:-9999;
}

.link_button{
	position : absolute;
	left : 0;
	bottom : 30px;
}

.link_button a{
	padding:20px;
	width:100%;
	max-width:300px;
}

.negative_area .link_button{
	bottom : -70px;
}

.link_button h3{
	color:#fff;
}

.link_green{
	background:#222222;
}

.link_khaki{
	background:#AA997A;
}

body .home-back, body .about-back{
	background-size: 700px !important;
    background-position: left 30px bottom 30px !important;
}


body .company-back{
	background-size: 700px !important;
    background-position: right 50px top 50px !important;
}

body .product-back{
	background-size: 700px !important;
    background-position: left 50px bottom 50px !important;
}

body .contact-back, body .news-back{
	background-size: 700px !important;
    background-position: right 50px top 50px !important;
}


.news-column .date, .news-column .dnews-title{
	line-height:30px;
}

.post.style9 .post-meta{
	font-size :16px;
}

.post.style9 h5{
	font-size :18px;
}

.page h1{
	font-size:40px;
	color:#ffffff;
	letter-spacing:20px;
}

table{
	table-layout: fixed;
}

table th {
  max-width: 30%;
	width:100%;
}

table tbody th, table tbody td{
	padding : 20px!important;
	background-color:transparent!important;
	border: 1px solid #ccc;
}

table:not(.variations):not(.shop_table):not(.group_table) tbody tr:nth-child(even){
	background-color:transparent;
}

table:not(.variations):not(.shop_table):not(.group_table) thead, table:not(.variations):not(.shop_table):not(.group_table) tbody, table:not(.variations):not(.shop_table):not(.group_table) tfoot{
	border: 1px solid #ccc;
	background-color:transparent;
}

.large-title h2{
	font-size:48px;
}

body .vc_btn3.vc_btn3-color-grey, body .vc_btn3.vc_btn3-color-grey.vc_btn3-style-flat {
    background-color: #222222;
    color: #fff;
	min-width: 300px;
}

body .vc_btn3.vc_btn3-color-grey:hover, body .vc_btn3.vc_btn3-color-grey.vc_btn3-style-flat:hover {
    background-color: #AA997A;
	color: #fff;
}

a{
	color:#222222;
}

a:hover{
	color:#AA997A;
}

.wpb_text_column a:after{
	 border-bottom: 1px solid #AA997A;
}

.thb-full-menu>li a{
}

.thb-full-menu>li a:hover{
	color:#AA997A!important;
}

a img:hover{
	opacity:0.5;
}

.footer.light .widget ul li a:before{
	background:#fff;
}

.link_area>div{
	position:relative;
}

.post-gallery.parallax{
	display:none;
}

.blog-container article{
	padding-top:100px;
}

.thb-mobile-menu li{
	padding-bottom:10px;
}

#mobile-menu .menu-footer{
	color:#fff;
}

.page a.instagram, .full-menu a.instagram, .post .post-content a.instagram{
	color:#222222;
}

.link_button h3 a:hover{
	opacity:0.5;
}

@media screen and (max-width: 768px) {
	.pc{
		display: none!important;
	}

	.sp{
		display: flex!important;
	}
	
	body .vc_custom_1762748711489{
		background-size: 500px !important;
		 background-position: center bottom !important;
	}
	.link_button{
		    margin-left: .625rem;
	}
	.negative-margin>div{
		margin-top: 0!important;
	}
	.post.style9 .post-meta{
		font-size:14px;
		margin-bottom:5px;
	}
	.post.style9 .post-title{
		font-size:16px;
	}
	
	.link_button h3{
		font-size: 18px;
	}
	.link_button{
		padding:15px 20px;
		width:auto;
		min-width: 200px;
	}
	body .home-back, body .about-back{
	background-size: 500px !important;
    background-position: left 30px top 30px !important;
}


body .company-back{
	background-size: 500px !important;
    background-position: right 50px top 50px !important;
}

body .product-back{
	background-size: 500px !important;
    background-position: left 50px top 50px !important;
}

 body .news-back{
	background-size: 500px !important;
    background-position: right 50px top 50px !important;
}
	
	
body .contact-back{
	background-size: 500px !important;
    background-position: right 50px bottom 50px !important;
}
	
	.footer.full-width-footer .row{
		width:83.33333%;
	}
	.page h1{
		font-size: 10vw;
		letter-spacing:0;
	}
	.large-title h2{
		font-size:36px;
	}
	body .short-bottom{
		padding-bottom:30px!important
	}
	
.link_button{
	left : 0;
	bottom : 30px;
	margin-left:0;
}

.negative_area .link_button{
	bottom : 30px;
}
	
	  .wpb_row.sp-reverse {
    display: flex !important;
    flex-direction: column-reverse !important;
  }
	
	.button-width button, .button-width button.vc_general.vc_btn3{
	width:100%;
}
	
    .hero-vertical .hero-copy {
        position: absolute;
        top: 50%;
        left: 50%;
        right: auto;
        transform: translate(-50%, -50%);
    }

    .hero-vertical .hero-copy .wpb_wrapper {
        font-size: 14px;
        line-height: 1.4;
    }
	
	    .hero-vertical .hero-copy .wpb_wrapper p{
        line-height: 1.4;
    }
	
}

@media screen and (max-width: 640px) {
}

@media only screen and (min-width: 90.0625em) {
}