/*!
Theme Name: WARACRO
Theme URI: https://waraku18.com/
Author: WARACRO
Author URI: https://waraku18.com/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: waracro
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

WARACRO is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html {
	font-size: 62.5%;
	scroll-behavior: smooth;
}

body {
	font-size: 1.6rem;
	font-family: "Montserrat", "Noto Sans JP", sans-serif;
	line-height: 1.5;
	color: #333;
}

p {
	line-height: 1.7;
}

a {
	color: #333;
	text-decoration: none;
}

a:hover {
	opacity: 0.8;
}

img {
	max-width: 100%;
	height: auto;
}

video {
	max-width: 100%;
}

iframe {
	max-width: 100%;
}

ul {
	list-style: none;
}

.sp {
	display: none;
}

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

.wrapper {
	overflow: hidden;
}

/* ヘッダー */
.site-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 20px 30px;
}

.site-branding a {
	display: flex;
}

.site-branding img {
	width: 240px;
}

.main-navigation-pc {
	display: block;
	width: 54%;
}

.main-navigation-pc ul {
	display: none;
	list-style: none;
	margin: 0;
	padding-left: 0;
}

.main-navigation-pc ul ul {
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
	float: left;
	position: absolute;
	top: 100%;
	left: -999em;
	z-index: 99999;
}

.main-navigation-pc ul ul ul {
	left: -999em;
	top: 0;
}

.main-navigation-pc ul ul li:hover > ul,
.main-navigation-pc ul ul li.focus > ul {
	display: block;
	left: auto;
}

.main-navigation-pc ul ul a {
	width: 200px;
}

.main-navigation-pc ul li:hover > ul,
.main-navigation-pc ul li.focus > ul {
	left: auto;
}

.main-navigation-pc li {
	position: relative;
}

.main-navigation-pc a {
	display: block;
	text-decoration: none;
}

/* Small menu. */
.menu-toggle,
.main-navigation-pc.toggled ul {
	display: block;
}

.menu-toggle {
	display: none;
}

.main-navigation-pc ul {
	display: flex;
}

.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {
	margin: 0 0 1.5em;
}

.comment-navigation .nav-links,
.posts-navigation .nav-links,
.post-navigation .nav-links {
	display: flex;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	flex: 1 0 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
	text-align: end;
	flex: 1 0 50%;
}

.main-navigation-sp {
	display: none;
}

.main-navigation-pc ul {
	justify-content: flex-end;
	align-items: center;
}

.main-navigation-pc li {
	margin-left: 50px;
}

.main-navigation-pc li a {
	font-weight: 600;
}

.main-navigation-pc li a:hover {
	color: #32bccb;
}

@media screen and (max-width: 768px) {
	.site-header {
		padding: 0px 20px;
		height: 55px;
	}
	.site-branding img {
		width: 150px;
	}

	.main-navigation-pc {
		display: none;
	}

	.main-navigation-sp {
		display: block;
	}

	/*　ハンバーガーメニューボタン　*/
	.menu-toggle {
		display: block;
		position: fixed;
		z-index: 4;
		right: 0;
		top: 0;
		width: 55px;
		height: 55px;
		cursor: pointer;
		text-align: center;
		background: #121212;
	}

	.menu-toggle span {
		display: block;
		position: absolute;
		width: 20px;
		height: 2px;
		left: 0;
		right: 0;
		margin: auto;
		background: #fff;
		-webkit-transition: 0.3s ease-in-out;
		-moz-transition: 0.3s ease-in-out;
		transition: 0.3s ease-in-out;
	}

	.menu-toggle span:nth-child(1) {
		top: 18px;
	}

	.menu-toggle span:nth-child(2) {
		top: 26px;
	}

	.menu-toggle span:nth-child(3) {
		top: 34px;
	}

	/* スマホメニューを開いてる時のボタン */
	.menu-toggle.active span:nth-child(1) {
		top: 26px;
		background: #fff;
		-webkit-transform: rotate(-45deg);
		-moz-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}

	.menu-toggle.active span:nth-child(2),
	.menu-toggle.active span:nth-child(3) {
		top: 26px;
		background: #fff;
		-webkit-transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		transform: rotate(45deg);
	}

	/* メニュー背景　*/
	.main-navigation-sp .menu-global-nav-container {
		position: fixed;
		z-index: 3;
		top: 0;
		right: 0;
		color: #fff;
		background: #121212;
		width: 70%;
		transform: translateX(100%);
		transition: all 0.6s;
		height: 100%;
		display: flex;
		align-items: center;
	}

	.main-navigation-sp .menu-global-nav-container ul {
		margin: 0 auto;
		padding: 0;
	}

	.main-navigation-sp .menu-global-nav-container ul li {
		list-style-type: none;
		padding: 0;
		width: 100%;
		transition: 0.4s all;
		font-size: 2rem;
	}

	.main-navigation-sp .menu-global-nav-container ul li:last-child {
		padding-bottom: 0;
	}

	.main-navigation-sp .menu-global-nav-container ul li a {
		display: block;
		color: #fff;
		padding: 10px 0;
		text-decoration: none;
		font-weight: 600;
	}

	/* クリックでjQueryで追加・削除 */
	.main-navigation-sp .menu-global-nav-container.active {
		opacity: 100;
		transform: translateX(0%);
	}
}

