@charset "utf-8";
/*
ブレイクポイントは標準のLightningテーマおよびBootstrapの理念に基づき
$sm-min: 576px;
$md-min: 768px;
$lg-min: 992px;
$xl-min: 1200px;
となっているのでそれに準じてください。
*/
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  general　全体的な設定
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
:root{
	--padding-y:15px; /* 両サイドの余白の数値 */
	--padding-ny:-15px; /* ネガティブ　数値 */
	--head-xl:30px;
	--head-l:24px;
	--head-m:18px;
	--head-s:18px;
	
 *  general　全体的な設定
}
/* ヘッダー */
header#site-header {
    height: 60px;
    overflow: hidden;
}
div#site-header-container {
    height: 60px;
}
div#header-top {
    height: 60px !important;
}
/* *  general　全体的な設定*/

#site-header-container {
	min-width:auto;
}

/*ヘッダー言語切り替え*/
.header-top {
	display:block!important;
	right:60px!important;
	min-width:auto;
}
.header-top nav {
	right:0;
}
.header-top ul {
	flex-direction:column;
}

/*ハンバーガーメニュー*/

#vk-mobile-nav.vk-mobile-nav-open {
	top:0;
}
.vk-mobile-nav-menu-btn.menu-open {
	background: var(--vk-menu-acc-icon-close-white-bg-src) center 50% no-repeat rgb(19 66 167 / 90%) !important;
}

/*タイムライン*/
.timeline-2column {
    --time-width:120px;
}

#vk-mobile-nav-menu-btn {
	right: 0;
	height:60px;
	width:60px
}

/* style.cssに移設 */
/* ul#mobile-nav {
	list-style:none;
	padding-left:0;
}
ul#mobile-nav li {
	border-bottom:1px solid #fff;
	padding:20px 0;
	margin:0;
}
#vk-mobile-nav a {
	display:block;
	position:relative;
	font-size:18px;
}
#vk-mobile-nav a:before {
	content:"\f061";
	font-family: "Font Awesome 6 Free";
    font-weight: 900;
	color:#fff;
	position:absolute;
	right:0;
	top:50%;
	transform: translateY(-50%);
} */

.site-header-logo img {
	margin-left:unset!important;
	width:80%!important;
}
.site-header-container {
	display:flex!important;
	align-items:center;
}


/*ボタン*/
.wp-block-buttons.is-content-justification-left {
	flex-wrap:wrap!important;
}

.wp-block-buttons>.wp-block-button,
.is-style-jw-button-normal .vk_button-width-50{
	width:100% !important;
}
/* .wp-block-buttons>.wp-block-button.wp-block-button__width-50 {
    width: 100%;
} */

.jw-pageheading figure.wp-block-image {
    max-width: 100%;
}
/*****選択ページリスト*****/
.wp-block-vk-blocks-select-post-list .vk_post .vk_post_title {
	font-size:var(--text-m);
}


/* レイアウト */
.jw_relayout {
    display: flex;
    width: 100%;
    flex-direction: column;
    padding: var(--padding-y);
    align-content: center;
	padding-top:0;
	overflow:hidden;
}

figure.wp-block-gallery.footer-cardlist {
	gap:20px;
}
.wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) {
	width:calc(50% - 10px);
}

/* トップムービー */
div#main-visual {
    min-height: 70vh !important;
}
/*TOP日本溶接協会について*/
.sp-layout figure.wp-block-image img {
	position:absolute!important;
	top:0;
	left:0;
	z-index:1;
}
.sp-layout #top-aboutus.column-out-left {
	transform: translateY(5%);
	margin-bottom:calc(10% + 60px);
}



.main-section.main-section--col--two,
.main-section:not(.main-section--col--two) {
	width:100%;
	margin: 0;
}

.wp-block-vk-blocks-outer.vk_outer-width-normal.vk_outer-bgPosition-normal { 
	margin-left: var(--padding-ny) !important;
    margin-right: var(--padding-ny) !important;
    padding-left: var(--padding-y) !important;
    padding-right: var(--padding-y) !important;
}

.sub-section.sub-section--col--two {
    position: static;
    width: calc(100% + var(--padding-y) + var(--padding-y) );
    margin-left: var(--padding-ny);
}
#menu-nested-pages {
    padding: 20px var(--padding-y);
}
.site-body-container.container{
    display: block;
    padding-left: 0;
    padding-right: 0;
}

