@charset "utf-8";
@import url("css/normalize.css");

/*
Theme Name: Seichikai
Theme URI:
Author: SENSE PORT
Author URI: https://senseport.net/
Description: For Seichikai
Version: 1.0
*/


/* body */
@media {
	body,
	html {
		margin: 0;
		padding: 0;
		font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
		font-weight: 700;
		overflow-x: hidden;
		position: relative;
		background-color: var(--bg-color);
	}
	body {
		font-smoothing: antialiased;
		text-size-adjust: 100%;
		-webkit-font-smoothing: antialiased;
		-webkit-text-size-adjust: 100%;
		-moz-font-smoothing: antialiased;
		-moz-text-size-adjust: 100%;
		-ms-font-smoothing: antialiased;
		-ms-text-size-adjust: 100%;
		-o-font-smoothing: antialiased;
		-o-text-size-adjust: 100%;
	}
	* {
		box-sizing: border-box;
		color: var(--text-color);
	}
	:root {
		--main-color: #20A836;
		--main-color2: #B9E543;
		--main-color3: #EEF5E1;
		--sub-color: #20B20D;
		--sub-color2: #459A57;/* footer-background */
		--sub-color3: #557213;
		--text-color: #101908;
		--bg-color: #fff;
		--size1: 1023;
		--size2: 767;
		--size3: 423;
	}
	p {
		font-size: 18px;
		letter-spacing: 0.06em;
		line-height: 36px;
		font-weight: 500;
		margin: 0;
	}
	a {
		color: inherit;
		text-decoration: none;
		transition: opacity 0.2s;
	}
	a:hover {
		opacity: 1;
	}
	ul {
		padding: 0;
		margin: 0;
	}
	li {
		list-style: none;
	}
	button {
		cursor: pointer;
	}
	img {
		width: auto;
		max-width: 100%;
		height: auto;
		vertical-align: top;
	}
	@media (max-width: 767px) {
		p {
			font-size: 14px;
			letter-spacing: 0.7px;
			line-height: 28px;
		}
	}
}


/* br */
@media {
	div .sp-img-size1,
	a .sp-img-size1,
	div .sp-img-size2,
	a .sp-img-size2,
	div .sp-img-size3,
	a .sp-img-size3 {
		display: none;
	}
	.br-size1,
	.br-size2,
	.br-size3 {
		display: none;
	}
	@media (max-width: 1023px) {

		div .sp-img-size1,
		a .sp-img-size1 {
			display: inline-block;
		}
		div .pc-img-size1,
		a .pc-img-size1 {
			display: none;
		}
		.br-size1 {
			display: inline;
		}
		.br-pc-size1 {
			display: none;
		}
	}
	@media (max-width: 767px) {

		div .sp-img-size2,
		a .sp-img-size2 {
			display: inline-block;
		}
		div .pc-img-size2,
		a .pc-img-size2 {
			display: none;
		}
		.br-size2 {
			display: inline;
		}
		.br-pc-size2 {
			display: none;
		}
	}
	@media (max-width: 423px) {

		div .sp-img-size3,
		a .sp-img-size3 {
			display: inline-block;
		}
		div .pc-img-size3,
		a .pc-img-size3 {
			display: none;
		}
		.br-size3 {
			display: inline;
		}
		.br-pc-size3 {
			display: none;
		}
	}
}


/* color */
@media {
	.bc-fff {
		background-color: #fff;
	}
	.bc-000 {
		background-color: #000;
	}
	.bg-color {
		background-color: var(--bg-color);
	}
	.bg-fff {
		background-color: #fff;
	}
	.fc-main {
		color: var(--main-color);
	}
}


/* animation */
@media {
	.slidein {
		opacity: 0;
		transform: translate(0, 0);
		transition-property: all;
		transition-duration: 1s;
	}
	.slidein.slidein-left {
		transform: translate(-30%, 0);
		transition-property: all;
		transition-duration: 1.2s;
	}
	.slidein.slidein-right {
		transform: translate(20%, 0);
		transition-property: all;
		transition-duration: 1.2s;
	}
	.slidein.slidein-up {
		transform: translate(0, -100%);
	}
	.slidein.slidein-bottom {
		transform: translate(0, 50px);
		transition-property: all;
		transition-duration: 1s;
	}
	.scrollin {
		transform: translate(0, 0) !important;
		opacity: 1 !important;
	}
	.delay02 {
		transition-delay: 0.2s;
	}
	.delay04 {
		transition-delay: 0.4s;
	}
	.delay06 {
		transition-delay: 0.6s;
	}
	.delay08 {
		transition-delay: 0.8s;
	}
	.delay10 {
		transition-delay: 1s;
	}
	@media (max-width:767px) {
		.delay02 {
			transition-delay: 0.2s;
		}
		.delay04 {
			transition-delay: 0.3s;
		}
		.delay06 {
			transition-delay: 0.4s;
		}
		.delay08 {
			transition-delay: 0.5s;
		}
		.delay10 {
			transition-delay: 0.6s;
		}
	}
}

/* loading */
@media {
	#loader_wrap {
		position: fixed;
		width: 100vw;
		height: 100vh;
		top: 0;
		left: 0;
		background-color: #fff;
		z-index: 1000;
		display: flex;
		align-items: center;
		justify-content: center;
		transition: all 1s;
		transition-delay: 1s;
	}
	.loader {
		width: 500px;
		max-width: 80vw;
		opacity: 0;
		animation: blink 2s infinite linear;
	}
	.loader img {
		width: 100%;
	}
	@keyframes blink {
		0% {
			opacity: 0;
		}
		50% {
			opacity: 1;
		}
		100% {
			opacity: 0;
		}
	}
	.loaded {
		opacity: 0;
		visibility: hidden;
		z-index: -1000;
	}
}

/* other */
@media {
	.po-re {
		position: relative;
	}
	.dn {
		display: none;
	}
	.db {
		display: block;
	}
	.dib {
		display: inline-block;
	}
	.fw-700 {
		font-weight: 700;
	}
	.underline {
		text-decoration: underline 10px var(--main-color2);
		text-underline-offset: -5px;
	}
	.max-1line {
		word-break: break-all;
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 1;
		-webkit-box-orient: vertical;
	}
	.max-2line {
		word-break: break-all;
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
	}
	.max-3line {
		word-break: break-all;
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 3;
		-webkit-box-orient: vertical;
	}
	@media (max-width: 1080px) {
		.sp-f-wrap {
			flex-wrap: wrap;
		}
		.sp-dn {
			display: none;
		}
		.sp-db {
			display: block;
		}
		.sp-dib {
			display: inline-block;
		}
		.sp-tac {
			text-align: center;
		}
		.sp-tal {
			text-align: left;
		}
		.sp-tar {
			text-align: right;
		}
		.sp-order-1 {
			order: 1;
		}
		.sp-order-2 {
			order: 2;
		}
	}
}

/* common */
@media {
	.inner {
		width: 1120px;
		max-width: 90vw;
		margin-left: auto;
		margin-right: auto;
		position: relative;
		z-index: 2;
	}
	.section-title {
		width: fit-content;
		max-width: 100%;
		margin-left: auto;
		margin-right: auto;
	}
	.section-title h2 {
		display: flex;
		flex-direction: column;
	}
	.section-title h2 span.title-en {
		font-size: 20px;
		letter-spacing: 0;
		line-height: 24px;
		font-weight: 400;
		font-family: 'work-sans';
		text-align: center;
	}
	.section-title h2 span.title-ja {
		font-size: 30px;
		letter-spacing: 0;
		line-height: 44px;
		font-weight: 700;
		font-family: 'fot-tsukubrdgothic-std';
		color: var(--sub-color3);
		text-align: center;
	}
	.contents {
		margin-top: 10px;
	}
	.btn a {
		width: 210px;
		height: 50px;
		display: flex;
		justify-content: center;
		align-items: center;
		gap: 10px;
		background: linear-gradient(90deg, var(--main-color2) 0%,var(--main-color2) 50%,var(--sub-color) 50%,var(--sub-color) 100%);
		background-size: 200% 100%;
		background-repeat: no-repeat;
		background-position: right;
		border-radius: 25px;
		transition: all 0.4s;
		font-size: 18px;
		letter-spacing: 0;
		line-height: 24px;
		font-weight: 700;
		color: #fff;
	}
	.btn a:hover {
		background-position: left;
	}
	.backline {
		position: absolute;
		top: 0;
		left: 0;
		opacity: 0.24;
		mix-blend-mode: soft-light;
	}
	.backline img {
		width: 100vw;
	}
	@media (max-width:767px) {
		.section-title h2 span.title-en {
			font-size: 13px;
			line-height: 15px;
		}
		.section-title h2 span.title-ja {
			font-size: 24px;
			line-height: 32px;
		}
		.btn a {
			width: 180px;
			height: 40px;
			font-size: 14px;
			letter-spacing: 0;
			line-height: 18px;
		}
	}
}

