@charset "UTF-8";
@import url("../simplicity/style.css");
@import url(http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:400,700);

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/


/*---------------------------
共通設定
---------------------------*/
html {overscroll-behavior: none;}

/*各項目の余白設定 */
.entry-content>*, .article p, .demo .entry-content p, .article dl, .article ul, .article ol, .article blockquote, .article pre, .article table, .article .toc, .body .article, .body .column-wrap, .body .new-entry-cards, .body .popular-entry-cards, .body .navi-entry-cards, .body .box-menus, .body .ranking-item, .body .rss-entry-cards, .body .widget, .body .author-box, .body .blogcard-wrap, .body .login-user-only, .body .information-box, .body .question-box, .body .alert-box, .body .information, .body .question, .body .alert, .body .memo-box, .body .comment-box, .body .common-icon-box, .body .blank-box, .body .button-block, .body .micro-bottom, .body .caption-box, .body .tab-caption-box, .body .label-box, .body .toggle-wrap, .body .wp-block-image, .body .booklink-box, .body .kaerebalink-box, .body .tomarebalink-box, .body .product-item-box, .body .speech-wrap, .body .wp-block-categories, .body .wp-block-archives, .body .wp-block-archives-dropdown, .body .wp-block-calendar, .body .ad-area, .body .wp-block-gallery, .body .wp-block-audio, .body .wp-block-cover, .body .wp-block-file, .body .wp-block-media-text, .body .wp-block-video, .body .wp-block-buttons, .body .wp-block-columns, .body .wp-block-separator, .body .components-placeholder, .body .wp-block-search, .body .wp-block-social-links, .body .timeline-box, .body .blogcard-type, .body .btn-wrap, .body .btn-wrap a, .body .block-box, .body .wp-block-embed, .body .wp-block-group, .body .wp-block-table, .body .scrollable-table, .body .wp-block-separator, .body .wp-block, .body .video-container, .comment-area, .related-entries, .pager-post-navi, .comment-respond {
	margin-bottom: 3.5em;
}
 .body .wp-block-image{
	margin:0;
}
.article h2, .article h3, .article h4, .article h5, .article h6 {
	margin-bottom:0;
	line-height:0.9;
}
.blank-box {
	border:none;
	border-radius: 0;
	padding:0;
}
.content-box; {
	box-sizing: content-box;
}
.entry-content {
	margin-top:0;	
}
.content {
	margin-top:0;
}

/*全体のコンテンツ幅 */
body .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width:100%;
}

/*フッター */
.footer {
	margin-top:0;
	padding-bottom:32px;
}
.footer p:first-child {
	margin-bottom:1em;
}

/*H1 */
.entry-content h1{
	border:none;
	background:none;
	padding: 0;
	font-weight:500;
	font-size:clamp(3.4em,12vw,78px);
	font-family: 'Alegreya Sans', sans-serif;
	letter-spacing: 0.18em;
}
.entry-title {
	margin:0;
}

/*H2 */
.entry-content h2{
	border:none;
	background:none;
	padding: 0;
	font-weight:500;
	font-size:clamp(3.4em,12vw,78px);
	font-family: 'Alegreya Sans', sans-serif;
	letter-spacing: 0.18em;
}


/*H3 */
.entry-content h3{
	font-weight:500;
	font-size:3em;
	margin-bottom:40px;
	border:0;
	padding:0;
	letter-spacing: 0.18em;
}

/*メイン設定 */
.main {
    padding: 0;
	background-color:#bcc3c6;
}

/*固定ページのタイトルを非表示 */
h1.entry-title{
display:none;
}

/*固定ページの日付を非表示 */
.date-tags {
display: none;
}

/*固定ページの投稿者名を非表示 */
.article-footer{
display: none;
}

/* ギャラリーの投稿者のホームボタン表示を非表示にする */
.breadcrumb {
   display:none;
}

/* トップへのボタン */
.go-to-top-button {
	border-radius:0;
}

/*---------------------------
Topページ設定
---------------------------*/
/*top全体設定 */		
.page-id-11 .header-container {
	background-color:rgba(0, 0, 0, 0 );
}

/*topページ余白削除 */
.body .article.post-11,.post-11 .wp-block-group,.post-11 .entry-content {
	margin-bottom:0;
}
.page-id-11 .body .wp-block-group {
	margin-bottom:0;
}

/*hero全体設定 */		
.hero {
	height:clamp(400px,75vw,950px);
	width:100%;
	background-image:url("https://ni-shiki.com/wp-content/uploads/2023/12/top_img.jpg");
	background-size:cover;
	background-position:center;
	padding:0;
}
.hero_container {
	display: flex;
	justify-content:center;
	align-items:center;
	height:100%;
}

