/*
Theme Name: OnePress Child
Theme URI: https://www.famethemes.com/themes/onepress/
Description: Custom Child Theme - OnePress
Template: onepress
Version: 0.0.1

*/

.site-logo-div .custom-logo-link {
	width: 40px;
	height: 0;
	padding-top: 40px;
	position: absolute;
	top: 17px;
	left: 20px;
	display: block;
	overflow: hidden;
	background: url(assets/images/willdaiflex-logo.svg) no-repeat 50% 50%;
	background-size: contain;
	line-height: 100%;
}
/* .site-logo-div .custom-logo-link img {
	display: none;
} */
.hero-slideshow-wrapper {
	background-color: #fff;
}
.hero-slideshow-wrapper:after {
	background-color: rgba(255,255,255,0);
	/* background-color: rgba(0,0,0,0.2); */
}
/* .backstretch {
	height: 100vh !important;
}
.backstretch img {
	object-fit: cover;
	object-position: bottom;
	height: 100vh !important;
} */

.hero-content-style1 p {
	/* color: #9DC03F; */
	text-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
}

.hero-content-style1 h2 {
	padding: 10px;
	display: inline-block;
	text-transform: none;
	/* background-color: #03c4eb; */
	/* background-color: rgb(3 196 235 / 80%); */
	/* background-color: rgb(163 255 159 / 40%); */
}
.hero-content-style1 .morphext {
	/* color: #00ff00;
	color: #39ff14;
	color: #aece54; */
	padding: 15px 20px;
	/* background-color: rgba(255, 255, 255, 0.8);
	color: #03c4eb;
	background-color: #03c4eb; */
	background-color: rgb(3 196 235/ 80%);
	color: #fff;
}

/* banner text update request (pending) */
.hero-content-style1 h2 {
	font-size: 20px;
}
.hero-content-style1 p {
	text-shadow: 0 2px 8px rgba(0, 0, 0, 0.8);
	font-style: normal;
}
	@media all and (min-width: 720px) {
		.hero-content-style1 h2 {
			font-size: 30px;
		}
	}
	@media all and (min-width: 940px) {
		.hero-content-style1 h2 {
			font-size: 39px;
		}
	}
	@media all and (min-width: 1200px) {
		.hero-content-style1 h2 {
			font-size: 46px;
		}
	}



	@media all and (min-width: 375px) {
		.site-logo-div .custom-logo-link {
			width: 255px;
			padding-top: 37px;
			background-image: url(assets/images/willdaiflex-logo-text.svg);
			background-position: 100% 50%;
			background-size: auto 100%;
		}
	}
	@media all and (min-width: 500px) {
		.site-logo-div .custom-logo-link {
			width: 311px;
			padding-top: 45px;
			top: 15px;
			/* background-position: 0 50%; */
			/* background-size: contain; */
		}
	}