/* MV */
.main-visual {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	/* padding: 50px 0; */
}

.main-visual_img.sp {
	display: none;
}

.main-visual_text {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	/* right: 10%; */
	left: 10%;
}

.main-visual_text h1 {
	font-size: 5rem;
	line-height: 1.3;
	color: #020202;
}

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

	.main-visual_img.sp {
		display: block;
	}

	.main-visual_text h1 {
		font-size: 2.4rem;
	}
}

/* 下層ページMV */
.sub-main {
	position: relative;
	height: 400px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.sub-main_text h1 {
	font-size: 7rem;
}

.sub-main_text.single h1 {
	font-size: 5rem;
}

.sub-main_text.search-none h1 {
	text-align: center;
}

.sub-main_text.search-none p {
	position: relative;
	top: 30px;
}

.sub-main_img_01 {
	position: absolute;
	top: 20%;
	right: 10%;
	transform: translateY(-50%);
	width: 6%;
	z-index: 1;
}

.sub-main_img_01.slidein.is-animated {
	animation: slideIn 3s forwards;
}

@media screen and (max-width: 768px) {
	.sub-main_text {
		padding: 0 20px;
	}

	.sub-main_text h1 {
		font-size: 4rem;
	}

	.sub-main_text.single h1 {
		font-size: 3rem;
	}
}

/* TOP */
.inner {
	max-width: 1200px;
	margin: 0 auto;
	position: relative;
}

.section_title {
	margin-bottom: 30px;
}

.section_title h2 {
	font-size: 3.2rem;
}

.image_cover {
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5);
	top: 0;
	left: 0;
}

.article {
	padding: 60px 0;
}

.article .inner {
	max-width: 720px;
}

.purpose {
	background-image: url(/wp-content/uploads/2024/08/mv.png);
	background-position: center;
	background-size: cover;
	padding: 60px 0;
	color: #fff;
	position: relative;
}

.greeting {
	padding: 70px 0;
}

.greeting .section_title {
	text-align: center;
}

.greeting_box_img {
	margin: 0 auto 30px;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}

.greeting_box_img_item {
	width: 22%;
}

.greeting_box_img_item img {
	border-radius: 20px;
}

.greeting_box_img_item h3 {
	text-align: center;
}

.greeting_box_img_item span {
	font-size: 16px;
	font-weight: normal;
	display: block;
}

.greeting_box p {
	text-align: center;
	margin-bottom: 30px;
}

.matches {
	padding: 40px 0;
}