/*hero内テキスト設定 */	
.hero_txt {
	width:clamp(150px, 24vw, 420px);
	border:1px solid #fff;
	padding:20px 5px ;
	background-color:rgba( 0, 0, 0, 0.2);
	display: grid;
	place-items:center;
	position:relative;
}
.hero_txt p {
	color:#fff;
	text-align:center;
	font-size:1.1em;
}

/*hero内矢印アイコン */	
.hero_txt::before{
	content:'';
	position:absolute;
	width: 30px; 
	height: 30px; 
	border-top: 2px solid #fff; 
	border-right: 2px solid #fff;
	display: block; 
	transform: rotate(135deg); 
	bottom:-10%;
}
.hero_txt::after{
	content:'';
	position:absolute;
	width: 30px;
	height: 30px; 
	border-top: 2px solid #fff; 
	border-right: 2px solid #fff;
	display: block; 
	transform: rotate(135deg); 
	bottom:-15%;
}

/*hero内ロゴ設定 */	
.body .wp-block-image.hero_logo {
	margin-bottom:20px;
}

/*ヘッダー(ナビゲーションバー)設定 */	
.header-container-in.wrap {
	width:100%;
}
.header-container {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  z-index: 10;
  background-color:rgba(0, 0, 0, 0);
}

#navi {
	background-color:rgba(0, 0, 0, 0);
}
.navi-in > ul {
	justify-content: right;
}
.navi-in > ul li {
	height:50px;
	letter-spacing:0.2em;
	width:min(9.5vw,170px);
}
.navi-in > ul .menu-item-has-description > a > .caption-wrap {
	height:60px;
}
.navi-in.wrap {
	width:100%;
	margin:0;
	padding-right:20px;
} 

/*ナビゲーションバー_ボタンデザイン */	
#navi .navi-in a {
  position: relative;
}

#navi .navi-in a::after {
  position: absolute;
  color: #E5FF31;
  bottom: 0;
  left: 0;
  display: block;
  content: "";
  width: 100%;
  height: 2px;
  background:#E5FF31;
  transform: scaleX(0);
  transition: transform 0.4s;
}
.navi-in > ul .menu-item-has-description > a > .caption-wrap {
	height:auto;
}

.navi .item-label{
	opacity:1;
	font-size:min(1vw,13px);
	padding-top:20px;
	font-weight:300;
}
.sub-caption {
	opacity:0.7;
	font-size:min(1.3vw,16px);
	font-family: "Noto Sans JP", sans-serif;
	height:100%;
}

/*ナビゲーションバー_ボタン_ホバー設定 */	
#navi .navi-in a:hover {
  background-color: rgba(255,255,255,0.7);
  transition: all 0.3s ease-in-out;
  color: #000;
}
#navi .navi-in a:hover::after {
  transform: scaleX(1);
  transition: transform 0.3s;
}

/*サイトタイトル非表示 */	
.site-name-text {
	display:none;
}

/*ナビゲーションバー_スクロールで半透明 */	
.transform {
	 background: rgba(0,0,0,0.5)!important;
}

.transform-page {
	 background: rgba(255,255,255,0.8)!important;
}

/*モバイル版ヘッダー(ナビゲーションバー)設定 */	
.search-menu-button {
	display:none;
}

.mobile-menu-buttons .menu-caption {
	display:none;
}

/*---------------------------
Topページ内Info欄設定
---------------------------*/
/*info全体設定 */	
.info {
	display:flex;
	gap:1vw;
	margin:0 auto ;
	max-width:1000px;
	margin-bottom:1em;
}
.body .blank-box .info {	
	margin-bottom:1em;
}

.info_container {
	position:relative;
	padding-bottom:40px;

}

/*info白背景部分 */
.info_container::before {
	content:'';
	display: block;
	position: absolute;
	top: 40px;
	right: 0;
	width:80%;
	height: 100%;
	background-color:#f8f9fa;
	z-index:-10;
}

/*info項目タイトル設定 */	
.info_title {
	width:min(90%,1450px);
	margin-left: auto;
    margin-right: 100px;
	position:relative;
}

.info_title::before {
	content: '';
	position:absolute;
	width: min(1000px,90%);
	height: 1px;
	background: #262626;
	margin-top: 30px;
	top:125%;
	left:-30%;
}
.info_title_comment {
	display: block;
	width:min(90%,1450px);
	margin-top:0;
	margin-right:100px;
	margin-bottom:clamp(40px,4.5vw,60px);
	margin-left: auto ;
	font-size:1.5em;
	letter-spacing: 0.8em;
}
.info-h3 {
	font-weight:300;
	font-size:0.8em;
}
.article h3.info_main.ourteam{
	line-height:0.95em;
}

.info_txt{
	padding:2vw;
	width:60%;
}