.section-features .section-content > .row {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.section-features .section-content .feature-item:last-of-type {
    --icon-hover-bg-color: var(--wp--preset--color--secondary,#333333)
}
.feature-item {
    --icon-hover-bg-color: var(--wp--preset--color--primary,#03c4eb);
}
.feature-item:hover .icon-background-default {
    color: var(--icon-hover-bg-color);
}
.feature-item:last-of-type .icon-background-default {
	display: block;
    color: var(--wp--preset--color--secondary,#333333)
}
.feature-item h4 {
    text-transform: uppercase;
}

.feature-item .icon-background-default {
	display: none;
}
.feature-item .feature-icon {
	transform: scale(1.5);
	color: var(--wp--preset--color--primary,#03c4eb);
}
.feature-item .fa-shoe-prints {
    transform: rotate(-90deg) scale(1.5);
}
.feature-item:last-of-type .feature-icon {
    color: #fff;
	transform: scale(1.2);
}

    @media all and (min-width: 576px) {
        .section-features .section-content > .row {
            margin: 0;
            display: grid;
            grid-template-columns: 1fr 1fr;
            justify-content: center;
        }
		.section-features .feature-item {
			max-width: 100%;
			padding-inline: 0;
		}
    }
    @media all and (min-width: 768px) {
        .section-features .section-content > .row {
            grid-template-columns: 1fr 1fr 1fr;
        }
    }

.section-services .service-thumbnail,
.section-news--layout-grid .list-article--news-grid .list-article-thumb img {
	display: none;
}

.section-features {
	background-color: #fff;
}

.footer-widgets .footer-column:first-of-type figure {
	width: 40px;
	height: 0;
	padding-top: 40px;
	margin: 0;
	overflow: hidden;
	background: url(assets/images/willdaiflex-logo-alt.svg) no-repeat 50% 50%;
	background-size: contain;
}
.footer-widgets .wp-block-list li {
	margin-left: 0;
}

.site-footer {
	border-top: 1px solid #f8f9f9;
	text-transform: uppercase;
}

	@media all and (min-width: 500px) {
		.footer-widgets .row {
			display: grid;
			gap: 20px;
			grid-template-columns: 1fr 1fr;
		}
		.footer-widgets .row .footer-column {
			width: 100%;
			max-width: 100%;
		}
		.footer-widgets .row .footer-column:first-of-type {
			grid-column: 1 / 3;
		}
	}
	@media all and (min-width: 768px) {
		.footer-widgets .row {
			/* grid-template-columns: 40px 1fr 1fr; */
			display: flex;
			justify-content: space-evenly;
		}
		.footer-widgets .row .footer-column {
			width: auto;
			flex: auto;
			padding: 0;
			float: none;
		}
		/* .footer-widgets .row .footer-column:first-of-type {
			grid-column: 1 / 2;
		} */

		.footer-widgets .footer-column:first-of-type figure {
			margin-top: -12px;
		}
	}






#sway-guard {
	--gutter: 20px;
	--spacing-3xs: clamp(0.250px, 0.23040px + 0.098vw, 0.31250px);
	--spacing-2xs: 04px;
	--spacing-xs: 08px;
	--spacing-s: 16px;
	--spacing-m: 24px;
	--spacing-l: 32px;
	--spacing-2l: 40px;
	--spacing-xl: 48px;
	--spacing-2xl: 64px;
	--spacing-3xl: 70px;
	--spacing-4xl: 82px;
	--spacing-5xl: 100px;
	--spacing-6xl: 132px;
	--color-green: #2DEA79;
	--color-electric-blue: #1C9FF8;
	--color-white: #fff;
	--color-pale-grey: #f2f2f2;
	--color-black: #101010;
	--color-real-black: #000;
	--color-red: #c00;
	--color-gold: #D4AF37;
	--color-deep-gold: #E49F53;
	--color-beige: #F6E8DE;
	--font-heading: "Noto Serif JP", sans-serif;
	--font-body: "Noto Sans JP", sans-serif;
	--font-button: "Noto Sans JP", sans-serif;
	--text-h1: 32px;
	--text-h2: 28px;
	--text-h3: 24px;
	--text-h4: 20px;
	--text-h5: 18px;
	--text-h6: 16px;
	--text-body1: 18px;
	--text-body2: 16px;
	--text-body3: 14px;
	--text-body-line-height: 1.7em;
	--height-top-nav: 71px;
	--height-nav-project: 43px;
	--height-nav-create-project: 81px;
	--height-gfoot: 71px;
}
	@media all and (min-width: 375px) {
		#sway-guard {
			--gutter: 24px;
		}
	}
	@media all and (min-width: 1024px) {
		#sway-guard {
			/* --text-h1: 84px; */
			--text-h2: 44px;
			/* --text-h3: 48px; */
			/* --text-h4: 36px; */
			/* --text-h5: 24px; */
			--text-h6: 18px;
			/* --text-body1: 19px; */
			--text-body2: 18px;
			/* --text-body3: 15px; */
		}
	}

#sway-guard .wrap {
	max-width: calc(1392px + var(--gutter) * 2);
	margin: 0 auto;
	padding: 0 var(--gutter);
	display: flex;
	flex-direction: column;
	gap: var(--spacing-l);
}
#sway-guard {
	color: var(--color-black);
	font: 400 var(--text-body2)/1em var(--font-body);
}
#sway-guard ul,
#sway-guard li {
	margin: 0;
	padding: 0;
}
#sway-guard .btn {
	width: auto;
	margin: 0;
	padding: 11px 15px;
	position: relative;
	z-index: 10;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--spacing-xs);
	align-self: flex-start;
	background: var(--color-red);
	border: 1px solid var(--color-red);
	border-radius: 4px;
	color: var(--color-white);
	font: 600 var(--text-body1)/1.25em var(--font-button);
	text-decoration: none;
	text-transform: uppercase;
	transition: border-color 0.3s ease-in-out, background-color 0.3s ease-in-out, color 0.3s ease-in-out, transform 0.3s ease-in-out;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