/*リスト罫線囲み　横2列*/
.column2-line li {
	width:100%;
}
.column2-line li:not(:nth-child(odd)){
	border-left:1px solid var(--line-color);
}
.column2-line li:not(:nth-child(-n+1)){
	border-top:none;
}

/**丸数字リスト***/
.is-style-vk-numbered-circle-mark > li {
	padding-left:2.5em!important;
}

/*横並びリンク*/
.is-style-jw-button-horizontallink .vk_buttons_col {
	flex-direction:column;
	gap:0;
}
.is-style-jw-button-horizontallink .wp-block-vk-blocks-button {
	width:100%;	
	padding:18px 0;
}
.is-style-jw-button-horizontallink .wp-block-vk-blocks-button:not(:first-child):before {
	content:none;
}
.is-style-jw-button-horizontallink .wp-block-vk-blocks-button{
	border-bottom:1px solid var(--line-color);	
}
.is-style-jw-button-horizontallink .vk_button_link_caption {
	position:unset;
}
.is-style-jw-button-horizontallink .vk_button_link_after {
	right:0;
}

/* ページ内リンク用ボタン（背景白） */
.is-style-jw-button-outer-hashanchor-w .vk_buttons_col {
    flex-direction:column;
	gap:0;
}
.is-style-jw-button-outer-hashanchor-w .wp-block-vk-blocks-button {
	width:100%;
	padding:1em 0;
}

.is-style-jw-button-outer-hashanchor-w .wp-block-vk-blocks-button:not(:first-child):before,
.is-style-jw-button-outer-hashanchor-w .wp-block-vk-blocks-button:first-child:before {
	content:"";
	position: absolute;
	top:0;
    transform:none;
    left: 0;
    background: var(--line-color);
    width: 100%;
    height: 1px;
}

/* ページ内リンク用ボタン */
.is-style-jw-button-outer-hashanchor {
	transform: none;
}
.is-style-jw-button-outer-hashanchor .vk_buttons_col {
	flex-wrap:wrap;
}
.is-style-jw-button-outer-hashanchor .vk_buttons_col a.vk_button_link.btn {
	text-align:left;
	white-space:unset;
	padding-bottom:.8em;
}
.is-style-jw-button-outer-hashanchor .vk_buttons_col a.vk_button_link:before {
	content:"";
	width:calc(100% - 40px);
	height:1px;
	bottom:0px;
	left:50%;
	top:unset;
	transform: none;
	transform: translateX(-50%);
}

/*関連サイト横スクロール*/
.sp-scroll > div.row {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    overflow: auto;
    padding: 1em 0;
    scroll-snap-type: x mandatory;
}
.sp-scroll > div.row > div {
    flex-basis: 80vw;
    scroll-snap-align: start;
	max-width: unset;
}

/* 下部のパンクスは非表示 */
div#breadcrumb {
    display: none;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  parts overwrite
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

/* 横スクロールテーブル */
.wp-block-flexible-table-block-table.wp-block-flexible-table-block-table>table tr th,
.wp-block-flexible-table-block-table.wp-block-flexible-table-block-table>table tr td{
	font-size:var(--text-s);
	padding:0.4em;
}
.wp-block-flexible-table-block-table.is-scroll-on-mobile {
    margin-right: -15px;
    margin-left: -15px;
    padding-left: 15px;
    padding-right: 15px;
}
.wp-block-flexible-table-block-table.is-scroll-on-mobile table {
    min-width: 250%;
}
/* 縦並びはボーダー調整	 */
table.has-fixed-layout.is-stacked-on-mobile {
    border-top: none;
    border-left: none;
    border-right: none;
}
table.has-fixed-layout.is-stacked-on-mobile tr th,
table.has-fixed-layout.is-stacked-on-mobile tr td{
	border-bottom: 0;
}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  header
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */


/*Footer*/

.site-footer .wp-block-columns > div:last-child {
	border-left:none;
	padding-left:0;
}
.img-inline-block img {
	display:inline-block!important;
}