/* header */
@media {
	.header {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: auto;
		background-color: #fff;
		display: flex;
		align-items: center;
		z-index: 100;
		transition: all 0.3s;
		pointer-events: none;
	}
	.header-inner {
		position: relative;
		display: flex;
		width: 100%;
	}
	.header-inner .btn-trigger,.header-inner a {
		pointer-events: all;
	}
	.header-logo {
		width: 120px;
		margin-left: 64px;
		margin-top: 36px;
	}
	.header-logo a {
		pointer-events: all;
		display: inline-block;
		transition: all 0.2s;
	}
	.header-logo a:hover {
		transform: scale(1.1);
	}
	.menu-inner {
		position: fixed;
		top: 0;
		right: 0;
		width: 100%;
		max-width: 100%;
		height: 100vh;
		overflow-y: auto;
		z-index: -1;
		transition: all 0.3s;
		background-color: transparent;
		pointer-events: none;
		overflow-x: hidden;
	}
	.menu-inner > ul {
		width: 250px;
		max-width: 100%;
		height: 100%;
		margin-left: auto;
		display: flex;
		flex-direction: column;
		gap: 26px;
		background-color: var(--main-color);
		padding: 100px 0 0;
		transform: translateX(100%);
		transition: all 0.5s;
		pointer-events: all;
	}
	.menu-inner ul li a {
		display: block;
		width: fit-content;
		font-size: 16px;
		letter-spacing: 0;
		line-height: 18px;
		font-weight: 700;
		color: #fff;
		transition: all 0.2s;
		white-space: nowrap;
		padding-left: 5vw;
		padding-right: 5vw;
	}
	.menu-inner ul li a span {
		font-size: 22px;
		letter-spacing: 0.08em;
		line-height: 28px;
		font-weight: 700;
		display: block;
		color: #fff;
		font-family: 'pt-sans';
	}
	.menu-inner ul li a:hover {
		opacity: 0.8;
	}
	.menu-inner ul li.dropdown-trigger ul {
		display: flex;
		flex-direction: column;
		gap: 16px;
		margin-top: 16px;
	}
	.header-menu {
		display: block;
	}
	.header-list {
		margin-right: 80px;
		margin-left: auto;
	}
	.header-list ul.header-ul {
		display: flex;
		align-items: center;
		gap: 30px;
		margin-top: 34px;
	}
	.header-list ul.header-ul > li {
		position: relative;
		padding-bottom: 33px;
	}
	.header-list ul.header-ul li a {
		font-size: 18px;
		letter-spacing: 0;
		line-height: 23px;
		font-weight: 500;
		transition: all 0.2s;
	}
	.header-list ul.header-ul li a:hover {
		color: var(--main-color);
	}
	.header-list ul.header-ul li.dropdown-trigger > a {
		padding: 0 0 20px 0;
	}
	.header-list ul.header-ul li a svg {
		margin-left: 9px;
		margin-bottom: 3px;
		display: inline-block;
	}
	.header-list ul.dropdown-inner {
		position: absolute;
		top: 42px;
		left: 0;
		min-width: 100%;
		box-shadow: 0 5px 12px rgb(0 0 0 / 20%);
		border-radius: 10px;
		overflow: hidden;
		z-index: -1;
		flex-direction: column;
		transform: scaleY(0);
		transform-origin: center top;
		transition: all 0.2s;
	}
	.header-list ul.dropdown-inner li {
		display: block;
	}
	.header-list ul.dropdown-inner li a {
		background-color: #fff;
		padding: 20px 12px;
		display: block;
		white-space: nowrap;
	}
	.header-list ul li.dropdown-trigger:hover .dropdown-inner {
		z-index: 101;
		transform: scaleY(1);
	}
	.header-list ul.dropdown-inner li a:hover {
		background-color: var(--main-color3);
	}
	.btn-trigger {
		position: relative;
		width: 60px;
		height: 60px;
		cursor: pointer;
		z-index: 51;
	}
	.btn-trigger span {
		position: absolute;
		left: 0;
		right: 0;
		width: 26px;
		height: 2px;
		margin: auto;
		background-color: #51A547;
	}
	.btn-trigger,
	.btn-trigger span {
		display: inline-block;
		transition: all 0.5s;
		box-sizing: border-box;
		display: none;
	}
	.btn-trigger span:nth-of-type(1) {
		top: 0;
		bottom: 14px;
	}
	.btn-trigger span:nth-of-type(2) {
		top: 7px;
		bottom: 7px;
	}
	.btn-trigger span:nth-of-type(3) {
		top: 14px;
		bottom: 0;
	}
	.header-logo.active ~ .header-contact a {
		color: #fff;
	}
	.header-logo.active ~ .header-contact a svg {
		fill: #fff;
	}
	.menu-slide {
		background-color: rgba(57, 57, 57, 0.8);
		pointer-events: all;
	}
	.menu-slide ul {
		transform: translateX(0);
		opacity: 1;
	}
	@keyframes menu-1 {
		0% {
			transform: translateX(100%);
			opacity: 0;
		}
		100% {
			transform: translateX(0);
			opacity: 1;
		}
	}
	@media (max-width: 1023px) {
		.header-logo {
			margin-left: 40px;
		}
		.header-list {
			margin-right: 40px;
		}
		.header-list ul.header-ul {
			gap: 20px;
			margin-top: 38px;
		}
		.header-list ul.header-ul li a {
			font-size: 13px;
			line-height: 15px;
		}
	}
	@media (max-width:767px) {
		.header-logo {
			margin-left: 5vw;
			margin-top: 15px;
			width: 86px;
			transition: all 1s;
		}
		.header-logo.active {
			z-index: 100;
			transition: all 1s;
		}
		.header-list {
			display: none;
		}
		.header-contact {
			margin-right: 18px;
			height: 56px;
		}
		.header-contact a {
			font-size: 14px;
			gap: 4px;
		}
		.header-contact a svg {
			width: 12px;
			height: fit-content;
		}
		.btn-trigger {
			position: relative;
			width: 60px;
			height: 60px;
			cursor: pointer;
			z-index: 51;
			margin-left: auto;
		}
		.btn-trigger span {
			position: absolute;
			left: 0;
			right: 0;
			width: 26px;
			height: 2px;
			margin: auto;
			background-color: #51A547;
		}
		.btn-trigger, .btn-trigger span {
			display: inline-block;
		}
		.btn-trigger span:nth-of-type(1) {
			top: 0;
			bottom: 14px;
		}
		.btn-trigger span:nth-of-type(2) {
			top: 7px;
			bottom: 7px;
		}
		.btn-trigger span:nth-of-type(3) {
			top: 14px;
			bottom: 0;
		}
		#menu-change.active span:nth-of-type(1) {
			width: 36px;
			background-color: #fff;
			-webkit-transform: translateY(-6px) rotate(-45deg);
			transform: translateY(-6px) rotate(-45deg);
			transform-origin: right center;
			right: 8px;
		}
		#menu-change.active span:nth-of-type(2) {
			opacity: 0;
		}
		#menu-change.active span:nth-of-type(3) {
			width: 36px;
			background-color: #fff;
			-webkit-transform: translateY(6px) rotate(45deg);
			transform: translateY(6px) rotate(45deg);
			transform-origin: right center;
			right: 8px;
		}
	}
}