#sway-guard .mod-cta {
	text-align: center;
}
#sway-guard .mod-cta:has(.makuake-embed) .wrap {
	/* flex-direction: row; */
	align-items: center;
}
#sway-guard .mod-cta .btn {
	padding: 20px 20px 20px 80px;
	display: inline-block;
	font-size: 18px;
	line-height: 2em;
}
#sway-guard .mod-cta .btn::before {
	content: '';
	width: 40px;
	height: 40px;
	position: absolute;
	top: 50%;
	left: 10px;
	margin-top: -20px;
	background: url(assets/images/sway-guard/logo-makuake.svg) no-repeat 50% 50%;
	background-size: contain;
}
#sway-guard .mod-cta .btn strong {
	display: block;
	font-size: 20px;
}
#sway-guard .mod-cta .btn:hover,
#sway-guard .mod-cta .btn:focus {
	transform: scale(1.1);
}
	@media (min-width: 640px) {
		#sway-guard .mod-cta:has(.makuake-embed) .wrap {
			flex-direction: row;
			justify-content: space-evenly;
		}
	}
	@media (min-width: 768px) {
		#sway-guard .mod-cta .btn strong {
			display: inline;
		}
	}


#sway-guard .anexus-logo {
	width: 260px;
	min-width: 260px;
	height: 0;
	padding: 46px 0 0;
	display: block;
	overflow: hidden;
	background: url(assets/images/sway-guard/logo-asobi-nexus.png) no-repeat 50% 0;
	background-size: contain;
	line-height: 1em;
}
#sway-guard .hero .anexus-logo {
	margin: 20px auto;
}

#sway-guard .img {
	width: 100%;
	position: relative;
	display: block;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-size: cover;
}

#sway-guard .hero {
	position: relative;
	background-color: var(--color-real-black);
	color: #fff;
}
#sway-guard .hero .hero-img {
	width: 100%;
	margin-top: -50px;
	height: 400px;
	z-index: 5;
	background-image: url(assets/images/sway-guard/hero-bg-sway-guard.jpg);
	background-size: auto 430px;
}
#sway-guard .hero .wrap {
	padding: var(--gutter) 0;
	position: relative;
	z-index: 10;
}
#sway-guard .hero .anexus-logo {
	margin: 20px auto;
}
#sway-guard .hero h2 {
	width: 100%;
	height: 0;
	padding-top: 157px;
	padding-top: 120px;
	margin: 0;
	position: relative;
	z-index: 10;
	overflow: hidden;
	background: url(assets/images/sway-guard/hero-heading.png) no-repeat 50% 50%;
	background-size: contain;
	line-height: 100%;
}

#sway-guard .key-grp {
	padding: 0 20px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	justify-content: center;
	align-items: center;
}
#sway-guard .keys {
	width: 100%;
	max-width: 420px;
	padding: 20px;
	position: relative;
	display: inline-flex;
	flex-direction: column;
	gap: 14px;
	border: 1px solid var(--color-white);
	background-color: rgba(0, 0, 0, 0.9);
	color: var(--color-white);
}
#sway-guard .keys .h5 {
	color: var(--color-white);
	font-family: var(--font-body);
	font-size: var(--text-h5);
}
#sway-guard .keys .h5 strong {
	color: var(--color-red);
	font-size: var(--text-h4);
}
#sway-guard .keys .h5 em {
	display: block;
	font-size: var(--text-h6);
}
#sway-guard ul {
	width: auto;
	display: flex;
	flex-direction: column;
	gap: 12px;
	list-style: none;
	line-height: 1.8em;
}