/*infoサンプルイラスト設定 */	
.info_img {
	display:grid;
	grid-template-columns: minmax(auto,200px) 50px auto;
	grid-template-rows: auto 150px auto;
	justify-content:space-between;
	
}
.info_img1 {
	grid-column: 1/ -2;
	grid-row: 1/ -2;
}
.info_img1 img, .info_img2 img {
	box-shadow: 7px 4px 16px -11px rgba(0,0,0,0.2);
}
.info_img2 {
	grid-column: 2/ -1;
	grid-row: 2/ -1;
}
.body .blank-box .info.other {
	flex-direction: row-reverse;
	margin-bottom:3.8em;
}

/*---------------------------
Topページ内sample欄
---------------------------*/

.sample_container {
	text-align:center;
	padding-top:3.5em;
}
.sample_title_comment {
	display:block;
	margin-bottom:calc(2/3*(clamp(40px,4.5vw,60px)));
	font-size:1.5em;
	letter-spacing: 0.8em;
}
.sample_gallery {
	margin-bottom:clamp(40px,4.5vw,60px);
}

/*---------------------------
Topページ内about欄
---------------------------*/
/*about全体設定 */	
.about {
max-width:1000px;
margin: 0 auto;
background-color:#fff;
padding:clamp(40px,4.5vw,60px);
padding-bottom:calc(2*(clamp(40px,4.5vw,60px))); 
	text-align:center
}
.about_title_comment {
	display:block;
	margin-bottom:calc(2/3*(clamp(40px,4.5vw,60px)));
	font-size:1.5em;
	letter-spacing: 0.8em;
}
.about_wrap {
 background-color:#66696b;
 background-size:  cover; 
 padding-top:clamp(40px,4.5vw,60px);
 padding-bottom:calc(2*(clamp(40px,4.5vw,60px))); 
}
.about_contents {
	display:flex;
	justify-content:space-between;
}
.about_content {
	width:46%;
	display:grid;
	place-items:center;
	grid-template-rows: auto 1fr;
}

/*about余白削除 */	
.body .blank-box.about_content {
	margin:0;
}

/*about内_名前 */	
.article p.about_name {
	font-size:1.8em;
	margin-bottom:0;
}

/*about内説明リスト */	
.about_contents dl div {
	display: flex;
	justify-content:flex-start;
	text-align:left;
	padding-bottom:4px;
}
.about_contents div dt {
	width:5.5em;
	padding-bottom:4px;
	position:relative;
	z-index: 0;
}
.about_contents div dt::before {
	display:block;
	content: '';
	height:10px;
	width:100%;
	background-color:#CCDBE2;
	position:absolute;
	top:14px;
	z-index:-1;
}
.about_contents div dd {
	width:70%;
}

/*---------------------------
Topページ内ボタンデザイン
---------------------------*/
.wp-block-button__link{
	display:block;
	border: 2px solid  #707070;
	background-color:rgba(0,0,0,0);
	border:1px solid #262626;
	font-size:0.95em;
	position: relative;
	width:min(80vw,300px);
	color:#383838;
	 transition: .4s;
}
.wp-block-button__link::before {
	content: "";
	display: block;
	width: 60px;
	height: 1px;
	background: #262626;
	position: absolute;
	top: 0;
	bottom: 0;
	right: -30px;
	margin: auto;
	 transition: .4s;
}

/*ボタン_ホバー設定 */	
.wp-block-button__link:hover{
	background-color:#66696b;
	color:#fff;
}
.wp-block-button__link:hover::before {
	background-color:#E5FF31;
}

/*---------------------------
ギャラリー設定
---------------------------*/
/* ギャラリーページ余白削除 */
.body .article.post-404,.post-404 .wp-block-group,.post-404 .entry-content {
	margin-bottom:0;
}
.page-id-404 .block-box {
	margin:0;
}

/* ギャラリーページナビゲーションバー設定 */
.page-id-404 .header-container {
	position:sticky;
	background-color:#bcc3c6;
}

/* ギャラリー_モバイル版ナビゲーションバー設定 */
.mobile-menu-buttons {
	background-color:rgba(0, 0, 0, 0);
	box-shadow:0 0 0 0;
}
.mobile-menu-buttons .menu-button > a  {
		display:none;
}

/* ギャラリーページ全体設定 */
.page-id-404 h2 {
	font-size:clamp(3em,4.5vw,50px);
	white-space: nowrap;
} 
.page-id-404 .entry-content h3{
	margin-bottom:0;
}

/*---------------------------
ギャラリーページヘッダー
---------------------------*/
/* ギャラリーページヘッダー設定 */
.gallery_header {
	display:grid;
	grid-template-columns: minmax(6em,1fr) minmax(40vw,800px) minmax(40vw,800px);/*ヘッダー3分割 */
	grid-template-rows:auto;
	height:200px;
	position:fixed;
	top:45px;
	z-index:200;
	letter-spacing:0.2em;
	width:100%;
}
.gallery_header p {
	margin:0;
}