.matches_box {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.matches_box_text {
	width: 54%;
}

.matches_box_text p {
	margin-bottom: 20px;
}

.matches_box_text_button a {
	width: 200px;
	display: block;
	background-color: #32bccb;
	color: #fff;
	text-align: center;
	padding: 10px 0;
}

.matches_box_text_button a:hover {
	opacity: 0.8;
}

.matches_box_img {
	width: 40%;
}

.matches_box_img img {
	border-radius: 20px;
}

.about {
	padding: 60px 0;
	z-index: 0;
	position: relative;
}

.about_inner_box {
	display: flex;
	justify-content: space-between;
	background: #fff;
	margin-bottom: 50px;
}

.about_inner_box_title {
	width: 30%;
}

.about_inner_box_text {
	width: 70%;
}

.about_inner_box_text dl {
	display: flex;
	border-bottom: 1px #020202 solid;
	padding: 20px 0;
}

.about_inner_box_text dl:last-child {
	border-bottom: none;
}

.about_inner_box_text dt {
	width: 150px;
	flex-shrink: 0;
}

.about_map iframe {
	width: 100%;
}

@media screen and (max-width: 1200px) {
	.inner {
		padding: 0 20px;
	}
}

@media screen and (max-width: 768px) {
	.inner_title h2 {
		font-size: 3rem;
	}

	.inner_title p {
		font-size: 1.4rem;
	}

	.description h2 {
		font-size: 2rem;
	}

	.service {
		padding: 70px 0 40px;
		margin-top: -40px;
	}

	.service_inner_box_item {
		display: block;
		margin-bottom: 50px;
	}

	.service_inner_box_item:not(:first-child) {
		margin-top: 0;
	}

	.service_inner_box_item:last-child {
		position: relative;
		width: 100%;
	}

	.service_inner_box_item_img {
		width: 100%;
	}

	.service_inner_box_item_text {
		width: 100%;
	}

	.service_inner_box_item_text_title {
		font-size: 2rem;
	}

	.article {
		padding: 60px 0 20px;
	}

	.article .inner_title {
		margin-bottom: 30px;
	}

	.article_inner_box {
		display: block;
	}

	.article_inner_box_item {
		width: 100%;
		margin-bottom: 40px;
	}

	.article_inner_button a {
		width: 100%;
		padding: 16px 0;
	}

	.greeting_box p {
		text-align: left;
		margin: 0 auto 30px;
	}

	.greeting_box_img {
		margin: 0 auto 30px;
		display: block;
	}

	.greeting_box_img_item {
		width: 80%;
		margin: 0 auto 30px;
	}

	.matches_box {
		flex-direction: column;
	}

	.matches_box_text {
		width: 100%;
	}

	.matches .section_title {
		text-align: center;
	}

	.matches_box_img {
		width: 80%;
		margin-bottom: 30px;
	}

	.matches_box_text_button a {
		width: 200px;
		display: block;
		background-color: #32bccb;
		color: #fff;
		text-align: center;
		padding: 10px 0;
	}

	.about_inner_box {
		display: block;
		padding: 20px;
	}

	.about_inner_box_title {
		width: 100%;
	}

	.about_inner_box_text {
		width: 100%;
	}

	.about_inner_box_text dt {
		width: 100px;
	}
}

/* フッター */
.site-footer {
	padding: 12px 0;
}

.footercopy-text {
	text-align: center;
}

/* トップへ戻る */
#scrollTopBtn {
	position: fixed;
	right: 20px;
/* 	bottom: 20px; */
	background-color: #a2a2a2;
	color: #fff;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
	z-index: 100;
}

#scrollTopBtn span {
	transform: rotate(-45deg);
	width: 12px;
	height: 12px;
	border-top: 3px solid;
	border-right: 3px solid;
	margin-top: 5px;
	display: block;
}

/* 問い合わせ */
.contact_form {
	max-width: 900px;
	margin: 0 auto;
}
.contact_form_box dl {
	display: flex;
	justify-content: space-between;
	margin-bottom: 30px;
}

.contact_form_box dt {
	padding-top: 20px;
}

.contact_form_box dt span {
	background: #e60012;
	padding: 3px;
	margin-left: 10px;
	font-size: 1.3rem;
}

.contact_form_box dd {
	width: 78%;
}

.contact_form_box dd input {
	width: 100%;
	padding: 20px;
	font-size: 1.6rem;
	background: #ececec;
	border: none;
	border-radius: 3px;
}

.contact_form_box dd textarea {
	width: 100%;
	padding: 20px;
	font-size: 1.6rem;
	background: #ececec;
	border: none;
	border-radius: 3px;
}

.contact_form_box ::placeholder {
	color: #ccc;
}

.contact_form_button {
	width: 78%;
	margin-left: auto;
}

input[type="submit"],
input[type="button"] {
	border-radius: 0;
	-webkit-box-sizing: content-box;
	-webkit-appearance: button;
	appearance: button;
	border: none;
	box-sizing: border-box;
	cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
	display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
	outline-offset: -2px;
}

.contact_form_button input {
	width: 240px;
	padding: 24px 0;
	font-size: 1.6rem;
	background: #333;
	color: #fff;
	/* 	font-family: 'Montserrat', 'Noto Sans JP', sans-serif; */
	font-weight: 600;
	border-bottom: 7px #121212 solid;
	border-radius: 5px;
	transition: all 0.6s;
}

.contact_form_button input:hover {
	border-bottom: 2px #121212 solid;
	margin-top: 5px;
	background: #121212;
}