#sway-guard .keys.practice {
	border-color: var(--color-red);
}
#sway-guard .keys.practice::before {
	content: '';
	width: 82px;
	height: 120px;
	position: absolute;
	right: 10px;
	bottom: 0;
	background: url(assets/images/sway-guard/sprite.svg) no-repeat -40px -160px;
	background-size: 300px auto;
}
#sway-guard .keys.practice ul {
	padding-right: 60px;
}
#sway-guard .keys.pro .h5 {
	position: relative;
	padding-left: 36px;
}
#sway-guard .keys.pro .h5::before {
	content: '';
	width: 26px;
	height: 60px;
	position: absolute;
	top: 50%;
	left: -4px;
	margin: -30px 0 0;
	background: url(assets/images/sway-guard/sprite.svg) no-repeat 0 -160px;
	background-size: 300px auto;
}
#sway-guard ul.check li {
	position: relative;
	padding-left: 34px;
	list-style: none;
}
#sway-guard ul.check li::before {
	content: '';
	width: 24px;
	height: 24px;
	position: absolute;
	top: 3px;
	left: 0;
	background: url(assets/images/sway-guard/sprite.svg) no-repeat 0 0;
	background-size: 300px auto;
}

#sway-guard .video-box {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 20;
	background-color: var(--color-real-black);
	display: none;
}
#sway-guard .video-box.on {
	display: block;
}
#sway-guard .video-box iframe {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
#sway-guard .hero .video-box iframe {
	height: calc(100% - 40px);
	top: 40px;
}
#sway-guard .video-play,
#sway-guard .video-close {
	width: 24px;
	height: 0;
	padding-top: 24px;
	overflow: hidden;
	background: url(assets/images/sway-guard/sprite.svg) no-repeat -40px 0;
	background-size: 300px auto;
}
#sway-guard .video-close {
	background-position: -80px 0;
}
#sway-guard .video-player .video-play {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -12px 0 0 -12px;
	z-index: 15;
	transform: scale(4);
	transition: transform 0.3s ease-in-out;
}
#sway-guard .video-player .video-play:hover {
	transform: scale(5);
}
#sway-guard .hero .video-close {
	position: absolute;
	top: 10px;
	right: 20px;
	transform: scale(1.5);
}
#sway-guard .hero .video-play {
	position: absolute;
	top: 310px;
	left: 50%;
	margin: 0 0 0 -16px;
}

#sway-guard .hero .video-box {
	height: 100vh;
	position: fixed;
}

#sway-guard .hero .wrap-img {
	width: 100%;
	max-width: 1440px;
	margin-inline: auto;
	position: relative;
	aspect-ratio: 16 / 9;
}
#sway-guard .hero .pros {
	margin-top: -10px;
	position: relative;
	z-index: 10;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 2px;
	justify-content: center;
	text-align: center;
	font-size: 14px;
	font-style: italic;
	mix-blend-mode: screen;
}
#sway-guard .hero .pros em {
	font-size: 12px;
}
#sway-guard .hero .pros .img {
	width: 100%;
	height: auto;
	margin: 0;
	aspect-ratio: 1;
}

.link-sway-guard a {
	color: #c00;
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 700;
}
.sway-guard .section-title-area .section-subtitle,
.sway-guard .section-title-area .section-title {
	display: block;
	color: #fff;
}