/* カラム①_ギャラリーページタイトル */
.gallery_title {
	grid-column:1 / 2;
	grid-row: 1 / -1;
	z-index:100;
	padding-left:2vw;
}
.gallery_title_h2 {
	position:relative;
}
.gallery_title_h2::before {
	content:'';
	height:1px;
	width:calc(4 * (clamp(1.8em,4.5vw,50px)));
	background-color:#666;
	position:absolute;
	left:-4vw;
	top:110%;
	z-index:10;
	overflow-x: hidden;
}
.gallery_title p {
	font-size:1.2em;
	font-weight:500;
	white-space: nowrap;
	letter-spacing: 0.8em;
}

/* カラム②_ギャラリーページヘッダー左 */
.gallery_l_wrap {
	grid-column:2 / -2;
	grid-row: 1 / -1;
	height:200px;
	filter: drop-shadow(2px 4px 5px rgba(0, 0, 0, 0.2));
}
.gallery_l {
	background-image: url("https://ni-shiki.com/wp-content/uploads/images/gallery_header_l.png");
	background-size:  cover;
	background-position: right 30%;
	color:#000;
	display:flex;
	justify-content:flex-end;
	align-items:center;
	font-size:clamp(1em,2.5vw,1.8em);
	font-weight:300;
	padding-right:1em;
	font-family: 'Alegreya Sans', sans-serif;
	letter-spacing:0.2em;
	width:100%;
	height:100%;
	clip-path: polygon(0% 0%, 100% 0%, 100% 75%, 55% 75%, 50% 90%, 45% 75%, 0% 75%);
}

/* カラム③_ギャラリーページヘッダー右 */
.gallery_r_wrap {
	grid-column:-2 / -1;
	grid-row: 1 / -1;
	height:200px;
	filter: drop-shadow(2px 4px 5px rgba(0, 0, 0, 0.2));
}
.gallery_r {
	background-image: url("https://ni-shiki.com/wp-content/uploads/images/gallery_header_r.png");
	background-size:  cover;
	background-position: left 25%;
	margin:0;
	color:#fff;
	display:flex;
	justify-content:flex-start;
	align-items:center;
	font-size:clamp(1em,2.5vw,1.8em);
	font-weight:300;
	padding-left:1em;
	font-family: 'Alegreya Sans', sans-serif;
	letter-spacing:0.2em;
	width:100%;
	height:100%;
	clip-path: polygon(0% 0%, 100% 0%, 100% 75%, 55% 75%, 50% 90%, 45% 75%, 0% 75%);
}
/* 外部ポートフォリオ_リンクボタン */
.portfolio {
	grid-column:2 / -1;
	grid-row: 1 / -1;
	z-index:500;
	display:flex;
	justify-content:center;
	align-self:end;
	padding-bottom:20px;
	width:100%;
}

.portfolio_link .wp-block-button__link{
	border: solid 1px #fff;
	padding:8px 16px 9px 10px;
	letter-spacing:0;
	background-color:#bcc3c6;
	width:250px;
	text-align:center;
	position:relative;
	font-size:13px;
	font-weight:600;
	line-height:1;
}
.portfolio_sub {
	font-size:11px;
	font-weight:400;
}

.portfolio_link .wp-block-button__link::before{
	display:none;	
}

.portfolio_link .wp-block-button__link::after{
	display:block;
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-color: transparent transparent transparent #e5ff31;
	border-width: 7.5px 0px 7.5px 12.99px;
	position:absolute;
	right:10px;
	top:50%;
	transform: translateY(-50%);
	transition: .4s;
}
.portfolio_link .wp-block-button__link:hover::after{
	border-color: transparent transparent transparent #fff;
}


/*---------------------------
ギャラリーサムネイル欄
---------------------------*/
/* ギャラリーサムネイル一覧設定 */
.page-id-404 .block-box.gallery_contents:first-child {
		margin-top:140px;
} 
.gallery_contents {
	display:grid;
	grid-template-columns: minmax(6em,1fr) minmax(40vw,800px) minmax(40vw,800px);/* 項目名・一覧①・一覧② */
	grid-template-rows:auto;
}
.gallery_contents > * {
	padding:8% 6% calc(8% - 20px) 6%;
}
.gallery_contents.rough .gallery_group_r,.gallery_contents.rough .gallery_group_l {
	padding-bottom:12%;
}