/* footer */
@media {
	.footer {
		position: relative;
		background-color: #459A57;
		padding: 52px 0 76px;
	}
	.footer .inner {
		width: 920px;
	}
	.footer-block {
		display: flex;
		gap: 20px 80px;
		margin-top: 44px;
	}
	.footer-logo a {
		width: 156px;
    transition: all 0.2s;
		text-align: center;
  }
  .footer-logo a:hover {
    opacity: 0.7;
  }
	.footer-block a {
		transition: all 0.2s;
	}
	.footer-block a:hover {
		color: var(--main-color2);
	}
	.footer-list {
		display: flex;
		flex-direction: column;
		gap: 15px;
	}
	.footer-list li a {
		font-size: 18px;
		letter-spacing: 0;
		line-height: 23px;
		font-weight: 700;
		color: #fff;
	}
	.footer-clinic {
		display: flex;
		gap: 30px;
	}
	.footer-clinic a {
		font-size: 18px;
		letter-spacing: 0;
		line-height: 23px;
		font-weight: 700;
		color: #fff;
		height: fit-content;
	}
	.footer-clinic ul {
		display: flex;
		flex-direction: column;
		gap: 17px;
	}
	.footer-clinic ul li a {
		font-size: 16px;
		letter-spacing: 0;
		line-height: 21px;
		font-weight: 500;
		color: #fff;
	}
	.footer-info {
		margin-left: auto;
		display: flex;
		flex-direction: column;
		align-items: flex-end;
	}
	.footer-info a {
		font-size: 18px;
		letter-spacing: 0;
		line-height: 23px;
		font-weight: 700;
		color: #fff;
	}
	.footer-info p {
		margin-top: auto;
		font-size: 13px;
		letter-spacing: 0;
		line-height: 17px;
		font-weight: 500;
		color: #fff;
	}
	.footer a[target="_blank"] {
		position: relative;
		font-size: 15px;
		letter-spacing: 0.08em;
		line-height: 1;
		color: var(--main-color);
		transition: all 0.2s;
	}
	.footer-block a[target="_blank"]::after {
		content: '';
		display: inline-block;
		width: 14px;
		height: 11px;
		margin-left: 5px;
		background-image: url(images/outer-link.svg);
		background-size: 100% auto;
		background-repeat: no-repeat;
	}
	.footer-flex a:hover {
		text-decoration: underline 1px var(--main-color);
	}
	@media (max-width: 767px) {
		.footer {
			padding: 54px 0 60px;
		}
		.footer-block {
			flex-direction: column;
			gap: 21px;
		}
		.footer-list {
			gap: 21px;
		}
		.footer-list li a {
			font-size: 14px;
			line-height: 18px;
		}
		.footer-clinic {
			flex-direction: column;
			gap: 16px;
		}
		.footer-clinic a {
			font-size: 14px;
			line-height: 18px;
		}
		.footer-clinic ul {
			padding-left: 20px;
		}
		.footer-clinic ul li a {
			font-size: 13px;
			line-height: 17px;
		}
		.footer-info {
			gap: 16px;
			align-items: flex-start;
			margin-left: 0;
		}
		.footer-info a {
			font-size: 14px;
			line-height: 18px;
		}
		.footer-info p {
			font-size: 10px;
			line-height: 13px;
		}
	}
	@media (max-width: 423px) {

	}
}

/* swiper */
@media {
	.swiper-horizontal>.swiper-pagination-bullets,
	.swiper-pagination-bullets.swiper-pagination-horizontal,
	.swiper-pagination-custom,
	.swiper-pagination-fraction {
		position: static;
		top: unset;
		left: unset;
		right: unset;
		bottom: unset;
		margin: 18px 0 0 26px;
		width: auto;
		height: auto;
	}
	.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,
	.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
		margin: 0 4px;
	}
	.swiper-pagination-bullet {
		width: 22px;
		height: 2px;
		background-color: #8E8E8E;
		opacity:1;
		display: inline-block;
		border-radius: 0;
	}
	.swiper-pagination-bullet-active {
		background-color: var(--main-color);
	}
}