.anexus-qr {
	width: 100px;
	height: 100px;
	margin: 40px auto 0;
	display: block;
}
	@media all and (min-width: 375px) {
		#sway-guard .hero .pros {
			gap: 10px;
		}
		#sway-guard .hero .pros .img {
			max-width: 180px;
			margin-inline: auto;
		}
	}
	@media all and (min-width: 500px) {
		#sway-guard .hero .mod-cta .btn strong {
			display: inline;
		}
		#sway-guard .hero .anexus-logo {
			margin-block: 0;
		}
	}
	@media all and (min-width: 640px) {
		#sway-guard .key-grp {
			display: grid;
			grid-template-columns: 1fr 1fr;
			align-items: stretch;
		}
		#sway-guard .keys {
			max-width: 100%;
			justify-content: center;
		}
	}
	@media all and (min-width: 768px) {
		#sway-guard .hero .hero-img {
			height: 474px;
			aspect-ratio: 16 / 9;
			margin: 0 auto;
			background-image: url(assets/images/sway-guard/hero-2.jpg);
			background-size: auto 100%;
		}
		#sway-guard .hero h2 {
			padding-top: 140px;
			position: absolute;
			top: 38px;
		}
		#sway-guard .hero .mod-cta {
			margin-top: -34px;
			position: relative;
			z-index: 30;
		}

		#sway-guard .video-player .video-play {
			top: 50%;
			margin-top: -12px;
			transform: scale(6);
		}
		#sway-guard .video-player .video-play:hover {
			transform: scale(7);
		}
		#sway-guard .hero .video-play {
			top: 290px;
			margin-top: 0;
		}

		#sway-guard .hero .pros .img {
			display: none;
		}
		#sway-guard .hero .pros {
			width: 100%;
			height: 100%;
			margin: 0;
			position: absolute;
			top: 0;
			left: 0;
		}
		#sway-guard .hero .pros li {
			position: absolute;
			z-index: 10;
			font-size: 16px;
			text-shadow: 0 2px 2px var(--color-black);
		}
		#sway-guard .hero .pros .koyama {
			top: 50%;
			left: 50%;
			margin-left: -370px;
		}
		#sway-guard .hero .pros .midorikawa {
			top: 200px;
			right: 20px;
		}
		#sway-guard .hero .pros .aizawa {
			top: 400px;
			right: 60px;
		}

		#sway-guard .hero {
			padding-top: 160px;
		}
		.sway-guard .section-title-area {
			margin: -120px 0 0;
		}
	}
	@media all and (min-width: 900px) {
		#sway-guard .hero .hero-img {
			height: auto;
			aspect-ratio: 16 / 9;
		}
		#sway-guard .key-grp {
			margin-top: -90px;
			position: relative;
			z-index: 25;
			display: flex;
			flex-direction: row;
			justify-content: space-between;
		}
		#sway-guard .keys {
			width: 300px;
			text-align: left;
		}
		#sway-guard .keys ul {
			text-align: left;
		}

		#sway-guard .hero .pros .koyama {
			left: 50%;
			margin-left: -44%;
			margin-top: -1%;
		}
		#sway-guard .hero .pros .midorikawa {
			top: 50%;
			right: 50%;
			margin: -8% -47% 0 0;
		}
		#sway-guard .hero .pros .aizawa {
			top: 50%;
			right: 50%;
			margin: 12% -41% 0 0;
		}
	}
	@media all and (min-width: 1024px) {
		#sway-guard .hero .wrap {
			padding-block: var(--spacing-6xl);
		}
		#sway-guard .hero h2 {
			padding-top: 170px;
			top: var(--spacing-6xl);
		}
		#sway-guard .hero .hero-img {
			height: auto;
		}
		#sway-guard .hero .video-play {
			top: calc(var(--spacing-6xl) + 340px);
		}
		#sway-guard .key-grp {
			margin-top: -80px;
		}
		#sway-guard .keys {
			width: 370px;
		}

		.sway-guard .section-title-area {
			margin-top: -170px;
		}
	}
	@media all and (min-width: 1210px) {
		#sway-guard .hero .video-play {
			top: calc(var(--spacing-6xl) + 400px);
			top: 50%;
			margin-top: -80px;
			margin-left: -14px;
		}
		#sway-guard .key-grp {
			margin-top: -280px;
		}
	}

.section-title-area .section-subtitle {
	color: var(--wp--preset--color--secondary, #8dc900);
}
.section-title-area .section-title {
	color: var(--wp--preset--color--primary, #008fc9);
}

.double-bounce1 {
	background-color: var(--wp--preset--color--primary, #008fc9);
}
.double-bounce2 {
	background-color: var(--wp--preset--color--secondary, #8dc900);
}

.c-bully__title {
	top: 5px;
	right: 38px;
	font-size: 14px;
}
.c-bully__bullet::after {
	width: 20px;
	height: 20px;
}

.section-news .list-article-meta {
	color: var(--wp--preset--color--secondary, #8dc900);
	font-size: 14px;
}

.byline {
	display: none;
}

.view-item {
	margin-top: 10px;
	display: inline-block;
	vertical-align: top;
}
.view-item:focus,
.view-item:hover {
	color: var(--wp--preset--color--secondary, #8dc900);
	text-decoration: underline;
}

.service-item .service-content .view-item {
	margin-top: 10px;
}

.sidebar .section-title-area {
	margin-bottom: 30px;
}
.sidebar .section-services .service-item {
	padding: 20px;
	background-color: #fcfcfc;
}
.sidebar .section-services .service-item .service-image {
	float: none;
	margin-right: 0;
}
.sidebar .section-services .service-item .service-image img {
	width: 100%;
	max-width: 100%;
	margin-bottom: 10px;
}
	@media screen and (min-width: 940px) {
		.sidebar .section-title-area {
			text-align: left;
		}
	}