/* ギャラリーサムネイル一覧背景 */
 .post-117 {
	background: linear-gradient(to right, #f5f5f5 0%, #f5f5f5 50%, #c0c0c0 50%, #c0c0c0 100%);
}

/* ギャラリー項目名 */
.gallery_contents_title {
	position:sticky;
	top:245px;
	z-index:2;
	align-self: start;
}
.gallery_contents h3 {
	text-align:right;
	font-size:1.1em;
	font-weight:500;
	letter-spacing: 0.4em;
	padding:12px 0;
}

/* ギャラリーサムネイル一覧①(左) */
.gallery_group_l {
	grid-column:2 / -2;
	grid-row: 1 / -1;
	background-color:#f4f4f4;
	position:relative;
}

/* ギャラリーサムネイル一覧②(右) */
.gallery_group_r {
	grid-column:-2 / -1;
	grid-row: 1 / -1;
	background-color:#5e5e5e;
}
/* ギャラリーサムネイル区切り線 */
.gallery_group_l::before {
	content:'';
	height:1px;
	width:190%;
	overflow-x:hidden;
	background-color:#aaa;
	position:absolute;
	left:10px;
	bottom:-5px;
	z-index:10;
}
.gallery_group_l.gallery_other_l::before {
	 content: none;
}

.fg-default.fg-gutter-20 {
	margin-bottom:0px;
}
.gallery_group_r p,.gallery_group_l p {
	padding-left:20px;
	display:block;
	margin-bottom:0;
}
.gallery_group_l .gallery_link {
	padding-right: 20px;
}

/*---------------------------
お問い合わせページ設定
---------------------------*/
/* お問い合わせページ全般設定 */
body.public-page.page-id-193,
body.public-page.page-id-1075,
body.public-page.page-id-1141{	
	background:linear-gradient(90deg,#cbd2d6 0%,#cbd2d6 10%,#fff 10%,#fff 100%);
}
.page-id-193 #navi .navi-in a,
.page-id-1075 #navi .navi-in a,
.page-id-1141 #navi .navi-in a{
	color:#383838;
}
.page-id-193 .main,
.page-id-1075 .main,
.page-id-1141 .main{
	 background-color:rgba(0,0,0,0);
}
.post-193,
.post-1075,
.post-1141{
	padding:45px 4% 45px 4%;
}
.main .post-193{
 background-color:rgba(0,0,0,0);
}
.main .post-1075,
.main .post-1141{
background-color:#ffffff99;
}

.article.post-193,
.article.post-1075,
.article.post-1141{
	margin-bottom:0;
}

.post-193 h2{
	font-size:clamp(1.4em,2.6vw,30px);
	margin-bottom:80px;
	font-family: "Noto Sans JP";
}

.post-1075 h2,
.post-1141 h2{
	font-size:1.5em;
	margin-bottom:80px;
	font-family: "Noto Sans JP";
}
.contact_button {
	display:grid;
	place-items: center;
}

/* お問い合わせページタイトル */
.contact_title {
 padding-left:2vw;	
 margin-left: calc(50% - 50vw);	
}
.entry-content h1.contact_title_h1 {
	position:relative;
	font-size:clamp(3em,4.5vw,50px);
	line-height: 0.9;
}
.contact_title_h1::before {
	content:'';
	height:1px;
	width:calc(4 * (clamp(1.8em,4.5vw,50px)));
	background-color:#666;
	position:absolute;
	left:-4vw;
	top:110%;
	z-index:10;
	overflow-x: hidden;
}
.title_sub {
	font-size:1.2em;
	font-weight:500;
	white-space: nowrap;
	letter-spacing: 0.8em;
}
.post-193 h2.form_title {
	margin-bottom:60px;
}

/* お問い合わせフォーム設定 */
.blank-box.contact_form_wrap {
	margin-bottom:7em;
}
.smf-form .smf-item .smf-text-control__control,.smf-form .smf-item .smf-textarea-control__control,.smf-form .smf-item .smf-select-control__control{
	background-color:#f8f8fa!important;
	border-radius:0;
}

/*送信完了画面*/
.smf-form.smf-form--simple-table .smf-complete-content  {
	position: relative;
	background-color:#f8f8fa;
	padding:16px 32px 32px 32px;
}
/*送信完了画面_チェックマーク*/
.smf-form.smf-form--simple-table .smf-complete-content::after{
	content: "";
    display: block;
    position: absolute;
    top:48px;
    left:20px;
	width: 20px;
    height: 10px;
    border-left: 3px solid #383838;
    border-bottom: 3px solid #383838;
    transform: rotate(-45deg);
}
.smf-form.smf-form--simple-table .smf-complete-content::before{
	content: "";
    display: block;
    position: absolute;
    top: 38px;
    left: 12px;
  width: 35px;
  height: 35px;
  background: #e5ff31;
  border-radius: 50%;
}
.smf-complete-content p.has-background{
	padding:26px;
}
.complete_message.article p{
	margin-bottom:0;
}

/*確認・送信ボタン設定*/
.smf-action .smf-button-control__control {
	width: 260px;
  height: 60px;
	background-image: none;
	background-color:#383838;
	border: none;
	color: #fff;
	border-radius:0;
	transition: all  0.3s ease ;
}

.smf-button-control .smf-button-control__control:not([data-action="back"]):hover {
	opacity: 0.6;
}
/*戻るボタン設定*/
.smf-action .smf-button-control__control[data-action="back"] {
	  background:#ddd ;
	  color: #333;
}
.smf-button-control .smf-button-control__control[data-action="back"]:hover {
	opacity: 0.6;
}
/*ボタン余白消去*/
.smf-form--simple-table + .smf-action {
	margin-top:0;
}
/*必須・任意ラベル*/
.smf-item__label__text {
	display:flex;
	align-items:center;
	gap:5px;
}
.smf-item__label__text .has-inline-color {
	letter-spacing:4px;
	padding:4px 0 4px 4px ;
}

.snow-monkey-form {
	margin-bottom:3.5em;
}

/* 依頼の流れフローチャート設定 */
.flowchart {
display:grid;
grid-template-columns:  repeat(auto-fit, minmax(100px, 1fr));
gap:20px 10px;
}
.flow {
	display:flex;
	flex-direction:column;
	align-items:center;
	padding: 10px 10px 30px 10px;
	}
.body .blank-box .flow {
	margin-bottom:0;
	position:relative;
}
.flow  h3 {
font-size:clamp(1.4em,1.5vw,18px);
margin-bottom:20px;
}

/* フローチャート_装飾 */
.contact_sub {
	position:relative;
}
.contact_sub::before {
	display:block;
	content: "";
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background-color:#E5FF31;
	position:absolute;
	left:50%;
	top:-50%;
    transform: translateY(-50%) translateX(-50%);
	z-index:30;
}
.flow:not(:last-child)::before {
	display:block;
	content: "";
	width: 100%;
	height: 1px;
	background-color:#666;
	position:absolute;
	left:50%;
	top:-5px;
	z-index:20;
}

.article p.flowchart_notes {
	margin-bottom:calc(2 * 3.5em);
}

.contact_attention {
	padding:1em;
}

p.has-background.flow_memo {
	border-left:6px solid #E5FF31;
	padding-left:min(50px,4vw);
}
/* 依頼の流れフローチャート設定2 */
body.public-page.page-id-1225{	
	background:linear-gradient(90deg,#cbd2d6 0%,#cbd2d6 10%,#fff 10%,#fff 100%);
}
.page-id-1225 #navi .navi-in a{
	color:#383838;
}

.page-id-1225 .main{
	 background-color:rgba(0,0,0,0);
}

.post-1225{
	padding:45px 4% 45px 4%;
}
.main .post-1225{
 background-color:rgba(0,0,0,0);
}

.article.post-1225{
	margin-bottom:0;
}

.post-1225 h2{
	font-size:clamp(1.8em,2.8vw,34px);
	margin-bottom:80px;
	font-family: "Noto Sans JP";
}
.post-1225 h3{
	font-size:clamp(1.3em,1.5vw,23px);
	margin: 30px 0 50px 0 ;
	font-family: "Noto Sans JP";
}
.flow_tab_order {
	margin-bottom:0;
}

.flowchart_order {
	display:grid;
	gap:20px 10px;
	position:relative;
}
.body .blank-box .flow_order {
	margin-bottom:0;
	position:relative;
}

.flow_order {
	display:grid;
	grid-template-rows: 35px auto;
	grid-template-columns: 140px auto;
	grid-auto-flow: column;
	padding: 20px 20px 0px 40px;
	}

.flow_order  h3 {
	font-size:clamp(1.2em,1.5vw,18px);
	margin-bottom:20px;
	margin-top:0;
}

.flow_txt_order {
	grid-column: 2 / 3;
    grid-row: 1 / 3;
	padding-top:30px;
}


.smb-tab-panel{
	padding:50px 30px 60px 70px;
}

/* フローチャート_装飾2 */
.order_sub {
	position:relative;
}
.order_sub::before {
	display:block;
	content: "";
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background-color:#E5FF31;
	position:absolute;
	left:-35%;
	top:5px;
	z-index:30;
}
.flow_order:not(:last-child)::before {
	display:block;
	content: "";
	width: 1px;
	height: 120%;
	background-color:#666;
	position:absolute;
	left:6px;
	top:30%;
	z-index:20;
}

.article p.flowchart_notes {
	margin-bottom:calc(2 * 3.5em);
}

.contact_attention {
	padding:1em;
}

p.has-background.flow_memo {
	border-left:6px solid #E5FF31;
	padding-left:min(50px,4vw);
}




	/* タブ設定 */
.smb-tab-panel{
	background-color: #ffffff;
	border-right:none;
	border-left:none;
	border-bottom:none;
	padding-top:min(60px,4vw);
}
.smb-tabs[data-orientation="horizontal"] > .smb-tabs__tabs .smb-tabs__tab {
	font-size:1em;
}
.smb-tabs[data-orientation="horizontal"] > .smb-tabs__tabs .smb-tabs__tab[aria-selected="true"] {
	border-top: 3.5px solid #E5FF31;
}


/*---------------------------
新ポートフォリオページ設定
---------------------------*/
.page-id-1482 #navi .navi-in a{
	color:#383838;
}
.wp-block-separator {
	border-top: 0;
}
.entry-content h1.portfolio_title_h1 {
	position:relative;
	font-size:calc(1.3 * (clamp(3em,4.5vw,50px)));
	line-height: 0.9;
}
.portfolio_title_h1::before {
	content:'';
	height:1px;
	width:calc(4 * (clamp(1.8em,4.5vw,50px)));
	background-color:#666;
	position:absolute;
	left:-4vw;
	top:110%;
	z-index:10;
	overflow-x: hidden;
}