/* index.php */
@media {
	/* FV */
	@media {
		.fv {
			padding: 90px 0 100px;
			position: relative;
		}
		.fv-design1 {
			position: absolute;
			top: 130px;
			right: 0;
			width: max((50vw - 560px) + 120px, 5vw + 120px);
			height: 100px;
			background-color: #20B20D;
		}
		.fv-design2 {
			position: absolute;
			top: 230px;
			left: 0;
			width: max((50vw - 560px) + 190px, 5vw + 190px);
			height: 300px;
			background-color: #B9E543;
		}
		.fv-scroll {
			transform: rotate(90deg);
			transform-origin: right top;
			position: absolute;
			bottom: 197px;
			right: 35px;
			width: 120px;
			padding-bottom: 8px;
			z-index: 10;
		}
		.fv-scroll::after {
			content: '';
			position: absolute;
			bottom: 0;
			left: 0;
			width: 120px;
			height: 2px;
			background-color: var(--main-color2);
		}
		.fv-scroll p {
			font-size: 16px;
			letter-spacing: 0;
			line-height: 19px;
			font-weight: 400;
			font-family: 'work-sans';
		}
		.fv-text {
			position: absolute;
			right: 0;
			bottom: 32px;
			font-size: 42px;
			letter-spacing: 0;
			line-height: 65px;
			font-weight: 400;
			font-family: 'fot-tsukubrdgothic-std';
			z-index: 2;
		}
		.fv-text .fc-main {
			color: #5C8400;
		}
		@media (max-width: 1180px) {
			.fv-text {
				position: static;
				margin-top: 20px;
			}
			.fv-scroll {
				bottom: 100px;
			}
		}
		@media (max-width: 1023px) {
			.fv {
				padding: 95px 0 16px;
			}
			.fv-design2 {
				top: 140px;
			}
		}
		@media (max-width: 767px) {
			.fv {
				padding: 80px 0 56px;
			}
			.fv-design1 {
				height: 50px;
			}
			.fv-design2 {
				height: 150px;
			}
			.fv-scroll {
				right: 0;
				bottom: 32px;
			}
			.fv-scroll p {
				font-size: 13px;
				line-height: 15px;
			}
			.fv-text {
				font-size: 28px;
				letter-spacing: 0;
				line-height: 48px;
				margin-top: 16px;
			}
		}
	}
	/* NEWS */
	@media {
		.news {
			padding: 60px 0 81px;
			position: relative;
			background: linear-gradient(180deg, var(--main-color3) 0%,var(--main-color3) 180px,transparent 180px,transparent 100%);
		}
		.news::before {
			content: '';
			position: absolute;
			left: 0;
			top: 0;
			width: clamp(5vw + 340px,340px + (50vw - 560px),100%);
			height: 100%;
			background-color: var(--main-color3);
			border-radius: 0 0 30px 0;
		}
		.news-inner {
			width: 1120px;
			max-width: 90vw;
			margin-left: auto;
			margin-right: auto;
			border-radius: 30px;
			background-color: #fff;
			padding: 58px 100px 0;
			display: flex;
			justify-content: space-between;
			position: relative;
		}
		.news-inner::before {
			content: '';
			width: 600px;
			max-width: calc(100% - 500px);
			height: 12px;
			position: absolute;
			left: 100px;
			bottom: 0;
			background: linear-gradient(90deg, #8FC162 0%, #BCD584 100%);
		}
		.news .section-title {
			margin-left: 0;
			flex: none;
		}
		.news .section-title h2 span.title-en,.news .section-title h2 span.title-ja {
			text-align: left;
		}
		.news-wrapper {
			max-width: 100%;
		}
		.news-post {
			width: 741px;
			max-width: 100%;
			display: flex;
			flex-direction: column;
			gap: 25px;
		}
		.news-block a {
			display: flex;
			gap: 40px;
		}
		.news-date p {
			font-size: 18px;
			letter-spacing: 0;
			line-height: 23px;
			font-weight: 500;
			transition: all 0.2s;
			color: var(--sub-color3);
		}
		.news-title p {
			font-size: 18px;
			letter-spacing: 0;
			line-height: 23px;
			font-weight: 500;
			transition: all 0.2s;
		}
		.news-block a:hover .news-title p {
			color: var(--main-color2);
			text-decoration: underline;
		}
		.news-btn {
			margin-top: 36px;
		}
		.news-btn a {
			margin-left: auto;
		}
		@media (max-width: 1200px) {
			.news-inner {
				padding: 58px 40px 0;
			}
		}
		@media (max-width: 1023px) {
			.news {
				padding: 30px 0 40px;
			}
			.news-inner {
				gap: 26px;
				flex-wrap: wrap;
			}
		}
		@media (max-width: 767px) {
			.news {
				background: linear-gradient(0deg, transparent 0%, transparent 120px, var(--main-color3) 120px, var(--main-color3) 100%);
			}
			.news::before {
				width: clamp(120px, 5vw + 100px, 32vw);
			}
			.news-inner {
				padding: 30px 20px 0;
			}
			.news-inner::before {
				max-width: unset;
				width: 95px;
				height: 5px;
				left: 25px;
			}
			.news .section-title {
				margin-left: auto;
				margin-right: auto;
			}
			.news .section-title h2 span.title-en {
				text-align: center;
			}
			.news-block a {
				gap: 7px;
				flex-direction: column;
			}
			.news-date p {
				font-size: 16px;
				line-height: 21px;
			}
			.news-title p {
				font-size: 14px;
				line-height: 20px;
			}
			.news-title p.max-1line {
				-webkit-line-clamp: 2;
			}
		}
	}
	/* CLINIC */
	@media {
		.clinic {
			position: relative;
			padding: 90px 0 74px;
			margin-top: -30px;
		}
		.clinic-design1 {
			position: absolute;
			top: 20px;
			right: 0;
			width: max((50vw - 460px) + 132px, 5vw + 132px);
			height: 64px;
			background-color: #20A836;
			border-radius: 20px 0 0 20px;
		}
		.clinic-design2 {
			position: absolute;
			top: 52px;
			right: 0;
			width: max((50vw - 460px), 5vw);
			height: 104px;
			background: linear-gradient(251deg, #55BF1C 0%, #DDFF91 100%);
			border-radius: 20px 0 0 20px;
		}
		.clinic-design3 {
			position: absolute;
			bottom: 145px;
			left: 0;
			width: max((50vw - 460px) + 60px, 5vw + 60px);
			height: 64px;
			background: linear-gradient(257deg, #55BF1C 0%, #DDFF91 100%);
			border-radius: 0 20px 20px 0;
			z-index: 2;
		}
		.clinic-design4 {
			position: absolute;
			bottom: 0;
			left: 0;
			width: max((50vw - 460px) + 170px, 5vw + 170px);
			height: 169px;
			background-color: #B9E543;
			border-radius: 0 20px 20px 0;
		}
		.clinic .inner {
			width: 920px;
		}
		.clinic-contents {
			margin-top: 56px;
		}
		.clinic-text {
			display: flex;
			gap: 60px;
		}
		.clinic-text h3 {
			width: 241px;
			flex: none;
			font-size: 24px;
			letter-spacing: 0.02em;
			line-height: 2;
			font-weight: 700;
			font-family: 'fot-tsukubrdgothic-std';
			color: var(--sub-color3);
		}
		.clinic-text p {
			font-size: 18px;
			letter-spacing: 0.06em;
			line-height: 2;
			font-weight: 500;
		}
		.clinic-btn {
			margin-top: 55px;
		}
		.clinic-btn a {
			margin-left: auto;
		}
		@media (max-width: 1023px) {
			.clinic-text {
				gap: 30px;
			}
		}
		@media (max-width: 767px) {
			.clinic {
				padding: 95px 0 45px;
			}
			.clinic-design1 {
				width: calc(5vw + 80px);
				height: 30px;
				top: 30px;
				z-index: 2;
				border-radius: 10px 0 0 10px;
			}
			.clinic-design2 {
				width: calc(5vw + 30px);
				height: 50px;
				top: 45px;
				border-radius: 10px 0 0 10px;
			}
			.clinic-design3 {
				width: calc(5vw + 20px);
				height: 30px;
				bottom: 65px;
				border-radius: 0 10px 10px 0;
			}
			.clinic-design4 {
				width: calc(5vw + 60px);
				height: 80px;
				border-radius: 0 10px 10px 0;
			}
			.clinic-contents {
				margin-top: 21px;
			}
			.clinic-text {
				flex-direction: column;
			}
			.clinic-text h3 {
				width: auto;
				font-size: 18px;
				line-height: 27px;
				margin-left: auto;
				margin-right: auto;
			}
			.clinic-text p {
				font-size: 14px;
				letter-spacing: 0;
				line-height: 2;
			}
			.clinic-btn {
				margin-top: 36px;
			}
			.clinic-btn a {
				margin-left: auto;
				margin-right: auto;
			}
		}
	}
	/* ABOUT */
	@media {
		.about {
			padding: 90px 0 50px;
			margin-top: -66px;
		}
		.about .inner {
			position: relative;
		}
		.about-back {
			position: absolute;
			right: 0;
			bottom: 25px;
			width: max(5vw + 1120px, 1120px + (50vw - 560px));
			height: 205px;
			border-radius: 0 30px 30px 0;
			background-color: var(--main-color3);
		}
		.about-contents {
			margin-top: 56px;
			position: relative;
			display: flex;
			justify-content: center;
			gap: 60px;
		}
		.about-block {
			width: 286px;
		}
		.about-block a p {
			transition: all 0.2s;
		}
		.about-block a:hover p {
			color: var(--sub-color2);
		}
		.about-block a .about-thumbnail {
			overflow: hidden;
			border-radius: 40px;
		}
		.about-block a .about-thumbnail img {
			transition: all 0.3s;
		}
		.about-block a:hover .about-thumbnail img {
			transform: scale(1.15);
		}
		.about-block a p {
			font-size: 20px;
			letter-spacing: 0;
			line-height: 26px;
			font-weight: 700;
			color: var(--sub-color3);
			text-align: center;
			margin-top: 18px;
		}
		.about-btn {
			position: relative;
			margin-top: 36px;
		}
		.about-btn a {
			margin-left: auto;
			margin-right: auto;
		}
		@media (max-width: 767px) {
			.about {
				padding: 75px 0 0;
				margin-top: -60px;
			}
			.about-contents {
				flex-wrap: wrap;
				margin-top: 26px;
				gap: 27px;
			}
			.about-back {
				bottom: 20px;
				right: unset;
				left: -5vw;
				width: calc(50vw + 110px);
				height: calc(100% - 189px);
			}
			.about-block {
				width: 280px;
			}
		}
	}
	/* TREATMENT */
	@media {
		.treatment {
			padding: 90px 0 20px;
			position: relative;
		}
		.treatment-design1 {
			position: absolute;
			top: 90px;
			left: 0;
			width: max((50vw - 460px) + 215px, 5vw + 215px);
			height: 201px;
			background-color: #EEF5E1;
			border-radius: 0 20px 20px 0;
		}
		.treatment-design2 {
			position: absolute;
			bottom: 124px;
			right: 0;
			width: max((50vw - 460px) + 144px, 5vw + 144px);
			height: 201px;
			background-color: #B9E543;
			border-radius: 20px 0 0 20px;
		}
		.treatment .inner {
			width: 920px;
		}
		.treatment-contents {
			display: flex;
			gap: 60px;
			margin-top: 56px;
		}
		.treatment-text p {
			font-size: 18px;
			letter-spacing: 0.06em;
			line-height: 2;
			font-weight: 500;
		}
		.treatment-btn {
			margin-top: 55px;
		}
		.treatment-img {
			width: 430px;
			max-width: 50%;
			flex: none;
		}
		@media (max-width: 1023px) {
			.treatment-contents {
				gap: 30px;
			}
		}
		@media (max-width: 767px) {
			.treatment {
				padding: 60px 0 20px;
			}
			.treatment-design1 {
				top: 114px;
				width: calc(5vw + 80px);
				height: 100px;
			}
			.treatment-design2 {
				display: none;
			}
			.treatment-contents {
				margin-top: 26px;
				flex-direction: column;
				gap: 20px;
			}
			.treatment-text {
				order: 2;
			}
			.treatment-text p {
				font-size: 14px;
				letter-spacing: 0;
				line-height: 28px;
			}
			.treatment-img {
				width: 280px;
				max-width: 100%;
				margin-left: auto;
				margin-right: auto;
			}
			.treatment-btn {
				margin-top: 36px;
			}
			.treatment-btn a {
				margin-left: auto;
				margin-right: auto;
			}
		}
	}
	/* features */
	@media {
		.features {
			padding: 90px 0 140px;
			position: relative;
		}
		.features-design1 {
			position: absolute;
			top: 24px;
			right: 0;
			width: max((50vw - 460px) + 132px, 5vw + 132px);
			height: 64px;
			background: linear-gradient(257deg, #37B738 0%, #C0ED5B 100%);
			border-radius: 20px 0 0 20px;
		}
		.features-design2 {
			position: absolute;
			top: 56px;
			right: 0;
			width: max((50vw - 460px), 5vw);
			height: 104px;
			background-color: #20A836;
			border-radius: 20px 0 0 20px;
		}
		.features .inner {
			width: 920px;
		}
		.features-contents {
			margin-top: 56px;
			display: flex;
			flex-direction: column;
			gap: 80px;
		}
		.features-block {
			display: flex;
			align-items: center;
			gap: 80px;
			position: relative;
		}
		.features-block::before {
			content: '';
			position: absolute;
			bottom: -40px;
			left: min(-5vw,(460px - 50vw));
			width: max((50vw - 460px) + 170px, 5vw + 170px);
			height: 268px;
			background: linear-gradient(232deg, #55BF1C 0%, #DDFF91 100%);
			border-radius: 0 20px 20px 0;
		}
		.features-block:nth-of-type(2n)::before {
			left: unset;
			right: min(-5vw, (460px - 50vw));
			background: linear-gradient(52deg, #55BF1C 0%, #DDFF91 100%);
			border-radius: 20px 0 0 20px;
		}
		.features-img {
			width: 420px;
			max-width: 55%;
			flex: none;
			position: relative;
		}
		.features-img p {
			position: absolute;
			top: 31px;
			right: 44px;
			font-size: 30px;
			letter-spacing: 0;
			line-height: 43px;
			font-weight: 700;
			font-family: 'fot-tsukubrdgothic-std';
			color: var(--sub-color3);
		}
		.features-block:nth-of-type(2n) .features-img p {
			right: unset;
			left: 43px;
		}
		.features-text h3 {
			font-size: 24px;
			letter-spacing: 0;
			line-height: 36px;
			font-weight: 700;
			font-family: 'fot-tsukubrdgothic-std';
		}
		.features-text p {
			margin-top: 36px;
			font-size: 18px;
			letter-spacing: 0.06em;
			line-height: 2;
			font-weight: 500;
		}
		.features-btn {
			margin-top: -40px;
		}
		.features-btn a {
			margin-left: auto;
		}
		@media (max-width: 1023px) {
			.features-block {
				gap: 30px;
			}
		}
		@media (max-width: 767px) {
			.features {
				padding: 60px 0;
			}
			.features-design1 {
				width: calc(5vw + 80px);
				height: 30px;
				top: 0px;
				background: #20A836;
				border-radius: 10px 0 0 10px;
			}
			.features-design2 {
				width: calc(5vw + 30px);
				height: 50px;
				top: 15px;
				background: linear-gradient(246deg, #55BF1C 0%, #DDFF91 100%);
				border-radius: 10px 0 0 10px;
			}
			.features-contents {
				gap: 60px;
			}
			.features-block {
				flex-direction: column;
			}
			.features-block::before {
				width: calc(50vw - 88px);
				min-width: 100px;
				height: 90px;
				bottom: unset;
				top: 150px;
				border-radius: 0 10px 10px 0;
			}
			.features-block:nth-of-type(2n) .features-img p {
				right: unset;
				left: 19px;
			}
			.features-img {
				max-width: 280px;
			}
			.features-img p {
				top: 18px;
				right: 19px;
				font-size: 24px;
				line-height: 35px;
			}
			.features-text {
				order: 2;
				max-width: 280px;
				margin-left: auto;
				margin-right: auto;
			}
			.features-text h3 {
				font-size: 18px;
				line-height: 26px;
			}
			.features-text p {
				margin-top: 12px;
				font-size: 14px;
				line-height: 28px;
			}
			.features-btn {
				margin-top: -20px;
			}
			.features-btn a {
				margin-left: auto;
				margin-right: auto;
			}
		}
	}
	/* RECRUIT */
	@media {
		.recruit {
			padding: 80px 0;
			background-color: var(--main-color3);
			position: relative;
		}
		.recruit-design {
			position: absolute;
			top: 40px;
			right: 0;
			width: max((50vw - 560px) + 232px, 5vw + 232px);
			height: 162px;
			background-color: #B9E543;
			border-radius: 20px 0 0 20px;
		}
		.recruit-contents {
			position: absolute;
			bottom: 140px;
			right: min(-5vw,(560px - 50vw));
			padding: 60px 0 60px 87px;
			width: max(5vw + 560px, 560px + (50vw - 560px));
			background-color: #fff;
			border-radius: 40px 0 0 40px;
		}
		.recruit .section-title {
			margin-left: 0;
		}
		.recruit .section-title h2 span.title-en,.recruit .section-title h2 span.title-ja {
			text-align: left;
		}
		.recruit-contents p {
			width: 373px;
			margin-top: 36px;
			font-size: 18px;
			letter-spacing: 0.06em;
			line-height: 2;
			font-weight: 500;
		}
		.recruit-btn {
			position: absolute;
			bottom: 0;
			right: 30px;
			max-width: 36.8%;
		}
		.recruit-btn a {
			width: 413px;
			max-width: 100%;
			height: 60px;
			border-radius: 30px;
		}
		@media (max-width: 1023px) {
			.recruit-design {
				top: 120px;
				left: 0;
				right: unset;
				width: 50%;
				height: 162px;
				background-color: #B9E543;
				border-radius: 0 20px 20px 0;
			}
			.recruit .inner {
				max-width: 100%;
				display: flex;
				flex-direction: column;
			}
			.recruit-img {
				width: 100%;
				margin-right: auto;
				margin-left: -5%;
				margin-top: -70px;
				order: 2;
			}
			.recruit-contents {
				position: static;
				margin-left: auto;
				max-width: 65.3vw;
			}
			.recruit-btn {
				right: 5vw;
			}
		}
		@media (max-width: 767px) {
			.recruit {
				padding: 30px 0;
			}
			.recruit-design {
				top: 70px;
				width: 80%;
				height: 100px;
			}
			.recruit-contents {
				padding: 30px 40px 26px 30px;
				width: fit-content;
				bottom: unset;
				right: 0;
				top: 30px;
			}
			.recruit-contents p {
				width: 175px;
				margin-top: 16px;
				font-size: 14px;
			}
			.recruit-btn {
				max-width: 48%;
			}
			.recruit-btn a {
				height: 50px;
			}
		}
		@media (max-width: 423px) {
			.recruit-btn a {
				height: 40px;
			}
		}
	}
}

/* page-xx.php */
@media {
	.page-title {
		width: 1200px;
		max-width: 90vw;
		margin-left: auto;
		margin-right: auto;
	}
	.page-title h1 span.title-en {
		font-size: 65px;
		letter-spacing: 0.02em;
		line-height: 80px;
		font-weight: 700;
		font-family: 'pt-sans';
		display: block;
	}
	.page-title h1 span.title-ja {
		font-size: 13px;
		letter-spacing: 0.02em;
		line-height: 17px;
		font-weight: 700;
		display: block;
	}
	@media (max-width: 1023px) {
		.page-title h1 span.title-en {
			font-size: 34px;
			line-height: 44px;
		}
	}
}

/* archive-works.php */
@media {
	.page-works .page-inner {
		padding: 92px 0 150px;
		margin-top: 175px;
		background: linear-gradient(var(--sub-color) 0%,var(--sub-color) 376px,#fff 376px,#fff 100%);
	}
	.page-works-post {
		width: 1200px;
		max-width: 90vw;
		margin-left: auto;
		margin-right: auto;
		padding: 114px 0 0;
		display: flex;
		flex-wrap: wrap;
		gap: 80px;
	}
	.works-block {
		width: 346px;
		max-width: calc(100% / 3 - 160px /3);
	}
	.works-block-thumbnail {
		transition: all 0.2s;
	}
	.works-block-title {
		margin-top: 25px;
	}
	.works-block-title p {
		transition: all 0.2s;
	}
	.works-block-title p:nth-of-type(1) {
		font-size: 18px;
		letter-spacing: 0.08em;
		line-height: 25px;
	}
	.works-block-title p:nth-of-type(2) {
		margin-top: 25px;
		font-size: 15px;
		letter-spacing: 0.08em;
		line-height: 23px;
		color: #8E8E8E;
	}
	.works-block a:hover .works-block-title p {
		color: var(--main-color);
	}
	.works-block a:hover .works-block-thumbnail {
		opacity: 0.7;
	}
	.works-block-link {
		margin-top: 16px;
		display: flex;
		align-items: flex-end;
		flex-wrap: wrap;
	}
	.works-block-link .works-block-link-outer:nth-of-type(2)::before {
		content: '';
		display: inline-block;
		width: 21px;
		border-top: 1px solid #000;
		transform: rotate(-45deg);
		transform-origin: 0 0;
		margin-left: 16px;
		margin-right: 6px;
		margin-top: 16px;
	}
	.works-block-link-outer a[target="_blank"] {
		position: relative;
		font-size: 15px;
		letter-spacing: 0.08em;
		line-height: 1;
		display: inline-block;
		transition: all 0.2s;
	}
	.works-block-link-outer a[target="_blank"]::after {
		content: '';
		display: inline-block;
		width: 14px;
		height: 11px;
		margin-left: 6px;
		background-image: url(images/outer-link.svg);
		background-size: 100% auto;
		background-repeat: no-repeat;
	}
	.works-block-link-outer a:hover {
		color: var(--main-color);
	}
	.wp-pagenavi {
		width: fit-content;
		margin: 157px auto 0px;
		display: flex;
		align-items: center;
		gap: 20px 46px;
	}
	.wp-pagenavi span.current {
		font-size: 22px;
		letter-spacing: 0.06em;
		line-height: 1;
		font-weight: 400;
		font-family: 'pt-sans';
		color: var(--main-color);
	}
	.wp-pagenavi span {
		border: none;
		padding: 0;
		margin: 0;
	}
	.wp-pagenavi a {
		font-size: 22px;
		letter-spacing: 0.06em;
		line-height: 1;
		font-weight: 400;
		font-family: 'pt-sans';
		padding: 0;
		margin: 0;
		color: #000;
		transition: all 0.2s;
		border: none;
	}
	.wp-pagenavi a:hover {
		color: var(--main-color);
	}
	.wp-pagenavi span.extend {
		color: #000;
		padding: 10px 0 0;
		vertical-align: bottom;
	}
	.wp-pagenavi .previouspostslink {
		width: 35px;
		height: 35px;
		color: #000;
		background-image: url(images/arrow-left.svg);
		background-repeat: no-repeat;
		background-size: 20px auto;
		background-position: center center;
		border: 1px solid #000;
		border-radius: 3px;
		margin-right: 24px;
		transition: all 0.2s;
	}
	.wp-pagenavi .previouspostslink:hover {
		background-color: var(--main-color);
		border: 1px solid var(--main-color);
		background-image: url(images/arrow-left-fff.svg);
	}
	.wp-pagenavi .nextpostslink {
		width: 35px;
		height: 35px;
		color: #000;
		background-image: url(images/arrow.svg);
		background-repeat: no-repeat;
		background-size: 20px auto;
		background-position: center center;
		border: 1px solid #000;
		border-radius: 3px;
		margin-left: 24px;
		transition: all 0.2s;
		order: 1;
	}
	.wp-pagenavi .nextpostslink:hover {
		background-color: var(--main-color);
		border: 1px solid var(--main-color);
		background-image: url(images/arrow-fff.svg);
	}
	@media (max-width:1023px) {
		.page-works .page-inner {
			padding: 50px 0;
			margin-top: 95px;
			background: linear-gradient(var(--sub-color) 0%, var(--sub-color) 230px, #fff 230px, #fff 100%);
		}
		.page-works-post {
			justify-content: center;
			gap: 40px 32px;
			padding-top: 28px;
		}
		.page-works-post .works-block {
			max-width: calc(50% - 16px);
		}
		.works-block-title p:nth-of-type(1) {
			font-size: 15px;
			line-height: 27px;
		}
		.works-block-title p:nth-of-type(2) {
			font-size: 13px;
			margin-top: 20px;
		}
		.wp-pagenavi {
			margin-top: 45px;
		}
	}
	@media (max-width:767px) {
		.page-works-post .works-block {
			max-width: 100%;
		}
		.wp-pagenavi {
			margin-top: 60px;
		}
	}
	@media (max-width:423px) {
		.page-news-post {
			gap: 24px 12px;
		}
		.page-news-post .news-block {
			width: 100%;
			max-width: unset;
		}
		.wp-pagenavi {
			margin-top: 40px;
		}
	}
}

/* single-works.php */
@media {
	.single-works {
		width: 100%;
		max-width: 100%;
		padding: 92px 0 150px;
		margin-top: 175px;
		background-color: var(--sub-color);
	}
	.single-works .page-title {
		width: 1098px;
		max-width: 90vw;
	}
	.single-works .inner {
		position: relative;
		margin-top: 108px;
		padding: 100px 188px 176px;
		background-color: #fff;
		border-top: 11px solid var(--main-color);
		border-radius: 5px;
	}
	.single-works-thumbnail {
		width: 100%;
		margin-left: auto;
		margin-right: auto;
	}
	.single-works-thumbnail img {
		width: 100%;
	}
	.single-works-title {
		width: 100%;
		margin-top: 60px;
		margin-left: auto;
		margin-right: auto;
	}
	.single-works-title h1 {
		font-size: 24px;
		letter-spacing: 0.06em;
		line-height: 43px;
		font-weight: 700;
	}
	.single-works-contents {
		width: 594px;
		max-width: 100%;
		margin-left: auto;
		margin-right: auto;
		margin-top: 80px;
	}
	.single-works-contents h2,
	.single-contest-contents h2 {
		font-size: 20px;
		letter-spacing: 0.06em;
		line-height: 32px;
		position: relative;
		padding: 0 0 0 24px;
		margin-top: 80px;
		margin-bottom: 32px;
	}
	.single-works-contents h2::before,
	.single-contest-contents h2::before {
		content: '';
		position: absolute;
		left: 0;
		top: 0;
		width: 8px;
		height: 100%;
		background-color: var(--main-color);
	}
	.single-works-contents h3,
	.single-contest-contents h3 {
		font-size: 18px;
		letter-spacing: 0.06em;
		line-height: 26px;
		font-weight: 700;
		margin-top: 40px;
		margin-bottom: 16px;
	}
	.single-works-contents p,
	.single-contest-contents p {
		font-size: 15px;
		letter-spacing: 0;
		line-height: 34px;
		font-weight: 700;
		margin: 12px 0 40px;
	}
	.single-works-contents .wp-block-image {
		margin: 64px 0;
	}
	.single-works-contents img {
		width: auto;
		height: auto;
		max-width: 100%;
	}
	.single-works-contents p a,
	.single-contest-contents p a {
		-webkit-text-decoration: 1px underline;
		text-decoration: 1px underline;
		text-decoration: underline;
		text-decoration-thickness: 1px;
		color: var(--main-color);
	}
	.single-works-contents ul li {
		font-size: 18px;
		letter-spacing: 0.08em;
		line-height: 1.5;
		font-family: 'Josefin Sans', 'noto-sans-cjk-jp';
	}
	.single-works-contents ul li::before {
		content: '';
		display: inline-block;
		width: 8px;
		height: 8px;
		margin-bottom: 3px;
		margin-right: 12px;
		background: linear-gradient(134deg, #D1344E 0%, #264C9A 100%);
	}
	.single-works-contents .wp-block-quote {
		background-color: #222222;
		padding: 32px 24px;
		margin: 60px 0;
	}
	.single-works-contents .wp-block-quote p {
		margin: 0;
		font-size: 15px;
		letter-spacing: 0;
		line-height: 34px;
		font-weight: 700;
	}
	.single-works-contents .wp-block-quote cite {
		margin: 16px 0 0 auto;
		display: block;
		text-align: right;
		font-size: 15px;
		letter-spacing: 0;
		line-height: 34px;
		font-weight: 700;
		color: rgba(255, 255, 255, 0.4);
	}
	.single-works-url {
		margin-top: 58px;
		width: 594px;
		max-width: 100%;
		margin-left: auto;
		margin-right: auto;
	}
	.single-works-url p {
		font-size: 15px;
		letter-spacing: 0.08em;
		line-height: 19px;
		font-weight: 700;
	}
	.single-works-url a {
		color: var(--main-color);
		display: inline-block;
		font-size: 20px;
		letter-spacing: 0.08em;
		line-height: 26px;
		font-weight: 700;
		margin-top: 6px;
		display: block;
		gap: 2px;
		transition: all 0.2s;
	}
	.single-works-url a::after {
		content: '';
		display: inline-block;
		width: 14px;
		height: 9px;
		margin-left: 5px;
		margin-bottom: 2px;
		background-image: url(images/outer-link.svg);
		background-size: 100% auto;
		background-repeat: no-repeat;
	}
	.single-works-url a:hover {
		text-decoration: underline 1px var(--main-color);
	}
	.youtube-btn {
		position: absolute;
		bottom: -30px;
		left: 0;
		right: 0;
		margin: auto;
		width: 346px;
		height: 60px;
		max-width: 100%;
	}
	.youtube-btn a {
		width: 100%;
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 2px;
		color: #fff;
		background-color: var(--main-color);
		transition: all 0.2s;
	}
	.youtube-btn a:hover {
		text-decoration: underline 1px #fff;
	}
	.back-btn {
		margin-top: 175px;
	}
	.back-btn a {
		width: 142px;
		height: 35px;
		margin-left: auto;
		margin-right: auto;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 6px;
		border: 1px solid #000;
		border-radius: 3px;
		font-size: 13px;
		letter-spacing: 0.02em;
		line-height: 17px;
		transition: all 0.2s;
	}
	.back-btn a svg {
		transition: all 0.2s;
	}
	.back-btn a:hover {
		background-color: var(--main-color);
		color: #fff;
		border: 1px solid var(--main-color);
	}
	.back-btn a:hover svg {
		fill: #fff;
	}
	@media (max-width:1023px) {
		.single-works {
			padding: 50px 0;
			margin-top: 95px;
		}
		.single-works .inner {
			margin-top: 28px;
			padding: 41px 5% 75px;
		}
		.single-works-title {
			margin-top: 30px;
		}
		.single-works-title h1 {
			font-size: 15px;
			line-height: 27px;
		}
		.single-works-contents {
			margin-top: 50px;
		}
		.single-works-url {
			margin-top: 50px;
		}
		.single-works-contents h2,
		.single-contest-contents h2 {
			font-size: 20px;
			padding: 0;
			margin-top: 40px;
			margin-bottom: 20px;
			padding-left: 8px;
		}
		.single-works-contents h2::before,
		.single-contest-contents h2::before {
			width: 4px;
		}
		.single-works-contents p,
		.single-contest-contents p {
			margin: 12px 0 24px;
		}
		.single-works-contents .wp-block-image {
			margin: 40px 0;
		}
		.single-works-contents .wp-block-quote {
			padding: 20px;
			margin: 40px 0;
		}
		.youtube-btn {
			width: 277px;
		}
		.back-btn {
			margin-top: 82px;
		}
	}
}

/* archive-agent.php */
@media {
	/* Tab Bar */
	.jquery-tab-pager-tabbar {
		width: fit-content;
		margin: 0;
		padding: 0;
		display: flex;
		justify-content: flex-start;
		flex-wrap: wrap;
		gap: 15px;
		margin-top: 100px;
		max-width: 90vw;
		margin-left: auto;
		margin-right: auto;
	}
	.jquery-tab-pager-tabbar li {
		padding: 10px 22px 9px;
		border: 1px solid #8E8E8E;
		color: #8E8E8E;
		border-radius: 3px;
		font-size: 18px;
		letter-spacing: 0;
		line-height: 23px;
		font-weight: 700;
		cursor: pointer;
		transition: all 0.2s;
	}
	.jquery-tab-pager-tabbar li:hover {
		transform: scale(1.1);
	}
	.jquery-tab-pager-tabbar li.current {
		background-color: var(--main-color);
		border: 1px solid var(--main-color);
		color: #fff;
	}
	.page-agent .page-inner {
		margin-top: 192px;
		padding: 75px 0 150px;
		background-color: var(--sub-color);
	}
	.page-agent .page-title {
		width: 1098px;
	}
	.page-agent #wrapper {
		display: flex;
		flex-direction: column;
		margin-top: 100px;
	}
	.page-agent-flex {
		display: flex;
		flex-wrap: wrap;
		gap: 80px 56px;
		width: 1150px;
		max-width: 95vw;
		margin-left: auto;
		margin-right: auto;
	}
	.page-agent-block {
		width: 346px;
		max-width: 100%;
		height: auto;
		transition: all 0.3s;
	}
	.page-agent-block a {
		display: block;
		height: 100%;
	}
	.page-agent-block:hover {
		transform: translateY(-10px);
	}
	.page-agent-img {
		width: 252px;
		height: 252px;
		margin-left: auto;
		margin-right: auto;
		border-radius: 75px;
		overflow: hidden;
	}
	.page-agent-img img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center;
	}
	.page-agent-box {
		height: calc(100% - 126px);
		margin-top: -126px;
		background-color: #fff;
		padding: 126px 40px 36px;
		transition: all 0.3s;
	}
	.page-agent-block:hover .page-agent-box {
		box-shadow: 7px 10px 11px #FD83102C;
	}
	.page-agent-name p:nth-of-type(1) {
		margin-top: 15px;
		text-align: center;
		font-size: 20px;
		letter-spacing: 0.08em;
		line-height: 27px;
	}
	.page-agent-name p:nth-of-type(2) {
		margin-top: 5px;
		text-align: center;
		font-size: 10px;
		letter-spacing: 0.02em;
		line-height: 1;
		font-family: 'pt-sans';
		color: var(--main-color);
	}
	.page-agent-cat {
		margin-top: 16px;
	}
	.page-agent-cat ul {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	}
	.page-agent-cat ul li {
		font-size: 15px;
		letter-spacing: 0.08em;
		line-height: 23px;
		font-weight: 700;
	}
	.page-agent-cat ul li::before {
		content: '/';
	}
	.page-agent-cat ul li:nth-of-type(1)::before {
		content: '';
	}
	.page-agent-explain {
		margin-top: 26px;
	}
	.page-agent-explain p {
		font-size: 15px;
		letter-spacing: 0.08em;
		line-height: 27px;
		color: #8E8E8E;
		text-align: center;
	}
	/* Page Navigation */
	#jquery-tab-pager-navi {
		margin: 150px 0 0;
		padding: 0;
		overflow: hidden;
		order: 1;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 20px 46px;
	}
	#jquery-tab-pager-navi li {
		list-style: none;
		display: inline;
	}
	#jquery-tab-pager-navi li a {
		font-size: 22px;
		letter-spacing: 0.06em;
		line-height: 1;
		font-weight: 400;
		font-family: 'pt-sans';
		padding: 0;
		margin: 0;
		color: #000;
		transition: all 0.2s;
		border: none;
	}
	#jquery-tab-pager-navi li a:hover {
		color: var(--main-color);
	}
	#jquery-tab-pager-navi li:last-child a {
		margin-right: 0px;
	}
	#jquery-tab-pager-navi li a.current,
	#jquery-tab-pager-navi li a.disable,
	#jquery-tab-pager-navi li a:hover {
	}
	#jquery-tab-pager-navi li a.disable {
		cursor: default;
	}
	#jquery-tab-pager-navi li a.current {
		color: var(--main-color);
		cursor: default;
	}
	#jquery-tab-pager-navi li a.disable.previos:hover,#jquery-tab-pager-navi li a.disable.next:hover {
		background-color: #8E8E8E;
		border: 1px solid #8E8E8E;
	}
	#jquery-tab-pager-navi li a.previos {
		display: inline-block;
		width: 35px;
		height: 35px;
		color: #000;
		background-image: url(images/arrow-left.svg);
		background-repeat: no-repeat;
		background-size: 20px auto;
		background-position: center center;
		border: 1px solid #000;
		border-radius: 3px;
		margin-right: 24px;
		transition: all 0.2s;
	}
	#jquery-tab-pager-navi li a.previos:hover {
		background-color: var(--main-color);
		border: 1px solid var(--main-color);
		background-image: url(images/arrow-left-fff.svg);
	}
	#jquery-tab-pager-navi li a.next {
		display: inline-block;
		width: 35px;
		height: 35px;
		color: #000;
		background-image: url(images/arrow.svg);
		background-repeat: no-repeat;
		background-size: 20px auto;
		background-position: center center;
		border: 1px solid #000;
		border-radius: 3px;
		margin-left: 24px;
		transition: all 0.2s;
		order: 1;
	}
	#jquery-tab-pager-navi li a.next:hover {
		background-color: var(--main-color);
		border: 1px solid var(--main-color);
		background-image: url(images/arrow-fff.svg);
	}
	@media (max-width: 1023px) {
		.page-agent .page-inner {
			padding: 30px 0 50px;
			margin-top: 80px;
		}
		.jquery-tab-pager-tabbar {
			margin-top: 18px;
			gap: 8px;
		}
		.jquery-tab-pager-tabbar li {
			padding: 6px 12px 7px;
			font-size: 15px;
			line-height: 19px;
		}
		.page-agent #wrapper {
			margin-top: 40px;
		}
		.page-agent-flex {
			gap: 40px;
			width: 732px;
			max-width: 100%;
			margin-left: auto;
			margin-right: auto;
			margin-top: 0;
		}
		.page-agent-box {
			padding: 126px 30px 45px;
		}
		#jquery-tab-pager-navi {
			margin-top: 48px;
		}
	}
	@media (max-width: 767px) {
		.page-agent-flex {
			align-items: center;
			flex-direction: column;
			max-width: 90vw;
		}
	}
}