.footer-nav.wp-block-navigation,
.footer-sub-nav.wp-block-navigation {
	flex-direction:column;
	width:100%;
}
.footer-nav.wp-block-navigation li:not(:last-child) {
    border-right: none;
	border-bottom:solid 1px var(--color-white-light);
    margin-right: 0;
    padding-right:0;
}
.footer-nav.wp-block-navigation li {
	padding:1rem 0;
	width:100%;
	text-align:center;
}
.wp-block-navigation .wp-block-navigation-item__content {
	width:100%;
}

.footer-sub-nav.wp-block-navigation li:not(:last-child){
	margin-right:0;
}

footer .wp-block-navigation a:hover {
	background-size:0;
}

.footer-sub-nav.wp-block-navigation {
	gap:0;
}
.footer-sub-nav.wp-block-navigation > li {
	border-bottom:1px solid var(--color-white-light);
	width:100%;
	text-align:center;
	padding:1rem 0;
}

.footer-copyright {
	text-align:center;
	padding:1rem 0;
}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 *  Topページ
 * ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

/*Teaser*/
.teaser-title {
	width:100%;
}
.teaser-title .wp-block-heading {
	font-size:24px;
		word-break: auto-phrase !important;
}
.teaser-column > .wp-block-column {
	width:135px;
}


/* ニュースタブ */
.top-newstab-container .wp-block-group__inner-container {
    display: grid;
	grid-template-columns: 100%;
    grid-template-rows: auto auto auto;
    grid-column-gap: 15px;
}
.su-tabs-mobile-stack .su-tabs-nav span {
	display:inline-block!important;
	padding-right:1em;
}

.top-newstab .su-tabs-nav {
    grid-area: 2 / 1 / 3 / 2;
    width:100% !important;
}
.top-newstab .wp-block-vk-blocks-heading {
    grid-area: 1 / 1 / 2 / 2;
}
.top-newstab .su-tabs-panes {
    grid-area: 3 / 1 / 4 / 2;
    width:100% !important;
}

/*ニュースリスト*/
.vk_posts-layout-postListText .postListText {
    grid-template: auto auto / 90px 1fr;
}
.postListText_date {
    grid-area: 1 / 1 / 2 / 2;
	text-align:left;
}
.postListText_title {
	grid-area: 2 / 1 / 3 / 3;
}
.vk_posts-layout-postListText .postListText:after {
	top:10px;
	transform: none;
}
.vk_posts-layout-postListText .postListText {
	padding:.8rem .7rem .7rem;
}

/*コンテンツへのリンク*/
.top-link-contents {
	padding:20px;
}
.top-link-contents .wp-block-media-text__media {
	padding-left:0;
	padding-bottom:0;
}

.wp-block-media-text.is-stacked-on-mobile {
	grid-template-columns: 90px 1fr!important;
	grid-template-rows:90px 1fr;
}
.wp-block-media-text .wp-block-media-text__content {
grid-area: 1 / 1 / 3 / 3!important;
display: grid;
grid-template-columns: 90px 1fr;
grid-template-rows: 90px 1fr;
}

.wp-block-media-text .wp-block-media-text__content {
	padding:0;
}
.wp-block-media-text .wp-block-media-text__content .wp-block-vk-blocks-button {
grid-area: 1 / 2 / 2 / 3;
	align-self:center;
	padding-left:10px;
}

.wp-block-media-text .wp-block-media-text__content ul {
grid-area: 2 / 1 / 3 / 3;
}
:where(.wp-block-columns.has-background) {
	padding:20px;
}


/*左に（日本溶接協会について）*/
.column-out-left {
	border-radius:var(--vk-size-radius);	
	transform: translateY(-10%);
	margin-left:20px!important;
	margin-right:20px!important;
}
.column-out-left .vk_outer_container > div {
	gap:0;
}
.column-out-left .vk_outer_container > div > div:nth-child(2) {
	padding:0;
	border-left:none;
}
.top-bgimg img {
	aspect-ratio: 4/3;
}

/**ページタイトル上書き**/
.page-header-title, h1.page-header-title,.archive-header-title {
	font-size:30px!important;
}
.page-header,.archive-header {
	background: url(../../../wp-content/uploads/pageheader-bg.svg) no-repeat left center;
    background-size: auto 45px;
	padding-left: max(60px, calc((100vw - var(--vk-width-container)) / 2));
}