/* 保護マーク非表示*/
.grecaptcha-badge { visibility: hidden; }
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
	
/*---------------------------
ナビゲーションバー設定
---------------------------*/
	.mobile-header-menu-buttons  {
		align-items:center;
	}
	.fa-close {
		font-size:0.5em;
	}
	.mobile-menu-buttons .menu-icon{
		font-size:1.6em;
	}
	.menu-content {
		background-color:#6a7275cc;
	}
	.menu-drawer a {
	color:#fff;		
		}
	.menu-close-button {
	padding-top: 15px;
 	padding-left: 25px;
	padding-bottom: 30px;
	color:#fff;	
	text-align: left;
	font-size: 1.3em;
	}
/*---------------------------
Topページ設定 	
---------------------------*/	
/* hero内ロゴ設定 */
	.hero_logo {
		width:max(70px,20vw);
	}
/* about設定 */
	.about_contents {
		flex-direction: column;	/* 自己紹介を縦並びに */
		gap:50px;
	}
	.about_content {
		grid-template-columns:1fr 2fr;
		width:100%;
		align-items: start;
	}

/*---------------------------
ギャラリー設定 	
---------------------------*/	
/* ギャラリーヘッダー設定 */
	.gallery_header {
		grid-template-columns:repeat(2, 1fr);
		width:100%;
		position:fixed;
		top:0;
		height:120px;
	}
	.gallery_title {
		grid-column:1 / -1;
		justify-self:center;
		color:#fff;
		padding-top:10px;
		text-align:center;
		mix-blend-mode: difference;
	}
	.gallery_title_h2::before {
		display:none;
	}	
	.gallery_l_wrap {
		grid-column:1 / 2;
	}
	.gallery_r_wrap {
		grid-column:2 / -1;
	}
	.gallery_l,.gallery_r {
		clip-path: polygon(0% 0%, 100% 0%, 100% 75%, 55% 75%, 50% 83%, 45% 75%, 0% 75%);/* 吹き出し修正 */
	}		
	.gallery_contents {
		grid-template-columns: 1fr 1fr;/* 項目名とサムネイル一覧を2段に */
		grid-template-rows:40px auto;
	}
	.page-id-404 .block-box.gallery_contents:first-child {
		margin-top:90px;
	}
	
	.portfolio {
	grid-column:1 / -1;
	padding-bottom:55px;
	}
	.portfolio_link .wp-block-button__link{
	font-size:0.8em;
	padding:4px 10px 4px 8px;
	}
	.portfolio_sub {
	font-size:0.75em;
	}
	.portfolio_link .wp-block-button__link::after{
	border-width: 5.5px 0px 5.5px 9.53px;
	}
	