/* single-agent.php */
@media {
	.single-agent {
		width: 100%;
		max-width: 100%;
		padding: 92px 0 150px;
		margin-top: 175px;
		background-color: var(--sub-color);
	}
	.single-agent .page-title {
		width: 1098px;
		max-width: 90vw;
	}
	.single-agent .inner {
		position: relative;
		margin-top: 108px;
		padding: 100px 188px 136px;
		background-color: #fff;
		border-top: 11px solid var(--main-color);
		border-radius: 5px;
	}
	.single-agent-name p:nth-of-type(1) {
		text-align: center;
		font-size: 24px;
		letter-spacing: 0.08em;
		line-height: 27px;
	}
	.single-agent-name p:nth-of-type(2) {
		margin-top: 5px;
		text-align: center;
		font-size: 10px;
		letter-spacing: 0.02em;
		line-height: 1;
		font-family: 'pt-sans';
		color: var(--main-color);
	}
	.single-agent-cat {
		margin-top: 16px;
	}
	.single-agent-cat ul {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	}
	.single-agent-cat ul li {
		font-size: 15px;
		letter-spacing: 0.08em;
		line-height: 23px;
		font-weight: 700;
	}
	.single-agent-cat ul li::before {
		content: '/';
	}
	.single-agent-cat ul li:nth-of-type(1)::before {
		content: '';
	}
	.single-agent-thumbnail {
		width: 534px;
		max-width: 100%;
		margin-left: auto;
		margin-right: auto;
		margin-top: 78px;
		position: relative;
	}
	.single-agent-url {
		position: absolute;
		right: -66px;
		bottom: 0;
		height: fit-content;
		display: flex;
		flex-direction: column;
		gap: 9px;
	}
	.single-agent-url a {
		display: inline-block;
		width: 36px;
		height: 36px;
		display: flex;
		align-items: center;
		justify-content: center;
		background-color: #000;
		border-radius: 100%;
	}
	.single-agent-url a:hover {
		animation: yure 1s infinite;
	}
	@keyframes yure {
    0% {
      transform: translate(2px, 0px);
    }
    10% {
      transform: translate(-2px, 0px);
    }
    20% {
      transform: translate(2px, 0px);
    }
    30% {
      transform: translate(-2px, 0px);
    }
    40% {
      transform: translate(0px, 0px);
    }
	}
	.single-agent-btn {
		position: absolute;
		bottom: -30px;
		left: 0;
		right: 0;
		margin: auto;
		width: 346px;
		height: 60px;
		max-width: 100%;
	}
	.single-agent-btn a {
		width: 100%;
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 6px;
		color: #fff;
		background-color: var(--main-color);
		transition: all 0.2s;
		font-size: 15px;
		letter-spacing: 0;
		line-height: 19px;
		font-weight: 700;
		border-radius: 3px;
	}
	.single-agent-btn a svg {
		padding-top: 2px;
		display: inline-block;
		transition: all 0.3s;
	}
	.single-agent-btn a:hover svg {
		transform: translateX(16px);
	}
	@media (max-width: 1023px) {
		.single-agent {
			padding: 50px 0;
			margin-top: 95px;
		}
		.single-agent .inner {
			margin-top: 28px;
			padding: 41px 5% 80px;
		}
		.single-agent-thumbnail {
			margin-top: 40px;
		}
		.single-agent-btn {
			width: 277px;
		}
	}
	@media (max-width: 767px) {
		.single-agent-thumbnail {
			max-width: 72vw;
		}
		.single-agent-url {
			position: static;
			flex-direction: row;
			justify-content: flex-end;
			gap: 5px;
			margin-top: 10px;
		}
		.single-agent-url a {
			width: 30px;
			height: 30px;
		}
	}
}

/* 404.php */
@media {
	.page-404 {
		padding: 92px 0 150px;
		margin-top: 175px;
		background-color: var(--sub-color);
	}
	.btn-404 a {
		margin-left: 0;
	}
	.text-404 {
		margin: 40px 0;
	}
	.text-404 p {
		font-size: 18px;
		letter-spacing: 0.02em;
		line-height: 24px;
		font-weight: 700;
	}
	@media (max-width: 1023px) {
		.page-404 {
			padding: 50px 0;
			margin-top: 95px;
		}
		.text-404 p {
			font-size: 16px;
			line-height: 22px;
		}
	}
}