@charset "utf-8";

@media screen and (max-width: 768px) {
   
	body {
    -webkit-text-size-adjust: none;		
  }
   
  br.sp {
    display: inline !important;
  }
  br.pc,img.pc,span.sp_non {
    display: none;
  }
	img.sp {
		display: inline-block;
	}
	
	.wp-block-embed iframe {
		width: 100%;
		height: 100%;
		aspect-ratio: 16 / 9;
	}
      
    
  .sa--left {
    transform: translate(10px, 0);
  }
  .sa--right {
    transform: translate(-10px, 0);
  }
  .sa--up {
    transform: translate(0, 10px);
  }
  .sa--down {
    transform: translate(0, -10px);
  }
	.sa--sp {
		transform: translate(0,10px) rotate(10deg);
	}
	
	
	/*===== header =====*/
	header {
		z-index: 50001;
	}
	header.mv {
		height: 70px;
		background-color: rgba(255,255,255,0.9);
	}
	header.mv.wn {
		background-color: transparent;
	}
	
	h1 {
		width: 184px;
		margin: 19px 0 0 20px;
	}
	header.mv h1 {
		width: 184px;
	}
	
	h1 a {
		opacity: 1;
		pointer-events: auto;
	}
	header.mv h1 a img {
		clip-path: inset(0 0 0 0);
	}
	
	h1.hid a,
	body.top h1 a,
	body.top header.mv h1.hid a,
	header a.tel.hid {
		opacity: 0;
		pointer-events: none;
	}
	body.top h1 a.on {
		opacity: 1;
		pointer-events: auto;
	}
	
	header a.tel {
		display: block;
		position: absolute;
		right: 75px;
		top: 19px;
		width: 32px;
		height: 32px;
		pointer-events: auto;
		transition: all .3s;
	}
	
	.menu_btn {
		position: absolute;
		right: 24px;
		top: 25px;
		z-index: 10;
		width: 35px;
		height: 18px;
		line-height: 1em;
		transition: all .4s;
	}

	.menu-trigger,
	.menu-trigger div {
		display: inline-block;
		transition: all .4s;
		box-sizing: border-box;
	}
	.menu-trigger {
		position: relative;
		width: 100%;
		height: 100%;
		pointer-events: auto;
	}
	.menu-trigger:hover {
		opacity: 1;
	}
	.menu-trigger div {
		position: absolute;		
		width: 100%;
		height: 2px;
		background-color: var(--bl1);
		border-radius: 4px;
	}
	.menu_btn.w .menu-trigger div {
		background-color: #fff;
	}

	.menu-trigger div:nth-of-type(1) {
		top: 0;
		right: 0;
	}
	.menu-trigger div:nth-of-type(2) {
		left: 0;
		top: 8px;
	}
	.menu-trigger div:nth-of-type(3) {
		left: 0;
		top: 16px;
		width: 23px;
	}
		
	.menu-trigger.active div {
	
	}
	.menu-trigger.active div:nth-of-type(1) {
		transform: translateY(8px) rotate(-45deg);
	}
	.menu-trigger.active div:nth-of-type(2) {
		opacity: 0;
	}
	.menu-trigger.active div:nth-of-type(3) {
		transform: translateY(-8px) rotate(45deg);
		width: 100%;
	}

	/*----- menu -----*/
	#menu {
		position: fixed;
		left: 0;
		top: 0;
		z-index: 50000;
		width: 100%;
		height: 100dvh;
		padding: 75px 0 0;
		overflow-y: scroll;
		background-color: #fff;
		opacity: 0;
		transition: all .3s;
		pointer-events: none;
	}
	#menu.open {		
		opacity: 1;
		pointer-events: auto;
	}
	
	#menu .logo {
		position: absolute;
		left: 19px;
		top: 19px;
		width: 75px;
	}
	
	#menu ul.list {
		padding: 0 35px 10px;
	}
	#menu ul.list li {
		font-size: 16px;
		line-height: 1em;
		border-bottom: 1px solid var(--gy1);
	}
	#menu ul.list li:last-of-type {
		border-bottom: none;
	}
	#menu ul.list li a {
		display: block;
		color: var(--key);
		font-size: 16px;
		font-weight: 500;
		letter-spacing: 0.09em;
		line-height: 1em;
		padding: 25px 15px;
	}
	
	#menu ul.btn {
		width: 275px;
		margin: auto;
	}
	#menu ul.btn li {
		line-height: 1em;
		margin-bottom: 25px;
	}
	#menu ul.btn li a {
		display: block;
		color: #fff;
		font-size: 16px;
		font-weight: 700;
		letter-spacing: 0.09em;
		line-height: 1em;
		text-align: center;
		width: 100%;
		height: 50px;
		padding-top: 16px;
		border-radius: 25px;
		background-color: var(--bl2);
	}