/* ギャラリー項目名 */
	.gallery_contents_title {
		grid-column: 1 / -1;
		grid-row: 1/ 2;
		background-color:#bcc3c6;
		display:block;	
		top:150px;
	}
	.gallery_contents h3.gallery_contents_title  {
		text-align:center;
	}
	
/* ギャラリーサムネイル一覧①(左) */
	.gallery_group_l {
		grid-column: 1 / 1;
		grid-row: 2 / -1;	
	}

/* ギャラリーサムネイル一覧②(右) */
	.gallery_group_r {
		grid-column: 2 / -1;
		grid-row: 2 / -1;		
	}

/* 区切り線非表示 */
	.gallery_group_l::before {
		display:none;
	}

/*---------------------------
コンテンツページ設定 	
---------------------------*/	
	.post-193,.post-1225 {
		padding-top:0;
	}	

/*---------------------------
お問い合わせページ設定 	
---------------------------*/	
	.flowchart {
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: repeat(2, 1fr);
		gap:5vw;
	}
	.flow {
		background-color:#f4f6f899;
	}	
	
	.flow:not(:last-child)::before {
		display:none;
	}
	
	.flow_txt{
		display:grid;
		justify-items: left;
		align-items: center;
		width:100%;
		padding:0.5em;
		position: relative;
	}
	.flow::after {
	display:block;
	content: '';
	width: 12px;
	height: 12px;
	border: 0;
	border-top: solid 3px #8f989c;
	border-right: solid 3px #8f989c;
	transform: rotate(45deg);
	position: absolute;
	top: 95px;
	right:-7%;
}
	.flow:nth-child(2n)::after,.flow:last-child::after{
		display:none;
	}
	
	}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
	