@media screen and (max-width: 768px) {
	.contact_form_box dl {
		display: block;
	}

	.contact_form_box dt {
		margin-bottom: 10px;
		padding-top: 0;
	}

	.contact_form_box dd {
		width: 100%;
	}

	.contact_form_button {
		width: 100%;
		text-align: center;
	}

	.contact_form_button input {
		padding: 20px 0;
	}

	.contact_form_button input:hover {
		padding: 18px 0;
	}

	.wpcf7-spinner {
		display: block;
		margin: 0 auto;
	}
}

/* アーカイブ */
.site-main .archive {
	padding: 60px 0;
}

.archive_inner_box {
	display: flex;
	justify-content: space-between;
	margin-bottom: 40px;
}

.archive_inner_box_main {
	/* 	display: flex;
	flex-wrap: wrap; */
	width: 70%;
	/* 	margin-bottom: 70px; */
}

.archive_inner_box_main_item {
	/* 	width: 47%;
	background: #f0f1f6; */
	margin-bottom: 40px;
}

/* .archive_inner_box_main_item:not(:nth-child(2n)) {
margin-right: 6%;
} */

.archive_inner_box_main_item time {
	padding: 0 20px;
	margin-bottom: 10px;
	display: block;
}

.archive_inner_box_main_item h3 {
	margin-bottom: 10px;
	padding: 0 20px;
}

@media screen and (max-width: 768px) {
	.archive_inner_box {
		display: block;
	}

	.archive_inner_box_main {
		display: block;
		width: 100%;
	}

	.archive_inner_box_main_item {
		width: 100%;
	}

	.archive_inner_box_main_item:not(:nth-child(2n)) {
		margin-right: 0;
	}
}

/* シングルページ */
.entry-content {
	line-height: 1.7;
	margin-bottom: 70px;
}

.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
	margin: 2em 0 0.8em;
	line-height: 1.5;
}

.entry-content h2 {
	background: #2b3140;
	padding: 10px 20px;
	color: #fff;
}

.entry-content h3 {
	font-size: 2rem;
	position: relative;
	padding-left: 20px;
}

.entry-content h3:before {
	content: "";
	position: absolute;
	width: 10px;
	background: #0b9e58;
	height: 24px;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}

.entry-content p {
	margin-bottom: 0.8em;
}

.entry-content a {
	text-decoration: underline;
}

.entry-content ol,
.entry-content ul {
	padding-left: 1em;
}

.entry-content li {
	margin-bottom: 0.8em;
}

.sub-main_text {
	padding: 0 30px;
}

.site-main .single {
	padding: 60px 0;
}

.single_inner_box {
	/*   display: flex;
	justify-content: space-between; */
}

.single_inner_box_main {
	/*   width: 70%; */
}

.entry-meta {
	margin-bottom: 10px;
}

.cat-links {
	margin-bottom: 30px;
	display: inline-block;
}

.cat-links a {
	display: inline-block;
	padding: 2px 12px;
	background: #32bccb;
	color: #fff;
	border-radius: 20px;
	font-size: 1.4rem;
	margin-right: 10px;
	margin-bottom: 10px;
}

.wp-block-code {
	border: 2px solid;
	padding: 20px;
}

@media screen and (max-width: 768px) {
	.single_inner_box {
		display: block;
	}

	.single_inner_box_main {
		width: 100%;
	}

	.post-navigation .nav-links {
		display: block;
	}

	.post-navigation .nav-next {
		text-align: initial;
	}
}

/* ページネーション */
.pagination ul {
	list-style: none;
	display: flex;
	justify-content: center;
	width: 70%;
}

.pagination li {
	margin: 5px;
}

.page-numbers {
	padding: 5px 10px;
}

.pagination li a:hover {
	background-color: #32bccb;
	color: #fff;
}

.page-numbers.current {
	background-color: #32bccb;
	color: #fff;
}

@media screen and (max-width: 768px) {
	.pagination ul {
		width: 100%;
	}
}

/* パンくず */
.breadcrumb {
	padding: 50px 0;
}

.breadcrumb ul {
	display: flex;
	flex-wrap: wrap;
}

.breadcrumb li {
	list-style: none;
	margin-bottom: 10px;
}

.breadcrumb li:not(:last-child) {
	margin-right: 20px;
}

.breadcrumb li:not(:last-child):after {
	content: ">";
}

.breadcrumb li:not(:last-child) a {
	padding-right: 20px;
}

@media screen and (max-width: 768px) {
	.breadcrumb {
		padding: 20px;
	}
}