/*	#menu ul.btn li:first-of-type a {
		background-color: var(--gn1);
	}*/
	
	#menu .copy {
		color: var(--bk2);
		font-size: 13px;
		font-weight: 500;
		letter-spacing: 0.09em;
		line-height: 1.53em;
		text-align: center;
		margin-top: 40px;
	}
	
	
	/*===== footer =====*/
	footer {
		
	}
	
	footer .cont {		
		width: 100%;
		padding: 82px 0 0;
	}
	
	footer .box1 {
		display: block !important;
		position: relative;
		width: 100%;
		padding: 0 0 55px;
		border-right: none;
	}
	footer .box1::after {
		content: "";
		display: block;
		position: absolute;
		left: 25px;
		bottom: 0;
		width: calc(100% - 50px);
		height: 1px;
		background-color: #fff;
	}

	footer .box1 .logo {
		width: 144px;
		margin: 0 auto 25px;
	}
	footer .box1 .logo a {
		display: block;
	}

	footer .box1 .text {
		width: 100%;
		text-decoration: none;
	}
	footer .box1 .text p {
		text-align: center;		
	}
	footer .box1 .text p:nth-of-type(1) {
		font-size: 18px;
		text-decoration: underline;
		text-underline-offset: 4px;
		margin-bottom: 1.8em;
	}
	footer .box1 .text p:nth-of-type(1) a {
		pointer-events: auto;
	}

	footer .box1 .text p:nth-of-type(2) {
		font-size: 15px;
		letter-spacing: 0.06em;
		line-height: 1em;
		margin-bottom: 1.2em;
	}
	footer .box1 .text p:nth-of-type(3),
	footer .box1 .text p:nth-of-type(4) {
		font-size: 14px;
		letter-spacing: 0;
		line-height: 1.64em;
		margin-bottom: 0;
	}
	
	footer .box1 ul.btn_sp {
		padding: 40px 25px 0;
	}
	footer .box1 ul.btn_sp li:last-of-type {
		margin-top: 25px;
	}
	footer .box1 ul.btn_sp li a {
		display: block;
		color: #fff;
		font-size: 16px;
		font-weight: 700;
		letter-spacing: 0.09em;
		line-height: 1em;
		text-align: center;
		width: 100%;
		height: 50px;
		padding-top: 16px;
		border-radius: 25px;
		background-color: var(--bl2);
	}
	footer .box1 ul.btn_sp li:last-of-type a {
		background-color: var(--gn1);
	}
	
	
	footer .box2 {
		width: 100%;
		padding: 55px 25px 0;
	}
	
	footer .box2 p:first-of-type {	
		font-size: 14px;
		letter-spacing: 0.05em;
		line-height: 1em;
		text-align: center;
		width: 100%;
		height: 74px;
		padding: 15px 0 0;
		border-radius: 37px;
	}
	footer .box2 p:first-of-type span {
		display: block;
		font-size: 16px;
		letter-spacing: 0.1em;
		margin-bottom: 0.7em;
	}
	
	footer .box2 .btn_box {
		text-align: center;
		margin: 20px 0 30px;
	}
	
	footer .box2 .map {
		width: 258px;		
	}
	
	footer .box2 ul.list {
		padding: 55px 0 0;
		border-top: 1px solid #fff;
		margin-top: 65px;
	}
	
	footer .box2 ul.list li {
		position: relative;
		font-size: 15px;
		line-height: 1em;
		padding-left: 0.8em;
		margin-bottom: 1.5em;
	}
	footer .box2 ul.list li::before {
		content: "";
		display: block;
		position: absolute;
		left: 0;
		top: calc(50% - 1px);			
		width: 4px;
		height: 4px;
		background-color: var(--key);
		border-radius: 50%;
	}
	footer .box2 ul.list li a {
		color: var(--key);
		font-size: 15px;
		letter-spacing: 0.1em;
		line-height: 1em;
	}
	
	
	footer .totop {		
		right: 25px;
		bottom: 100px;
		width: 50px;
	}

	footer .copy {
		font-size: 13px;
		letter-spacing: 0.09em;
		line-height: 1.53em;
		width: 100%;
		padding: 30px 0 10px;
	}
	
	
	/*===== common =====*/
	h2.midashi {
		font-size: 21px;
		letter-spacing: 0.1em;
		line-height: 1.52em;
		margin-bottom: 48px;
	}
	h2.midashi::after {
		left: calc(50% - 31px);
		bottom: -15px;
		width: 62px;
	}
	
	/*----- btn -----*/
	a.btn {
		font-size: 16px;
		letter-spacing: 0.07em;
	}
	a.btn::after {
		width: 40px;
		height: 40px;
		background: url("../img/mark_more.png") no-repeat 0 0 / 40px 40px;	
	}
	a.btn2 {
		font-size: 14px;
		letter-spacing: 0.1em;
		text-underline-offset: 6px;
		padding: 0 0 6px 35px;
	}
	a.btn2::after {
		top: -4px;
		width: 25px;
		height: 25px;
		background: url("../img/mark_more2.png") no-repeat 0 0 / 25px 25px;
	}
	
	/*----- bottom img -----*/
	.b_img {
		height: 270px;
	}
	
	/*----- horizontal slide -----*/
	#m_slide {		
		height: 235px;
	}
	#m_slide .swiper-slide {
		width: 300px !important;
		height: 235px !important;
		margin-right: 5px;
	}
	
	/*----- page -----*/
	.page_h {
		height: calc(240px + 64px);
		padding: 64px 20px 0;
	}
	.page_h::before {
		content: "";
		display: block;
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 82px;
		background: url("../img/header_back_sp.png") no-repeat 50% 100% / 375px 82px;
	}
	.page_h h2 {
		left: 40px;
		top: calc(50% + 32px);
		transform: translate(0,-50%);
		font-size: 20px;
		letter-spacing: 0.1em;
		line-height: 1.55em;
	}
	.page_h h2 span {
		font-size: 14px;
		letter-spacing: 0.1em;
		margin-bottom: 30px;
	}
	.page_h h2 span::after {
		bottom: -10px;
		width: 28px;
	}
	
	/*----- read -----*/
	.read {
		width: 100%;
		margin: 60px auto 80px;
	}
	.read .flex {
		display: block !important;
	}
	.read .i {
		width: 350px;
		height: 235px;
		margin: 50px 0 0 auto;
	}
	.read .text {
		width: 100%;
		padding: 0 25px;
	}
	.read .text p {
		color: var(--bk1);
		font-size: 16px;
		letter-spacing: 0.08em;
		line-height: 2em;
	}
	.read .text p {
		font-size: 15px;
		letter-spacing: 0.07em;
	}
	.read .text p:first-of-type {		
		font-size: 18px;
		letter-spacing: 0.07em;
		line-height: 1.94em;
		margin-bottom: 28px;
	}
	
	
	/*===== Top page =====*/
	#first_text {
		height: 100dvh;
	}
	#first_text img {
		width: 156px;
		height: auto;
	}

	/*----- fv -----*/
	#fv {
		height: auto;
		padding: 60px 20px 0;
	}
	#fv::before {
		height: 82px;
		background: url(../img/header_back_sp.png) no-repeat 50% 100% / 375px 82px;
	}
	
	#fv .logo {
		position: absolute;
		left: 35px;
		top: 27px;
		z-index: 10000;
		width: 105px;
		height: auto;
	}
	
	#fv .text {		
		left: 45px;
		top: 250px;
	}
	#fv .text p {		
		font-size: 17px;
		letter-spacing: 0.1em;
		line-height: 2em;
	}
	#fv .text p:first-of-type {
		line-height: 1em;
		margin-bottom: 22px;
	}

	
	/*----- Message -----*/
	#msg {
		width: 100%;
		padding: 0 25px;
		margin: 70px auto 85px;
	}

	#msg h2 {
		position: relative;
		right: auto;
		top: auto;
	}
	#msg h2 div {
		position: relative;
		right: auto;
		top: auto;
		font-size: 18px;
		letter-spacing: 0.15em;
		line-height: 1.94em;
		text-align: center;
		writing-mode: horizontal-tb;
		width: 100%;
		height: auto;
		margin: 35px 0 40px;
	}
	#msg h2 span {
		position: relative;
		left: auto;
		top: auto;
		transform-origin: left top;
		transform: rotate(0deg) translate(0,0);
		font-size: 14px;
		letter-spacing: 0.12em;
		text-align: center;
		width: 100%;
	}
	#msg h2 span::after {
		left: calc(50% - 11px);
		bottom: -10px;
		width: 22px;
		height: 1px;
	}

	#msg .text {
		width: 100%;
	}
	#msg .text p {
		font-size: 15px;
		font-weight: 500;
		letter-spacing: 0.07em;
		line-height: 2em;
		margin-bottom: 2em;
	}
	#msg .text p:last-of-type {
		margin: 2em 0 0;
	}

	#msg .btn_box {
		position: static;
		right: auto;
		bottom: auto;
		text-align: right;
		margin-top: 25px;
	}
	
	/*----- About -----*/
	#top_about {
		padding: 80px 0 95px;
	}
	
	#top_about h2 {
		margin-bottom: 35px;
	}
	#top_about h2 div {
		font-size: 21px;
		letter-spacing: 0.1em;
		line-height: 1.52em;
	}
	#top_about h2 span {
		font-size: 14px;
		font-weight: 400;
		letter-spacing: 0.12em;
		line-height: 1em;
		margin-bottom: 28px;
	}
	#top_about h2 span::after {
		left: calc(50% - 14px);
		bottom: -10px;
		width: 28px;
	}

	#top_about .box {
		display: block !important;
		width: 100%;
		padding: 0 25px;
		margin: 0 auto 60px;
	}

	#top_about .box .i {
		width: 100%;
		margin-bottom: 45px;
	}

	#top_about .text {
		width: 100%;
		padding-left: 0;
	}
	#top_about .text p {
		font-size: 15px;
		letter-spacing: 0.07em;
		text-align: center;
	}
	#top_about .text p:first-of-type {
		font-size: 18px;
		font-weight: 500;
		letter-spacing: 0.07em;
		line-height: 1.94em;
		margin-bottom: 2em;
	}
	#top_about .text p:first-of-type mark {
		background-color: #fff;
	}

	#top_about h3 {
		font-size: 21px;
		letter-spacing: 0.1em;
		margin-bottom: 52px;
	}
	#top_about h3::after {
		left: calc(50% - 31px);
		bottom: -22px;
		width: 62px;
	}

	#top_about .slide {
		position: relative;
		width: 100%;
		margin: 0 auto 75px;
	}
	#top_about .slide .swiper-wrapper {
		justify-content: space-between;
		align-items: stretch !important;	
	}
	#top_about .slide .swiper-slide {
		width: 285px;
		padding: 40px 27px 30px;
		margin: 25px 10px 0;
		border-radius: 5px;
	}
	#top_about .slide .b_st {
		display: block;
		left: 0;
		bottom: -28px;
		font-size: 8px; /*位置がずれるのを解消*/
		width: 100%;
		height: 8px;
	}
	#top_about .slide .swiper-pagination-bullet {
		width: 8px;
		height: 8px;
		background-color: #fff;
		margin: 0 8px;
		opacity: 1;
	}
	#top_about .slide .swiper-pagination-bullet-active {
		background-color: var(--key);
	}
	
	#top_about .slide .swiper-slide .no {
		left: calc(50% - 25px);
		top: -25px;
		font-size: 28.985px;
		width: 50px;
		height: 50px;
		padding-top: 11px;
	}
	#top_about .slide .swiper-slide .title {
		display: flex;
		flex-direction: column;
		justify-content: center;
		padding-bottom: 25px;
		margin-bottom: 25px;
		background-image: radial-gradient(circle, var(--key) 1px, transparent 1px);
		background-size: 8px 2px;
		background-repeat: repeat-x;
		background-position: left bottom;
	}
	#top_about .slide .swiper-slide .title span {
		font-size: 18px;
		letter-spacing: 0.04em;
		padding: 4px;
		margin: 3px auto;
	}
	#top_about .slide .swiper-slide p {		
		font-size: 15px;
		letter-spacing: 0.07em;
		line-height: 1.8em;
	}
	
	#top_about .slide img.mark {
		position: absolute;
		left: 50%;
		bottom: 70px;
		z-index: 10;
		transform: translate(-50%, 0);
		transition: all .3s;
	}
	#top_about .slide.fd img.mark {
		opacity: 0;
	}
	

	/*----- Service -----*/
	#top_service {
		width: calc(100% - 20px);
		padding: 60px 25px 75px;
		margin: 80px auto;
		border-radius: 25px;
	}
	
	#top_service h2 {
		margin-bottom: 40px;
	}
	#top_service h2 div {
		font-size: 21px;
		letter-spacing: 0.1em;
		line-height: 1.52em;
	}
	#top_service h2 span {
		font-size: 14px;
		font-weight: 400;
		letter-spacing: 0.12em;
		line-height: 1em;
		margin-bottom: 28px;
	}
	#top_service h2 span::after {
		left: calc(50% - 14px);
		bottom: -10px;
		width: 28px;
	}
	
	#top_service .text p {	
		font-size: 15px;
		letter-spacing: 0.07em;
		line-height: 1.66em;
		text-align: left;
	}
	
	#top_service ul {
		display: block !important;
		margin: 40px 0 45px;
	}
	#top_service ul li {
		width: 100%;
	}
	#top_service ul li:nth-of-type(1) {
		margin-bottom: 35px;
	}
	#top_service ul li a {
		border-radius: 7px;
	}
	#top_service ul li a .i {
		height: 175px;
		border-radius: 7px 7px 0 0;
	}
	#top_service ul li a .title {
		position: relative;
		align-items: center;
		width: 100%;
		height: 50px;
		padding-left: 12px;
	}
	#top_service ul li a .title::after {
		right: 12px;
		top: calc(50% - 12px);
		width: 24px;
		height: 24px;
		background: url(../img/mark_more2.png) no-repeat 0 0 / 24px 24px;
	}
	#top_service ul li a .title img {
		height: 30px;
	}
	#top_service ul li a .title div {
		font-size: 16px;
		letter-spacing: 0.07em;
		margin-left: 10px;
	}
	
	.top_qa {
		padding-top: 60px;
		margin-top: 75px;
		background-image: radial-gradient(circle, var(--key) 1px, transparent 1px);
		background-size: 8px 2px;
		background-repeat: repeat-x;
		background-position: left top;
	}

	.top_qa h2 {
		font-size: 21px;
		letter-spacing: 0.1em;
		text-decoration: underline;
		text-underline-offset: 10px;
		text-decoration-thickness: 1px;
		margin-bottom: 40px;
	}

	.top_qa .btn_box {
		text-align: center !important;
		margin-top: 50px;
	}
	
	/*----- News -----*/
	#top_news {
		width: 100%;
		padding: 0 25px 80px;
	}
	#top_news h2 {
		position: static;
		left: auto;
		top: auto;
		text-align: center;
	}
	#top_news h2 div {
		position: relative;
		left: auto;
		top: auto;
		font-size: 21px;
		letter-spacing: 0.1em;
		line-height: 1em;
		writing-mode: horizontal-tb;
		width: 100%;
		height: 21px;
		margin: 20px 0 10px;
	}
	#top_news h2 span {
		display: inline-block;
		position: relative;
		left: auto;
		top: auto;
		transform-origin: left top;
		transform: rotate(0deg) translate(0,0);
		font-size: 14px;
		font-weight: 400;
		letter-spacing: 0.12em;
		line-height: 1em;
		padding-bottom: 0;
		border-bottom: none;
	}
	#top_news h2 span::after {
		content: "";
		display: block;
		position: absolute;
		left: calc(50% - 11px);
		bottom: -8px;
		width: 22px;
		height: 1px;
		background-color: var(--gy2);
	}

	#top_news ul {
		margin: 0 0 30px;
	}
	#top_news ul li {
		border-bottom: 1px solid var(--gy1);
	}
	#top_news ul li a {
		display: block;
		padding: 20px 35px 20px 0;
		background: url("../img/link_arrrow_sp.png") no-repeat 100% 50% / 10px 14px;
	}
	#top_news ul li a .sub {		
		font-size: 13px;
		letter-spacing: 0.18em;
	}
	#top_news ul li a .date {
		position: relative;
		margin-right: 1em;
	}
	#top_news ul li a .date::after {
		right: -6px;
		top: 0;
		width: 1px;
		height: 14px;
	}
	#top_news ul li a .title {
		font-size: 15px;
		line-height: 1.66em;
	}

	#top_news .btn_box {
		text-align: right;
	}
	
	
	/*===== Features =====*/
	#features_about {	
		width: calc(100% - 20px);
		margin: 0 auto 75px;
		border-radius: 25px;
	}

	#features_about .flex {
		display: block !important;
		padding: 60px 25px 0;
	}

	#features_about .text {
		width: 100%;
		padding-top: 0;
	}
	#features_about .text h2 {
		font-size: 18px;
		letter-spacing: 0.1em;
		padding: 5px 10px;
		margin-bottom: 25px;
		border-left: 2px solid var(--key);
	}
	#features_about .text p {		
		font-size: 15px;
		letter-spacing: 0.04em;
	}

	#features_about .i {
		width: 100%;
		height: auto;
		margin-top: 0;
	}
	
	
	#features_can {
		width: 100%;
		padding: 0 25px;
	}

	#features_can .text p {
		font-size: 15px;
		letter-spacing: 0.07em;
		line-height: 1.66em;
		text-align: left;
	}

	#features_can ul {
		justify-content: space-between;
		padding: 25px 0 60px;
	}
	#features_can ul li {
		font-size: 15px;
		letter-spacing: 0.05em;
		line-height: 1.46em;
		width: calc((100% - 15px) / 2);
		margin-bottom: 25px;
	}
	#features_can ul li .i {
		width: 100%;
		height: 145px;
		margin-bottom: 10px;
		border-radius: 10px;
	}
	
	
	#features_system {
		padding: 60px 0 55px;
	}

	#features_system .flex {
		display: block !important;
		width: 100%;
		padding: 0 25px;
	}
	#features_system .box {
		display: flex;
		flex-direction: column-reverse;
		width: 100%;
	}
	#features_system .box h2 {
		margin-bottom: 48px;
	}
	#features_system .box .i {
		margin-bottom: 50px;
	}
	#features_system .list {
		width: 100%;
	}
	#features_system .list ul {
		margin-top: -25px;
	}
	#features_system .list ul li {		
		font-size: 15px;
		letter-spacing: 0.07em;
		line-height: 1.8em;
		padding: 25px 0 25px 50px;
		background: url("../img/mark_ck.png") no-repeat 0 50% / 35px 35px;
	}
	
	
	/*===== Service =====*/
	#area {
		width: 100%;
		margin: 60px auto 95px;
	}
	#area h2 {
		text-align: center;
	}
	#area h2::after {
		left: calc(50% - 31px);
	}
	#area .flex {
		flex-direction: row-reverse;
		justify-content: space-between; 
		padding-right: 30px;
	}
	#area .map {
		width: 100%;
		padding: 0 35px;
	}
	#area .text {
		width: 100%;
		padding: 0 25px 30px;
	}
	#area .text p {
		font-size: 15px;
		letter-spacing: 0.07em;
		line-height: 1.66em;
	}
	#area .text p:last-of-type {
		display: block;
		font-size: 16px;
		letter-spacing: 0.1em;
		text-align: center;
		padding: 4px 0 6px;
		margin-top: 1em;
	}
	#area .hyo {
		padding: 0 10px;
		margin: 40px 0;
	}
	
	
	#fee {
		padding: 80px 0 75px;
	}
	#fee .text {
		text-align: left;
		padding: 0 25px;
		margin-bottom: 100px;
	}
	#fee .text p {
		font-size: 15px;
		letter-spacing: 0.1em;
		line-height: 1.66em;
		margin-top: 1.66em;
	}
	#fee .text p:first-of-type {
		font-size: 18px;
		letter-spacing: 0.1em;
		line-height: 1.8em;
		text-align: center;
		margin: 0 0 28px;
	}
	
	#fee .box1 {
		width: calc(100% - 10px);
		padding: 60px 22px 60px;
		margin: 0 auto 70px;
		border-radius: 25px;
	}
	#fee .box1 h3 {
		position: absolute;
		left: 50%;
		top: -28.5px;
		transform: translate(-50%,0);
		color: var(--key);
		font-size: 18px;
		letter-spacing: 0.1em;
		line-height: 1em;
		width: 240px;
		height: 57px;
		padding: 9px 0 0 15px;
		background-color: var(--mark);
		border-left: 2px solid var(--key);
	}
	#fee .box1 h3 span {
		display: block;
		font-size: 14px;
		letter-spacing: 0;
		line-height: 1em;
		margin-top: 0.5em;
	}
	#fee .box1 .flex {
		display: block !important;
	}
	#fee .box1 .cont {
		width: 100%;
	}
	#fee .box1 .cont p {
		font-size: 15px;
		letter-spacing: 0.04em;
		line-height: 2em;
		margin-bottom: 2em;
	}
	#fee .box1 .zu {
		width: 100%;
		margin-top: 45px;
	}
	
	#fee .box2 {
		position: relative;
		width: 100%;
		margin: 0 auto 70px;
	}
	#fee .box2 h3 {
		font-size: 18px;
		letter-spacing: 0.07em;
		text-underline-offset: 9px;
		text-decoration-thickness: 1px;
		margin-bottom: 35px;
	}
	#fee .box2 .hyo {
		position: relative;		
		overflow-y: scroll;
	}
	#fee .box2 .hyo img.hyo1 {
		width: 827px;
		max-width: 827px;		
		height: auto;
		margin: 0 25px;
	}
	#fee .box2 .hyo img.mark {
		position: absolute;
		left: 50%;
		top: 50%;
		z-index: 10;
		transform: translate(-50%, -50%);
		transition: all .3s;
	}
	#fee .box2 .hyo.fd img.mark {
		opacity: 0;
	}
	#fee .box2 p {
		font-size: 14px;
		letter-spacing: 0.07em;
		padding-right: 25px;
	}

	#fee .box3 {
		width: 100%;
		padding: 0 25px;
		margin: 0 auto;
	}
	#fee .box3 .t p {
		font-size: 15px;
		letter-spacing: 0.1em;
		line-height: 1.66em;
		text-align: left;
	}
	#fee .box3 .hyo {
		margin-top: 36px;
	}
	
	#flow {
		width: 100%;
		padding: 0 25px;
		margin: 80px auto 0;
	}
	#flow ul li {
		position: relative;
		padding: 25px 25px 20px 25px;
		margin-bottom: 65px;
		border-radius: 5px;
	}
	#flow ul li::after {
		content: "";
		display: block;
		position: absolute;
		left: calc(50% - 15px);
		bottom: -40px;
		width: 30px;
		height: 21px;
		background: url("../img/mark_sankaku.png") no-repeat 0 0 / 30px 21px;
	}
	#flow ul li .no {
		left: -10px;
		top: -25px;
		font-size: 40px;
		letter-spacing: 0.05em;
		padding: 5px;
	}
	#flow ul li .flex {
		justify-content: flex-start;
		align-items: flex-start;
		margin-bottom: 20px;
	}
	#flow ul li .i {
		width: 45px;
		height: 45px;
	}
	#flow ul li h3 {
		width: calc(100% - 60px);
		padding: 5px 0 15px;
		margin-left: 15px;
		background-image: radial-gradient(circle, var(--key) 1px, transparent 1px);
		background-size: 8px 2px;
		background-repeat: repeat-x;
		background-position: left bottom;
	}
	#flow ul li h3 span {
		display: inline-block;
		color: var(--key);
		font-size: 18px;
		font-weight: 500;
		letter-spacing: 0.08em;
		line-height: 1em;
		padding: 2px 5px 3px;
		background-color: var(--mark);
	}
	#flow ul li .text {
		width: 100%;
	}
	#flow ul li .text p {
		font-size: 15px;
		letter-spacing: 0.07em;
		line-height: 1.66em;
	}

	

	#faq {
		width: calc(100% - 20px);
		padding: 60px 25px;
		margin: 80px auto;
		border-radius: 25px;
	}

	dl.qa dt {
		font-size: 15px;
		letter-spacing: 0.07em;
		line-height: 1.8em;
		padding: 15px 0 15px 47px;
	}
	dl.qa dt div {
		padding-right: 47px;
	}
	dl.qa dt div::before {
		right: 12px;
		width: 19px;
	}
	dl.qa dt div::after {
		right: 12px;
		width: 19px;
	}
	dl.qa dd div {
		width: calc(100% - 16px);
		padding: 15px 39px;
	}
	dl.qa dd div p {
		font-size: 15px;
		letter-spacing: 0.07em;
		line-height: 1.8em;
	}
	dl.qa dt span, 
	dl.qa dd span {
		left: 10px;
		top: 15px;
		font-size: 16px;
		width: 27.5px;
		height: 27.5px;
		padding-top: 4px;
	}
	
	
	/*===== Case study =====*/
	#case {
		padding: 50px 0 80px;
		overflow: hidden;
	}
	#case .slide {		
		width: calc(100% - 20px);
	}
	
	#case .arrow {
		position: absolute;
		left: auto;
		right: 25px;
		bottom: 30px;
		z-index: 10;
		text-align: center;
		width: 107px;
		height: 48px;
	}
	#case .arrow > div {
		width: 48px !important;
		height: 48px;
		background-size: 48px;
	}
	#case .arrow > div.swiper-button-prev {
		left: 0;
		background-image: url("../img/slide_arrow_prev01_sp.png");
	}
	#case .arrow > div.swiper-button-next {
		right: 0;
		background-image: url("../img/slide_arrow_next01_sp.png");
	}
	#case .arrow > div::after {
		text-indent: -999px;
	}
	
	#case .b_case {
		position: absolute;
		left: 25px;
		bottom: 30px;
		z-index: 1;
		color: var(--gy2);
		font-size: 19px;
		letter-spacing: 0;
		text-align: left;
		width: 100%;
	}
	#case .b_case::before {
		display: none;
	}
	#case .b_case span {
		font-size: 19px;
	}
	#case .b_case .swiper-pagination-current {
		color: var(--gy2);
		margin-left: 0;
	}
	
	#case .slide .swiper-slide {
		padding-top: 40px;
	}
	
	#case .slide .swrap {
		position: relative;
		padding: 58px 25px 125px;
		border-radius: 0 10px 10px 10px;
	}
	
	#case .slide p {
		font-size: 15px;
		letter-spacing: 0.07em;
		line-height: 1.8em;
	}
	
	#case .slide .tab {
		position: absolute;
		left: 0;
		top: -40px;
		color: var(--key);
		font-size: 24px;
		font-weight: 600;
		letter-spacing: 0.03em;
		line-height: 1em;
		text-align: center;
		width: 125px;
		height: 45px;
		padding-top: 15px;
		background: url("../img/back03.png") repeat 50% 0;
		border-radius: 10px 10px 0 0;
	}
	#case .slide .tab span {
		font-size: 26px;
	}
	
	#case .slide .box1 {
		padding: 25px 20px;
		margin-bottom: 50px;
	}
	
	#case .slide .box1 h3 {
		font-size: 18px;
		letter-spacing: 0.1em;
		line-height: 1.94em;
		text-decoration: underline;
		text-underline-offset: 9px;
		text-decoration-thickness: 1px;
		margin: 0 0 20px 0;
	}
	#case .slide .box1 .tag {
		display: block;
		margin-bottom: 20px;
	}
	#case .slide .box1 .tag span {
		font-size: 15px;
		letter-spacing: 0.14em;
		padding: 4px 10px 6px;
		margin-right: 10px;
		border-radius: 3px;
	}

	#case .slide .box2 {
		position: relative;
	}
	#case .slide .box2 h4 {
		position: static;
		left: auto;
		top: auto;
		transform: translate(0,0);
		margin-bottom: 20px;
	}
	#case .slide .box2 .inner {
		position: relative;
		width: 100%;
		margin: 0 0 0 auto;
	}

	#case .slide .line {
		height: 75px;
		background: url("../img/case_line_sp.png") no-repeat 50% 50% / 312px 18px;
	}
	
	#case .slide img.mark {
		position: absolute;
		left: 50%;
		top: 330px;
		z-index: 10;
		transform: translate(-50%, 0);
		transition: all .3s;
	}
	#case .slide.fd img.mark {
		opacity: 0;
	}
	
	
	/*===== Recruit =====*/
	#education {
		padding: 105px 0 55px;
		background: url(../img/back01.png) repeat 50% 0;
	}

	#education .ft {
		margin-bottom: 30px;
	}
	#education .ft p {
		font-size: 18px;
		letter-spacing: 0.1em;
		line-height: 1.8em;
	}

	#education .box {
		width: calc(100% - 20px);
		padding: 35px 25px;
		margin: 0 auto 60px;
		border-radius: 25px;
	}
	
	#education .box .h {
		padding-bottom: 15px;
		margin-bottom: 30px;
	}
	#education .box .h .no {
		width: 60px;
	}
	#education .box .h .no::after {
		display: none;
	}
	#education .box .h .no span:nth-of-type(1) {
		font-size: 11px;
		letter-spacing: 0.07em;
	}
	#education .box .h .no span:nth-of-type(2) {
		font-size: 47px;
		letter-spacing: 0.01em;
	}
	#education .box .h .title {
		position: relative;
		font-size: 18px;
		letter-spacing: 0.1em;
		line-height: 1.94em;
		width: calc(100% - 65px);
		padding-left: 15px;
	}
	#education .box .h .title::before {
		content: "";
		display: block;
		position: absolute;
		left: 0;
		top: 5px;
		width: 1px;
		height: calc(100% - 10px);
		background-color: var(--key);
	}
	#education .box .h .title span {
		padding: 0;
		background: linear-gradient(transparent 0, var(--mark) 0%);
	}
	
	#education .cont2 ul li {	
		position: relative;		
		padding-left: 60px;
		margin-bottom: 24px;
	}
	#education .cont2 ul li::before {
		top: 2px;
		font-size: 14px;
		width: 53px;
		height: 20px;
		padding-top: 2px;
		border-radius: 10px;
	}
	#education .cont2 ul li::after {
		left: 26px;
		top: 28px;
		height: calc(100% - 8px);
	}

	#education .cont {
		display: block !important;
	}
	#education .cont2 ul li div,
	#education .cont dl dt {
		font-size: 18px;
		letter-spacing: 0.1em;
		padding-bottom: 0;
		margin-bottom: 0.5em;
		background: none;
	}
	#education .cont2 ul li div span,
	#education .cont dl dt span {
		display: inline-block;
		padding-bottom: 0.5em;
		background-image: radial-gradient(circle, var(--key) 1px, transparent 1px);
		background-size: 8px 2px;
		background-repeat: repeat-x;
		background-position: left bottom;
	}
	#education .cont2 ul li div br + span,
	#education .cont dl dt  br + span {
		margin-top: 0.5em;
	}
	#education .cont dl dt {
		margin-top: 1.5em;
	}
	#education .cont2 ul li p,
	#education .cont dl dd {
		font-size: 15px;
		letter-spacing: 0.07em;
		line-height: 1.66em;
		text-align: justify;
	}
	#education #s02 .cont .i,
	#education #s03 .cont .i {
		width: 100%;
		height: 205px;
		margin-bottom: 25px;
	}	
	#education #s02 .cont .text,
	#education #s03 .cont .text {
		width: 100%;
	}
	

	#scooters {
		height: 448px;
	}
	#scooters .back {
		position: absolute;
		left: 0;
		top: 0;
		z-index: 1;
		width: 100%;
		height: 100%;
	}
	#scooters .box {
		left: 50%;
		top: 85px;
		transform: translate(-50%, 0);
		width: 307.5px;
		padding: 25px 25px 35px;
		border-radius: 5px;
	}
	#scooters .box p {
		font-size: 15px;
	}
	#scooters .box p:first-of-type {
		line-height: 2.4em;
		margin-bottom: 0.8em;
	}
	#scooters .box p:first-of-type span {
		font-size: 18px;
		letter-spacing: 0.1em;
		padding: 2px 4px 3px 5px;
	}
	#scooters .box .illust {
		position: absolute;
		right: -10px;
		top: auto;
		bottom: -97px;
		width: 160px;
	}
	
	
	#oneday {
		display: block !important;
		height: auto;
		margin: 75px auto 0;
	}

	#oneday .cont {
		width: 100%;
		padding: 0 25px;
		margin-left: 0;
		height: auto;
	}
	#oneday .cont h2 {
		text-align: center;
	}
	#oneday .cont h2::after {
		left: calc(50% - 31px);
	}
	
	#oneday .cont .text {
		padding-bottom: 0;
		margin-bottom: 40px;
		background-image: none;
	}
	#oneday .cont .text p {
		font-size: 15px;
		letter-spacing: 0.07em;
		line-height: 1.66em;
	}	

	#oneday .cont ul li {	
		position: relative;
		padding-left: 65px;
		margin-bottom: 24px;
	}
	#oneday .cont ul li::after {
		left: 26px;
		top: 28px;
		height: calc(100% - 8px);
	}
	#oneday .cont ul li:last-of-type {
		margin-bottom: 0;
	}
	#oneday .cont ul li:last-of-type::after {
		display: none;
	}
	#oneday .cont ul li div.time {
		top: 2px;
		font-size: 14px;
		width: 53px;
		height: 20px;
		padding-top: 2px;
		border-radius: 10px;
	}
	#oneday .cont ul li div.item div {
		font-size: 18px;
		letter-spacing: 0.1em;
		padding: 2px 3px 3px 4px;
		margin-bottom: 0.8em;
	}
	#oneday .cont ul li div.item p {
		font-size: 15px;
		letter-spacing: 0.07em;
		line-height: 1.66em;
	}
	#oneday .cont ul li div.item p strong {
		font-size: 15px;
		letter-spacing: 0.05em;
		line-height: 1.875em;
	}
	
	#oneday .slide {
		position: static;
		right: auto;
		top: auto;
		width: 100%;
		min-width: 100%;
		height: 250px;
		margin-top: 47px;
	}
	#oneday .slide .swiper-wrapper {
		transition-timing-function: linear !important;
	}
	#oneday .slide .swiper-slide {
		width: 175px !important;
		height: 250px !important;
		margin-right: 5px;
	}
	#oneday .slide .swiper-slide .slide-img {
		width: 100%;
		height: 100%;
	}
	
	
	#staff_voice {
		width: 100%;
		margin: 90px auto 0;
	}
	#staff_voice h2 {
		margin-bottom: 40px;
	}
	
	#staff_voice .slide .swiper-slide {
		width: calc(100% - 20px);
		margin: 0 10px;
		border-radius: 25px;
	}
	#staff_voice .slide .arrow {
		left: 0;
		top: 160px;
		transform: translate(0,0);
		width: 100%;
	}
	#staff_voice .slide .arrow .swiper-button-prev,
	#staff_voice .slide .arrow .swiper-button-next {
		font-size: 0 !important;
		top: 0 !important;
		width: 40px;
		height: 40px;
		margin-top: 0 !important;
		background-repeat: no-repeat;
		background-position: 0 0;
		background-size: 40px 40px;
	}
	#staff_voice .slide .arrow .swiper-button-prev::after,
	#staff_voice .slide .arrow .swiper-button-next::after {
		display: none;
	}
	#staff_voice .slide .arrow .swiper-button-prev {
		background-image: url("../img/slide_arrow_prev01_sp.png");
		left: 40px !important;
	}
	#staff_voice .slide .arrow .swiper-button-next {
		background-image: url("../img/slide_arrow_next01_sp.png");
		right: 40px !important;
	}
	#staff_voice .slide .b_staff {
		display: block;
		left: 0;
		bottom: -28px;
		font-size: 8px; /*位置がずれるのを解消*/
		width: 100%;
		height: 8px;
	}
	#staff_voice .slide .swiper-pagination-bullet {
		width: 8px;
		height: 8px;
		background-color: var(--gy1);
		margin: 0 8px;
		opacity: 1;
	}
	#staff_voice .slide .swiper-pagination-bullet-active {
		background-color: var(--key);
	}

	#staff_voice .flex {
		display: block !important;
		padding: 50px 22px;
	}
	#staff_voice .i {
		width: 252px;
		margin: 0 auto 25px;
	}
	#staff_voice .i .name {
		font-size: 15px;
	}
	#staff_voice .text {
		width: 100%;
	}
	#staff_voice .text h3 span {
		font-size: 18px;
		letter-spacing: 0.1em;
		padding: 2px 0 3px 5px;
		margin-bottom: 0.5em;
	}
	#staff_voice .text h4 {
		font-size: 16px;
		margin: 2em 0 1.5em;
	}
	#staff_voice .text p {
		font-size: 15px;
		letter-spacing: 0.07em;
		line-height: 1.66em;
	}
	
	
	#recruitment {
		width: calc(100% - 20px);
		padding: 28px 0;
		margin: 110px auto 75px;
		border-radius: 25px;
	}
	#recruitment h2 {
		font-size: 23px;
	}
	#recruitment h2::before {
		right: 50px;
		width: 21px;
	}
	#recruitment h2::after {
		right: 50px;
		width: 21px;
	}
	#recruitment .box {
		width: 100%;
		padding: 0 24px;
	}
	#recruitment dl {
		display: block !important;
		padding: 20px; 
	}
	#recruitment dl:first-of-type {
		margin-top: 28px;
	}
	#recruitment dl dt {		
		width: 100%;
	}
	#recruitment dl dt div {
		font-size: 15px;
		letter-spacing: 0.1em;
		line-height: 1em;
		width: 110px;
		height: 30px;
		padding-top: 7px;
		margin: 0 0 15px -5px;
	}
	#recruitment dl dd {
		font-size: 15px;
		letter-spacing: 0.07em;
		line-height: 1.8em;
		width: 100%;
		padding: 0;
	}
	#recruitment .close_btn {
		font-size: 16px;
		margin-top: 28px;
	}
	
	
	.entry {
		top: auto;
		bottom: 0;
		transform: translate(0,0);
	}
	
	
	/*===== About =====*/
	#about_read {
		width: 100%;
		margin: 60px auto 80px;
	}

	#about_read p {
		font-size: 15px;
		letter-spacing: 0.07em;
		padding: 0 25px;
	}
	#about_read div p:first-of-type {
		font-size: 18px;
		letter-spacing: 0.04em;
		line-height: 1.94em;
		margin-bottom: 28px;
	}

	#about_read .box1 {
		position: relative;
		padding-left: 0;
		margin-bottom: 0;
	}
	#about_read .box1 .i {
		position: static;
		left: auto;
		top: auto;
		width: 350px;
		height: 235px;
		margin: 50px 0;
	}
	#about_read .box2 p {
		width: 100%;
	}
	#about_read .box2 .i01 {
		position: static;
		right: auto;
		top: auto;
		width: 295px;
		height: 205px;
		margin: 40px 0 0 auto;
	}
	#about_read .box2 .i02 {
		position: static;
		right: auto;
		top: auto;
		width: 208px;
		height: 180px;
		margin: 30px auto 0 25px;
	}
	
	
	#daihyo {
		padding: 80px 0;
	}
	
	#daihyo h2 {
		margin-bottom: 40px;
	}
	
	#daihyo .inner {
		width: calc(100% - 20px);
		padding: 60px 25px 60px;
		margin: auto;
		border-radius: 25px;
	}
	
	#daihyo .unit:nth-of-type(2) {
		margin-top: 60px;
	}
	#daihyo .unit > .flex {
		display: block;
	}
	#daihyo .unit .i {
		width: 100%;
		height: 360px;
		border-radius: 5px;
		margin-bottom: 35px;
	}
	#daihyo .unit .n {
		width: 100%;
	}
	#daihyo .unit .n .h {
		padding: 0 0 20px 0;
		margin-bottom: 20px;
	}
	#daihyo .unit .n .h .name {
		font-size: 15px;
	}
	#daihyo .unit .n .h .name span {
		font-size: 19px;
	}
	#daihyo .unit .n .h .title {
		font-size: 15px;
		margin-top: 8px;
	}
	#daihyo .unit .n .list li {
		font-size: 14px;
		letter-spacing: 0.07em;
		line-height: 1.78em;
		padding-left: 1em;
	}
	#daihyo .unit .n .list li::before {
		left: 0;
		top: 10px;
	}
	#daihyo .unit .msg {
		padding: 30px 27px 50px;
		margin-top: 45px;
		border-radius: 13px;
	}
	#daihyo .unit:nth-of-type(1) .msg::before,
	#daihyo .unit:nth-of-type(2) .msg::before {
		width: 30px;
	}
	#daihyo .unit:nth-of-type(1) .msg::before {
		left: 35px;
	}
	#daihyo .unit:nth-of-type(2) .msg::before {
		right: 35px;
	}
	#daihyo .unit:nth-of-type(1) .msg::after,
	#daihyo .unit:nth-of-type(2) .msg::after {
		width: 30px;
	}
	#daihyo .unit:nth-of-type(1) .msg::after {
		left: 35px;
		transform: rotate(-35deg);
	}
	#daihyo .unit:nth-of-type(2) .msg::after {
		right: 35px;
		transform: rotate(35deg);
	}
	#daihyo .unit .msg .title {
		position: static;
		left: auto;
		top: auto;
		letter-spacing: 0.05em;
		line-height: 1.94em;
		writing-mode: horizontal-tb;
		text-underline-offset: 7px;
		margin-bottom: 20px;
	}
	_::-webkit-full-page-media, _:future, :root #daihyo .unit .msg .title {
		text-underline-offset: 7px;
	}
	#daihyo .unit .msg .cont.lp {
		-webkit-line-clamp: 13;
	}
	#daihyo .unit .msg p {
		font-size: 15px;
		letter-spacing: 0.07em;
		line-height: 1.8em;
	}
	#daihyo .unit .msg .btn_box {
		margin-top: 25px;
	}	
	
	
	#cp {
		width: 100%;
		padding: 0 25px;
		margin: 80px auto;
	}
	#cp table {
		width: 100%;
		margin: 0;
		border-collapse: separate;
	}
	#cp table td {
		font-size: 14px;
		letter-spacing: 0.07em;
		line-height: 1.78em;
		padding: 22px 0;
	}
	#cp table tr td:nth-of-type(1) {
		width: 95px;
		padding-left: 0;
	}
	
	
	/*===== News ======*/
	#news {
		display: block !important;
		width: 100%;
		padding: 60px 25px 80px;
	}
	#news.single {
		padding-top: 100px;
	}
	

	/*----- Category -----*/
	.category_list {
		width: 100%;
		margin-bottom: 50px;
		border-top: 1px solid var(--gy2);
		border-bottom: 1px solid var(--gy2);
	}
	.category_list .sticky {
		position: relative;
		left: auto;
		top: auto;
		padding-left: 0;
	}
	.category_list h3 {
		position: absolute;
		left: 0;
		top: -9px;
		font-size: 18px;
		font-weight: 600;
		letter-spacing: 0.08em;
		line-height: 1em;
		width: 100px;
		background-color: #fff;
		margin-bottom: 0;
	}
	.category_list h3::after {
		display: none;
	}
	.category_list ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		padding: 25px 0 5px;
	}
	.category_list li {
		font-size: 16px;
		font-weight: 500;
		letter-spacing: 0.1em;
		line-height: 1em;
		margin: 0 38px 20px 0;
	}
	.category_list li:nth-of-type(3) {
		margin-right: 0;
	}

	.post_list {		
		width: 100%;
	}
	.post_list ul {
		justify-content: space-between;
	}
	.post_list li {
		width: calc((100% - 25px) / 2);
		margin: 0 0 35px;
	}
	.post_list li.non {
		font-size: 15px;
		padding: 85px 0 55px;
	}
	.post_list li a .i {
		height: 115px;
		margin-bottom: 15px;
	}
	.post_list li a .sub {
		font-size: 13px;
		letter-spacing: 0.08em;
		margin-bottom: 0.8em;
	}
	.post_list li a .date::after {
		right: -6px;
		top: 0;
		width: 1px;
		height: 14px;
	}
	.post_list li a .title {
		font-size: 15px;
		line-height: 1.66em;
	}
	
	
	/*----- pagenavi -----*/
	.pagenavi {
		margin-top: 15px;
	}
	.pagenavi span,
	.pagenavi a {
		font-size: 20px;
		margin: 0 10px !important;
	}
	
	
	/*----- Single -----*/
	#news article {
		width: 100%;
	}

	#news article .h {
		padding-bottom: 10px;
		margin-bottom: 45px;
	}
	#news article .h .sub {	
		font-size: 13px;
		letter-spacing: 0.1em;
	}
	#news article .h .date::after {
		right: -7px;
		top: 0;
	}
	#news article .h h2 {
		font-size: 18px;
		line-height: 1.66em;
	}

	#news article h3 {		
		font-size: 18px;
		line-height: 2.03em;
		margin-bottom: 2.5em;
	}
	#news article p {
		font-size: 15px;
		letter-spacing: 0.07em;
	}
	#news article .wp-block-image {
		margin-bottom: 45px;
	}

	
	/*----- pager -----*/
	.pager td a {
		font-size: 20px;
	}
	
	
	/*===== Contact =====*/
	#contact {
    width: 100%;
    padding: 100px 25px 75px;
  }
	
	#contact h2 {
		margin-bottom: 35px;
	}
	#contact h2 div {
		font-size: 21px;
		letter-spacing: 0.1em;
		line-height: 1.52em;
	}
	#contact h2 span {
		font-size: 14px;
		font-weight: 400;
		letter-spacing: 0.12em;
		line-height: 1em;
		margin-bottom: 28px;
	}
	#contact h2 span::after {
		left: calc(50% - 14px);
		bottom: -10px;
		width: 28px;
	}
	
	#contact p.fst {
		font-size: 15px;
		letter-spacing: 0.1em;
		line-height: 1.66em;
		text-align: left;
		margin-bottom: 35px;
	}
	
	#contact .inq p.last {
    font-size: 15px;
		font-weight: 400;
    line-height: 1.66em;
		text-align: left;
    margin-top: 50px;
  }
  
  #contact td p {
    font-size: 14px;
		letter-spacing: 0.14em;
  }
  #contact tr td:nth-of-type(1) {
    position: relative;
    padding: 0 0 10px 15px;
  }
  #contact tr td:nth-of-type(2) {  
    padding-bottom: 35px;
  }
	
  #contact tr td:nth-of-type(2) div {
    min-height: 44px;
    padding: 9px 10px;
  }

	/*---- check leyout -----*/
	#contact tr td:nth-of-type(2) div.ck {
		padding: 20px 20px 0 25px;
	}
	#contact tr td:nth-of-type(2) div.ck .wpcf7-form-control .wpcf7-list-item {
		margin-bottom: 20px;
	}
	#contact tr td:nth-of-type(2) div.ck .wpcf7-form-control .wpcf7-list-item + .wpcf7-list-item {
		margin-left: 0;
	}
	#contact tr td:nth-of-type(2) div.ck label {
		margin-right: 15px;
	}

	/*----- 下の余白 ------*/
	#contact tr td:nth-of-type(2) div.kikkake {
		padding-bottom: 20px;
	}
	#contact tr td:nth-of-type(2) div.kikkake p:last-of-type {
		line-height: 1.66em;
		text-indent: -1em;
		padding-left: 1em;
	}

	/*---- 送信確認 -----*/
  #contact tr.flex {
		display: block !important;
  }
  #contact tr.flex td:nth-of-type(2) {
    width: 100% !important;
  }
  #contact .ac {
    padding: 0 !important;
    background-color: transparent !important;
    margin: 10px 0 0;
  }
  #contact .ac .wpcf7-list-item-label {
    font-size: 15px !important;
		font-weight: 400;
  }
  #contact .ac .a {
    display: block;
    font-size: 14px;
		font-weight: 400;
    letter-spacing: 0.1em;
    line-height: 1.42em;
    text-indent: -1em;
    padding-left: 1em;
    margin-top: 15px;
  }
  #contact .ac label::before {
    top: 1px;
    width: 12px;
    height: 12px;
  }
  #contact .ac label input[type="checkbox"]:checked + .wpcf7-list-item-label::before {
    top: 1px;
    width: 12px;
    height: 12px;
  }
  
	/*----- item -----*/
  input[type="text"],
  input[type="email"],
  textarea {
    font-size: 14px;
    height: 26px;
  }
  textarea {
    height: 220px;
  }

  /*----- その他テキスト -----*/
	.wpcf7-list-item.has-free-text input {
		width: 180px;
		margin-left: 0;
	}

	/*----- lable -----*/
  .inq label {
    font-size: 15px;
    letter-spacing: 0.14em;
    padding-left: 24px;
  }
  .inq .wpcf7-list-item-label {
    display: inline-block;
    font-size: 15px;
    letter-spacing: 0.14em;
  }
  .inq label::before {
    content: "";
    display: inline-block;
    position: absolute;
    left: 0;
    top: 1px;
    width: 15px;
    height: 15px;
  }
  .inq label input[type="radio"]:checked + .wpcf7-list-item-label::before,
  .inq label input[type="checkbox"]:checked + .wpcf7-list-item-label::before {
    content: "";
    display: inline-block;
    position: absolute;
    left: 0;
    top: 1px;
    width: 15px;
    height: 15px;
    box-sizing: border-box;
  }
	
	/*----- submit ------*/
  #contact .btn {
    width: 230px;
    margin: 0 auto;
  }
  #contact .btn p {
    height: 50px;
    overflow: hidden;
  }
  .wpcf7-submit {
    font-size: 14px;
    line-height: 1em;
    letter-spacing: 0.14em;
    height: 50px;
    border-radius: 3px;
  }
  
	/*----- 送信後 ------*/
  .transmission {
		padding: 114px 0 90px;
  }
	.transmission p {
		font-size: 13px !important;
		font-weight: 800;
	}
	
	/*----- エラー ------*/
	.wpcf7-not-valid-tip {
		display: block !important;
		bottom: -30px;
		font-size: 12px !important;
	}
	.ck .wpcf7-not-valid-tip {
		left: -25px;
		bottom: -15px;
		width: 250px; /* iOS用 幅をpxで明示しないと幅が0になるため */
	}
	.kikkake .wpcf7-not-valid-tip {
		bottom: -80px;
	}
	textarea + .wpcf7-not-valid-tip {
		bottom: -20px;
	}
	
	
	/*----- reCAPTCHA ------*/
	.reCAPTCHA_text p {
		font-size: 12px;
		letter-spacing: 0.1em;
		line-height: 1.47em;
		text-align: left;
		margin-top: 25px;
	}
	
	
	/*===== Not found =====*/
	#not-found .flex {
		padding: 200px 0 150px;
	}
	#not-found .flex p {
		font-size: 13px;
		letter-spacing: 0.08em;
		line-height: 1.6em;
	}
  
}



@keyframes prog_sp {
	0% {
		width: 0;
	}
	100% {
		width: 40px;
	}
}