/*---------------------------
全体設定 	
---------------------------*/
	main.main {
		padding:0;
	}

/*---------------------------
Info設定 	
---------------------------*/
	.info {
		display:block;
		padding:0 16px;
	}

	.info_title::before {
		left:0;	
	}	
	.info_container::before {
		top:2%;
	}	
	.info_img {
		margin: 0 auto;
		grid-template-columns: minmax(auto,40vw) 24px auto;
		grid-template-rows: auto 28vw auto;
	}
	.info_txt {
		width:100%;
	}	

/*---------------------------
about設定 	
---------------------------*/
	.about_content {
		grid-template-columns:1fr;
	}
	
/*---------------------------
ギャラリーページ設定 	
---------------------------*/
.gallery_group_r,.gallery_group_l {
	padding-bottom:12%;
}

/*---------------------------
依頼の流れページ設定 	
---------------------------*/
	.smb-tabs[data-orientation="horizontal"] > .smb-tabs__tabs	{
		flex-wrap: wrap;
	}
	.smb-tabs__tab{
		background-color:rgba(0,0,0,0);
		width:150px;
	}
	.smb-tabs__tab[aria-selected="true"]{
		border-color: rgba(0,0,0,0);
		background-color:#ebeef0;
	}
	
	.smb-tab-panel{
		background-color: #ffffff73;
		padding:16px;
	}
	.smb-tabs__tab{
		width:150px;
	}
	smb-tabs[data-orientation="horizontal"][data-tabs-justification="center"] > .smb-tabs__tabs {
		justify-content: start;}
	
	.flow_order {
	display:grid;
	grid-template-rows: repeat(4, auto);
	grid-template-columns: auto;

	grid-auto-flow: column;
	padding: 20px 20px 0px 30px;
	}
	
 .flow_txt_order {
	grid-column: 1 / 1;
    grid-row: 3 / 4;
	margin:0;
}
	.flow_tab_order {
 	margin-bottom: 3.5em;
}
	.order_sub::before {
	display:block;
	content: "";
	width: 15px;
	height: 15px;
	border-radius: 50%;
	background-color:#E5FF31;
	position:absolute;
	left:-22px;
	top:8px;
	z-index:0;
}
.flow_order:not(:last-child)::before {
	display:none;
}
	
/*---------------------------
お問い合わせページ設定 	
---------------------------*/
	.message_form {
 		width 80%;
	}
	.contact_sub::before {
		top:-40%;
		width:10px;
		height:10px;
		border-radius: 0;
	}
	.flowchart {
		grid-template-columns: 1fr;
		grid-template-rows: repeat(4, 1fr);
		gap:11vw;
	}
	.flow{
		padding-bottom:20px;
	}
	.flow::after {
	height: 30px;
    width: 100%;
    clip-path: polygon(0 0,50% 100%,100% 0);
    background-color:#f4f6f899;
	transform: rotate(0deg);
	border:none;
	left: 0;
	top:100%;
	}

	.flow:not(:last-child):nth-child(2n)::after{
		display:block;
	}
	
	/* 送信確認画面_ボタンの余白削除 */
	.smf-action .smf-button-control + .smf-button-control {
		margin-left:0;
	}
	.smf-action {
		display:grid;
		gap:20px;
	}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/	

/*---------------------------
全体設定 	
---------------------------*/
	.container .blank-box {
		margin:0;	
	}	
	.page-id-11.body .block-box.hero_txt,.page-id-11.body .info .block-box :last-child {
		margin-bottom:1em;
	}
/*---------------------------
info設定 	
---------------------------*/
	.info_img {
		display:flex;
		flex-direction: column;
		 align-items: center;
	}
	.body .blank-box.sample_gallery {
		margin-bottom:3.5em;
	}
/*---------------------------
お問い合わせ設定 	
---------------------------*/
	.block-box.contact_title,
	.container .blank-box.contact_button{
		margin-bottom:2em;
	}	
	  .container .blank-box.flowchart {
		margin-bottom:50px;
	}
	.contact_sub::before {
		top:-20%;
}