/*
Theme Name:new2024-houjiunyu
Theme URI:
Version: 1.0
Author: imawaka
Author URI: https://yoshida-designbu.com/
License: takami
*/


/*リセットcss*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font: inherit;
	font-size: 100%;
	vertical-align: baseline;
}

html {
	line-height: 1;
}

ol, ul {
	list-style: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

caption, th, td {
	text-align: left;
	font-weight: normal;
	vertical-align: middle;
}

q, blockquote {
	quotes: none;
}

q:before, q:after, blockquote:before, blockquote:after {
	content: "";
	content: none;
}

img {
	vertical-align: bottom;
}

a img {
	border: none;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
	display: block;
}

input[type="button"], input[type="submit"] {
	-webkit-appearance: none;
}

br.clear {
	clear: both;
}

/*リセットcssここまで*/


/*--------------
common
--------------*/
html {
    font-size: 62.5%;
	scroll-padding-top: 100px;
}

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

:root {
    --color-white: #ffffff;
    --color-black: #333333;
    --color-blue: #000080;
    --color-lightblue: #e5e5f2;
    --color-red: #ff0000;
    --color-green: #007900;
    --color-lightgreen: #5ec783;
    --font-regular400: 400;
    --font-bold700: 700;
    --font-black900: 900;
    --font-notoSans: "Noto Sans JP", sans-serif;
    --font-zenKakuNew: "Zen Kaku Gothic New", sans-serif;
}

body {
	background: #ffffff;
	color: #333333;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 20px;
	line-height: 1.7;
	font-weight: 400;
	font-feature-settings: "palt";
}

a {
    text-decoration: none;
    transition: all 0.5s;
	color: #333333;
}

img {
    width: 100%;
    height: auto;
    vertical-align: bottom;
}

picture {
	display: block;
}

h2, h3, h4, h5, p.subtitle, p.under-subtitle {
	font-weight: var(--font-bold700);
}

.flex-box {
	display: flex;
	justify-content: space-between;
}

a.link {
	display: block;
	transition: all 0.3s;
}

span.spanblock {
	display: block;
}

.align-right {
	text-align: right;
}
.margin-right {
	margin: 0 0 0 auto;
}

.hidden {
	visibility: hidden;
	height: 0;
}

br.sp-br {
	display: none;
}


@media screen and (max-width: 1200px){

/*--------------*/
/*  common
/*--------------*/

body {
	font-size: max(2vw, 20px);
	line-height: 1.7;
}

.topSec .flex-box, .contactSec .flex-box {
	display: block;
}

.topSec .align-right, .contactSec .align-right {
	text-align: left;
}
.topSec .margin-right, .contactSec .margin-right {
	margin: 0;
}

}

@media screen and (max-width: 768px){

/*--------------*/
/*  common
/*--------------*/

html {
	scroll-padding-top: 70px;
}

body {
	font-size: max(2.5vw, 16px);
	line-height: 1.7;
}

.flex-box {
	display: block;
}

.align-right {
	text-align: left;
}
.margin-right {
	margin: 0;
}

br.sp-br {
	display: block;
}

br.pc-br {
	display: none;
}

}


/*--------------
loading
--------------*/

/*----- loading -----*/
#loading {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 99999;
    background: var(--color-blue);
    text-align: center;
  }

#loading_box {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#loading .kvArea {
	width: 100%;
}

#loading .progress p {
	color: var(--color-white);
}


/*--------------
header
--------------*/

.header-container {
	width: 100%;
	height: 100px;
	position: fixed;
	z-index: 10;
	background-color: var(--color-white);
	border-bottom: 2px solid var(--color-blue);
}


.header-inner {
    width: calc(100% - 24vw);
	height: 100%;
    margin: 0 auto;
	align-items: center;
}

.header-container h1 {
	width: 150px;
}
.header-container h1 a:hover {
	opacity: 0.5;
}


ul.pc-menu {
    display: flex;
    gap: 30px;
    padding-right: 80px;
    list-style: none;
}

ul.pc-menu li {
    position: relative;
}

ul.pc-menu li a {
    color: var(--color-blue);
	font-size: 17px;
	font-weight: var(--font-bold700);
}

ul.pc-menu ul.pc-menu-inner {
    display: block;
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    position: absolute;
    top: 120%; 
    left: 0;
    background-color: white;
    list-style: none;
    padding: 0;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
	min-width: 200px;
    transition: all 0.3s;
}

ul.pc-menu li.has-child:hover > ul.pc-menu-inner {
    opacity: 1;
    max-height: 500px;
    padding: 10px 0;
}

ul.pc-menu ul.pc-menu-inner li {
    padding: 5px 20px;
}

ul.pc-menu ul.pc-menu-inner li a {
    color: var(--color-blue);
    text-decoration: none;
    display: block;
}

ul.pc-menu li a:hover, ul.pc-menu ul.pc-menu-inner li a:hover {
	opacity: 0.6;
}
ul.pc-menu li.has-child a:hover {
	opacity: 1;
}



/*----- hamburger -----*/
.hamburger {
	display: block;
    position: fixed;
    z-index: 12;
    top: 30px;
    right: 12vw;
    width: 42px;
    height: 42px;
    cursor: pointer;
    text-align: center;
}

.hamburger span {
	display: block;
	position: absolute;
	width: 40px;
	height: 2px;
	left: 0;
	background: var(--color-blue);
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
.hamburger.active span {
	background: var(--color-white);
}

.hamburger span:nth-child(1) {
	top: 10px;
}
.hamburger span:nth-child(2) {
	top: 20px;
}
.hamburger span:nth-child(3) {
	top: 30px;
}

.hamburger.active span:nth-child(1) {
	top : 24px;
	left: 0px;
	-webkit-transform: rotate(-45deg);
	-moz-transform   : rotate(-45deg);
	transform        : rotate(-45deg);
}

.hamburger.active span:nth-child(2),
.hamburger.active span:nth-child(3) {
	top: 24px;
	-webkit-transform: rotate(45deg);
	-moz-transform   : rotate(45deg);
	transform        : rotate(45deg);
}

nav.globalMenu {
	display: block;
	position: fixed;
	z-index: 11;
	top: 0;
	left: 0;
	background: var(--color-blue);
	color: var(--color-white);
	width: 100%;
	height: 100%;
	opacity: 0;
	visibility: hidden;
	transition: opacity .6s ease, visibility .6s ease;
}
nav.globalMenu.active {
	opacity: 100;
	visibility: visible;
	overflow-y: scroll;
}

div.globalMenu-wrapper {
    margin-top: 100px;
    padding: 0 12vw;
	justify-content: space-around;
}

div.gmw-menu-item {
	margin-bottom: 30px;
}

p.gmw-menu-text {
	font-size: min(70px, 5vw);
	font-weight: var(--font-bold700);
	font-family: var(--font-zenKakuNew);
}

ul.gmw-menu-links li a {
	color: var(--color-white);
	line-height: 2.2;
}
ul.gmw-menu-links li a:hover {
	color: var(--color-red);
}
ul.gmw-menu-links li a::before {
	content: "-";
	margin-right: 0.5em;
}


@media screen and (max-width: 1350px){

	ul.pc-menu {
		gap: 20px;
		padding-right: 65px;
	}
	ul.pc-menu li a {
		font-size: 16px;
	}

}


@media screen and (max-width: 1200px){

	ul.pc-menu {
		display: none;
	}

	.header-inner {
		width: calc(100% - 10%);
	}

	.hamburger {
		right: 5%;
	}

	div.globalMenu-wrapper {
		margin-top: 70px;
		padding: 30px 5%;
		justify-content: space-around;
	}

	div.gmw-menu-item {
		margin-bottom: 8%;
	}

	p.gmw-menu-text {
		font-size: max(4vw, 50px);
		font-weight: var(--font-bold700);
	}

	ul.gmw-menu-links li a {
        font-size: max(2vw, 18px);
	}

}


@media screen and (max-width: 768px){

	.header-container {
		height: 70px;
		display: flex;
	}

	.header-inner {
		display: flex;
    }

	.header-container h1 {
		width: 40%;
		max-width: 150px;
	}

	.hamburger {
		width: 30px;
		height: 30px;
		top: 18px;
	}
	.hamburger span {
		width: 30px;
	}
	.hamburger span:nth-child(1) {
		top: 5px;
	}
	.hamburger span:nth-child(2) {
		top: 15px;
	}
	.hamburger span:nth-child(3) {
		top: 25px;
	}

	.hamburger.active span:nth-child(1) {
		top: 15px;
	}
	.hamburger.active span:nth-child(2), .hamburger.active span:nth-child(3) {
		top: 15px;
	}

	div.globalMenu-wrapper {
        margin-top: 0;
		padding: 70px 10%;
    }

	div.gmw-menu-item {
		margin-bottom: 4%;
	}

	p.gmw-menu-text {
		font-size: max(7vw, 35px);
	}

}


/*--------------
top(トップページ)
--------------*/

.main-inner {
	padding-top: 100px;
}

@media screen and (max-width: 768px){

.main-inner {
    padding-top: 70px;
}

}


/* kv */

.topKv {
    position: relative;
    width: 100%;
	background-color: var(--color-blue);
}

.kv-subCopy,
.kv-mainCopy, 
.kv-mainImage1, 
.kv-mainImage2 {
    position: absolute;
}

.kv-subCopy {
	top: 45%;
    left: 10vw;
    color: var(--color-white);
    font-size: 2.5vw;
    font-weight: var(--font-bold700);
    z-index: 4;
    text-shadow: 3px 3px 5px rgba(0, 0, 0, 0.9);
}
.kv-mainCopy {
	width: 60%;
    top: 55%;
    left: 7vw;
    z-index: 4;
}
.kv-mainImage1 {
	z-index: 3;
}
.kv-mainImage2 {
	z-index: 1;
}
.kv-bg {
	position: relative;
	z-index: 2;
}


/*----- kv animation -----*/
.kv-slide1, .kv-slide2, .kv-slide3, .kv-slide4 {
    opacity: 0;
}
.topKv.animate .kv-slide1 {
    animation: kv_slide 0.25s forwards;
}
.topKv.animate .kv-slide2 {
    animation: kv_slide 0.25s forwards;
	animation-delay: 0.1s;
}
.topKv.animate .kv-slide3 {
    animation: kv_slide 0.25s forwards;
	animation-delay: 0.2s;
}
.topKv.animate .kv-slide4 {
    animation: kv_slide 0.25s forwards;
	animation-delay: 0.3s;
}
@keyframes kv_slide {
    0% {
        opacity: 0;
        transform: translateX(-1000px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}


@media screen and (max-width: 768px){

	.kv-subCopy {
		top: 6%;
		left: 7%;
		font-size: 4.5vw;
	}

	.kv-mainCopy {
		width: 90%;
		top: 13%;
		left: 50%;
	}

	.topKv.animate .kv-slide3 {
		animation: kv_slide2 0.25s forwards;
		animation-delay: 0.2s;
	}

	@keyframes kv_slide2 {
		0% {
			opacity: 0;
			transform: translate(-1000px, 0);
		}
		100% {
			opacity: 1;
			transform: translate(-52%, 0);
		}
	}

}


/* ボタンの設定 */

/* 共通 */
.more-button a {
	box-sizing: border-box;
	width: 250px;
	border-radius: 9999px;
	padding: 5px 1em;
	position: relative;
	overflow: hidden;
}

/* 黒ボタン */
.more-button-color01 a {
	border: 1px solid var(--color-black);
	background: url(./img/common/arrow-right-black.svg) right 1em center no-repeat;
    background-size: 1em;
	background-color: var(--color-white);
}
.more-button-color01 a::before {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	background: var(--color-blue);
	transform-origin: 100% 50%;
	transform: scaleX(0);
	transition: transform ease .3s;
}
.more-button-color01 a:hover {
	color: var(--color-white);
	border: 1px solid var(--color-blue);
	background: url(./img/common/arrow-right-white.svg) right 1em center no-repeat;
    background-size: 1em;
}
.more-button-color01 a:hover::before {
	transform-origin: 0% 50%;
	transform: scaleX(1);
}

/* 白ボタン */
.more-button-color02 a {
	border: 1px solid var(--color-white);
	background: url(./img/common/arrow-right-white.svg) right 1em center no-repeat;
    background-size: 1em;
	color: var(--color-white);
}
.more-button-color02 a::before {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	background: var(--color-white);
	transform-origin: 100% 50%;
	transform: scaleX(0);
	transition: transform ease .3s;
}
.more-button-color02 a:hover {
	color: var(--color-blue);
	background: url(./img/common/arrow-right-blue.svg) right 1em center no-repeat;
    background-size: 1em;
}
.more-button-color02 a:hover::before {
	transform-origin: 0% 50%;
	transform: scaleX(1);
}


@media screen and (max-width: 1200px){

	.more-button a {
		width: 50%;
		max-width: 350px;
		margin-top: 2%;
		padding: 1% 1em;
	}

}
@media screen and (max-width: 768px){

	.more-button a {
		width: 58%;
		max-width: 450px;
	}

}


/* 動きの設定 */

.scroll-slideLeft, .scroll-slideRight {
    opacity: 0;
}

.scroll-slideLeft-in {
    animation: scroll-slideLeft-in 0.4s forwards;
}
@keyframes scroll-slideLeft-in {
    0% {
        opacity: 0;
        transform: translateX(-100px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

.scroll-slideRight-in {
    animation: scroll-slideRight-in 0.4s forwards;
}
@keyframes scroll-slideRight-in {
    0% {
        opacity: 0;
        transform: translateX(100px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}


/* top共通 */

.topSec {
	position: relative;
	z-index: 0;
}

.topSec h2.title, .contactSec h2.title {
	font-size: 90px;
	font-family: var(--font-zenKakuNew);
	font-weight: var(--font-black900);
	line-height: 1.2;
}

.topSec p.subtitle, .contactSec p.subtitle {
	font-size: 30px;
    border-bottom: 3px solid var(--color-red);
}

.topSec p.topSec-copy {
	font-size: 46px;
	font-weight: var(--font-bold700);
	color: var(--color-white);
	line-height: 1.2;
	margin-top: 80px;
}

.topSec p.topSec-text {
	margin: 40px 0;
}

.topSec p.more-button a {
	margin-top: 15px;
}
.topSec p.more-button:first-child a {
	margin-top: 0;
}

.topSec-even h2.title, 
.topSec-even p.subtitle, 
.topSec-even p.topSec-text {
	color: var(--color-white);
}

.topSec .topSec-deco {
	position: absolute;
	bottom: 0;
	z-index: -2;
}


@media screen and (max-width: 1200px){

	.topSec p.subtitle, .contactSec p.subtitle {
		padding-bottom: 1%;
		border-bottom: 2px solid var(--color-red);
	}

	.topSec p.topSec-copy {
		font-size: max(3.5vw, 40px);
		line-height: 1.5;
		margin: 3% 0;
    }

	.topSec p.topSec-text {
        margin: 3% 0 5%;
    }

	.topSec span.spanblock {
		display: initial;
	}

	.topSec p.more-button a {
		margin-top: 2%;
		margin-left: auto;
	}

	.topSec .topSec-deco {
		width: 70%;
		opacity: 0.5;
	}

}


@media screen and (max-width: 768px){

	.topSec h2.title, .contactSec h2.title {
        font-size: max(10vw, 50px);
		margin-bottom: 1%;
    }

	.topSec p.subtitle, .contactSec p.subtitle {
		font-size: max(3vw, 16px);
		padding-bottom: 1%;
	}

	.topSec p.topSec-copy {
        font-size: max(4.5vw, 22px);
        margin: 5% 0;
    }

	.topSec p.topSec-text {
        margin: 6% 0;
    }

	.topSec p.more-button a {
		margin-top: 3%;
	}

}


/* topNews(トップお知らせ) */

.topNews {
	margin: 8% 12vw;
}

.topNews .title-box, .topNews .news-past {
	position: absolute;
	left: 0;
}
.topNews .title-box {
	top: 0;
}
.topNews p.subtitle {
	display: inline-block;
    padding-right: 1.5em;
}

div.topNews-inner {
	width: 50%;
	margin: 0 0 0 auto;
}

.topNews .news-list {
	border-bottom: 1px solid var(--color-black);
	padding: 20px 0;
}
.topNews .news-list:first-child {
	padding-top: 0;
}
.topNews .news-list dt {
	font-size: 16px;
	color: #666;
	padding-bottom: 5px;
	transition: all 0.3s;
}
.topNews .news-list dd {
	font-size: 18px;
	background: url(./img/common/arrow-right-black.svg) right center no-repeat;
    background-size: 1em;
	transition: all 0.3s;
}
.topNews .news-list a:hover dt, 
.topNews .news-list a:hover dd {
	color: var(--color-green);
}
.topNews .news-list a:hover dd {
	background: url(./img/common/arrow-right-green.svg) right center no-repeat;
    background-size: 1em;
}

.topNews .news-past {
	bottom: 0;
}


@media screen and (max-width: 1200px){

	.topNews {
		margin: 8% 5%;
	}

	.topNews .title-box, .topNews .news-past {
		position: initial;
	}

	div.topNews-inner {
		margin: 5% 0 6%;
		width: 100%;
	}

	.topNews .news-list {
		padding: 3% 0;
	}
	.topNews .news-list dt {
		font-size: max(16px, 2vw);
		padding-bottom: 0;
	}
	.topNews .news-list dd {
		font-size: max(18px, 2.2vw);
	}

}


@media screen and (max-width: 768px){

	.topNews {
		margin: 10% 5%;
	}

	div.topNews-inner {
		margin: 8% 0 10%;
	}

	.topNews .news-list {
		padding: 4% 0;
	}
	.topNews .news-list dt {
		font-size: max(2.5vw, 16px);
	}
	.topNews .news-list dd {
		font-size: max(2.5vw, 16px);
	}

}


/* topService(トップ事業内容) */

.topService-container {
	width: 100%;
	background: url(./img/top/topService-image.jpg) center center no-repeat;
	background-size: cover;
	position: relative;
}
.topAbout-container {
	width: 100%;
	background: url(./img/top/topAbout-image.jpg) center center no-repeat;
	background-size: cover;
}
.topService-image, .topAbout-image {
	display: none;
}

.topService-container h2.title {
	position: absolute;
	top: 8%;
	left: 12vw;
    text-shadow: #000 0 0 10px;
}

/* 共通(topService, topAbout)------↓ */
.topService-inner, .topAbout-inner {
    background-color: rgba(0, 0, 128, 0.7);
    width: 55%;
	position: relative;
}
.topService-inner {
    margin: 0 0 0 auto;
    padding: 80px 12vw 80px 0;
    clip-path: polygon(20% 0%, 100% 0%, 100% 100%, 0% 100%);
}
.topAbout-inner {
    margin: 0 auto 0 0;
    padding: 80px 0 80px 12vw;
    clip-path: polygon(0 0, 80% 0, 100% 100%, 0% 100%);
}

.topService-inner .subtitle, .topAbout-inner .subtitle {
    position: absolute;
}
/* ↑------共通 */

.topService-inner .subtitle {
    top: -80px;
    right: -12vw;
    padding: 0 12vw 0 1.5em;
}


/* 装飾------↓ */

/* 共通(topService, topAbout)------↓ */
.topSec div.topSA-deco {
    position: absolute;
    width: 15%;
}
/* ↑------共通 */
/* 共通(topService)------↓ */
.topSec .topService-deco01 {
    top: 6%;
    right: 40%;
}
.topSec .topService-deco02 {
    bottom: 10%;
    left: 41%;
}
/* ↑------共通(topService) */
/* 装飾(topAbout)------↓ */
.topSec .topAbout-deco01 {
    top: 6%;
    left: 39%;
	transform: scale(-1, 1);
}
.topSec .topAbout-deco02 {
    bottom: 10%;
    right: 40%;
	transform: scale(-1, 1);
}
/* ↑------装飾(topAbout) */

div.topService-inner div.topSec-deco {
	display: none;
}

/* ↑------装飾 */


.topService-list {
	gap: 5px;
	margin-top: 5px;
}

.topService-list-item {
	position: relative;
}
.topService-list-item:nth-child(2) {
    animation-delay: 0.1s;
}
.topService-list-item:nth-child(3) {
    animation-delay: 0.2s;
}
.topService-list-item a:after {
	position: absolute;
	content: '';
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(51,51,51,.6);
	transition:0.3s;
}
.topService-list-item a:hover:after {
    background-color: rgba(51,51,51,0); /* hover時に背景を透明に */
}

.topService-list-item h3 {
    width: 100%;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
	z-index: 1;
    font-size: 35px;
    color: var(--color-white);
    text-align: center;
    text-shadow: #000 0 0 10px;
}


@media screen and (max-width: 1200px){

	/* 共通(topService, topAbout)------↓ */
	.topService-container, .topAbout-container {
		background: none;
	}
	.topService-image, .topAbout-image {
		display: block;
	}

	.topService-inner, .topAbout-inner {
		width: 100%;
		margin: 0;
		padding: 7% 5%;
		clip-path: initial;
		z-index: 0;
		background-color: var(--color-blue);
	}

	.topService-inner .subtitle, .topAbout-inner .subtitle {
		position: relative;
		top: initial;
        left: -5%;
        display: inline-block;
    }
	/* ↑------共通 */

	.topService-container h2.title {
		top: 1%;
		left: initial;
		right: 5%;
	}

	.topService-inner .subtitle {
		padding: 0 1.5em 0 5%;
	}

	.topSec .topService-list {
		margin-top: 0;
		display: flex;
	}

	.topService-list-item {
		margin-top: 5px;
	}

	.topService-list-item h3 {
		font-size: max(3vw, 25px);
	}

	/* 装飾------↓ */
	
	/* 共通(topService, topAbout)------↓ */
	.topSA-deco {
		display: none;
	}
	/* ↑------共通 */

	div.topService-inner div.topSec-deco {
		display: block;
		transform: scale(-1, 1);
		left: 0;
	}
	
	/* ↑------装飾 */

}


@media screen and (max-width: 768px){

	.topService-inner, .topAbout-inner {
		padding: 10% 5%;
	}

	.topService-list-item h3 {
		font-size: max(4vw, 20px);
	}

	.topSec .topService-list {
        display: block;
    }
	.topService-list-item {
		margin-top: 1%;
	}

}


/* topLineup(トップ車両紹介) */

.topLineup {
	margin-top: 100px;
}

/* スライド */
.slider img {
    width: 60vw;/*スライダー内の画像を60vwにしてレスポンシブ化*/
    height: auto;
}
.slider .slick-slide {
	transform: scale(0.9);/*左右の画像のサイズを80%に*/
	transition: all .5s;/*拡大や透過のアニメーションを0.5秒で行う*/
	opacity: 0.5;/*透過50%*/
}
.slider .slick-slide.slick-center{
	transform: scale(1);/*中央の画像のサイズだけ等倍に*/
	opacity: 1;/*透過なし*/
}

/* 共通(topLineup, topRecruit)------↓ */
.topLineup-container, .topRecruit-container {
	padding: 4% 12vw;
	position: relative;
}

.topLineup-container p.subtitle, 
.topLineup-container div.topSec-copy-box, 
.topRecruit-container p.subtitle, 
.topRecruit-container div.topSec-copy-box {
    position: absolute;
}

.topLineup-container p.subtitle, 
.topRecruit-container p.subtitle {
    top: 15%;
    padding-right: 1.5em;
}

.topLineup-container p.topSec-copy-box, 
.topRecruit-container p.topSec-copy-box {
    top: 15%;
}
.topLineup p.topSec-copy, 
.topRecruit p.topSec-copy {
	margin-top: 0;
	line-height: 2;
}
.topLineup p.topSec-copy span {
	background-color: var(--color-blue);
	padding: 5px 20px;
}
.topRecruit p.topSec-copy span {
	background-color: var(--color-white);
	color: var(--color-blue);
	padding: 5px 20px;
}
/* ↑------共通 */

.topLineup div.topSec-deco {
	transform: scale(-1, 1);
	left: 0;
}


@media screen and (max-width: 1200px){

	.topLineup {
		margin-top: 8%;
	}

	/* 共通(topLineup, topRecruit)------↓ */
	.topLineup-container, .topRecruit-container {
		padding: 6% 5% 8%;
	}

	.topLineup-container p.subtitle, .topLineup-container div.topSec-copy-box, .topRecruit-container p.subtitle, .topRecruit-container div.topSec-copy-box {
		position: relative;
	}

	.topLineup-container p.subtitle, 
	.topRecruit-container p.subtitle {
		top: initial;
		left: -5%;
		padding: 0 1.5em 0 5%;
		display: inline-block;
	}

	.topLineup-container div.topSec-copy-box, 
	.topRecruit-container div.topSec-copy-box {
        margin: 5% 0;
    }

	.topLineup p.topSec-copy, 
	.topRecruit p.topSec-copy {
		line-height: 1.8;
	}
	.topLineup p.topSec-copy span, 
	.topRecruit p.topSec-copy span {
		padding: 1% 0.5em;
	}
	/* ↑------共通 */

}


@media screen and (max-width: 768px){

	.topLineup {
		margin-top: 10%;
	}

	/* 共通(topLineup, topRecruit)------↓ */
	.topLineup-container, .topRecruit-container {
		padding: 8% 5% 10%;
	}

	.topLineup-container div.topSec-copy-box, 
	.topRecruit-container div.topSec-copy-box {
        margin: 8% 0;
    }

	.topLineup p.topSec-copy, 
	.topRecruit p.topSec-copy {
		line-height: 1.3;
	}

	.topLineup-container p.subtitle, 
	.topRecruit-container p.subtitle {
		padding: 0 1.5em 2% 5%;
	}
	/* ↑------共通 */


}


/* topAbout(トップ宝持運輸について) */

.topAbout-inner .subtitle {
    top: 115px;
    left: -12vw;
    padding: 0 1.5em 0 12vw;
}


@media screen and (max-width: 1200px){

	.topAbout-inner .subtitle {
		top: initial;
		left: -5%;
		padding: 0 1.5em 0 5%;
	}

}


/* topCompany(トップ会社案内) */

.topCompany {
	padding: 200px 0 100px;
	overflow: hidden;
}

.topCompany-container {
	position: relative;
}

.topCompany-image {
	width: 58%;
}
.topCompany-image01 {
	max-height: 750px;
    height: 30vw;
}
.topCompany-image01 video {
	width: 100%;
	height: 100%;
	object-fit: cover;
    vertical-align: bottom;
}
.topCompany-image02 {
	width: 50%;
	position: absolute;
	top: -100px;
	right: 0;
}

.topCompany-text {
	margin: 4% 12vw 0;
}

.topCompany-text .subtitle {
    display: inline-block;
    padding-right: 1em;
    text-align: left;
}

.topCompany p.topSec-text {
    width: 80%;
    margin: 0 0 40px auto;
}

.topCompany div.topSec-deco {
	right: -5%;
}


@media screen and (max-width: 1200px){

	.topCompany {
		padding: 8% 0;
	}

	.topCompany h2.title {
		font-size: 90px;
	}

	.topCompany-image {
		width: 100%;
		position: relative;
	}
	.topCompany-image01 {
		width: 60%;
		height: 45vw;
	}
	.topCompany-image02 {
		top: initial;
		bottom: 0;
	}

	.topCompany-text {
        width: 90%;
        margin: 0 auto;
        padding: 5% 0 0;
    }

	.topCompany-text .subtitle {
		position: relative;
		top: initial;
		right: initial;
		left: -5%;
		padding: 0 1.5em 0 5%;
		display: inline-block;
	}

	.topCompany-text p.topSec-text {
		width: 100%;
		margin: 6% 0;
	}

}


@media screen and (max-width: 768px){

	.topCompany {
		padding: 10% 0;
	}

	.topCompany h2.title {
		font-size: max(10vw, 50px);
	}

}


/* topRecruit(トップ採用情報) */

.topRecruit {
	background-color: var(--color-blue);
	padding: 100px 0;
}

.topRecruit-container p.subtitle {
    left: 0;
    padding: 0 1.5em 0 12vw;
}

.topIv-container {
	gap: 5px;
	margin-bottom: 4%;
}

.topIv-inner {
	position: relative;
}
.topIv-inner:nth-child(2) {
	animation-delay: 0.1s;
}

.topIv-inner a {
	overflow: hidden;
}
.topIv-inner a img {
	transition: transform .3s ease; /* ゆっくり変化させる */
}
.topIv-inner a:hover img {
	transform: scale(1.1); /* 拡大 */
}

.topIv-inner h3 {
	position: absolute;
    bottom: 30px;
    left: 30px;
    color: var(--color-blue);
    font-size: 25px;
    background-color: var(--color-white);
    border-radius: 10px;
    padding: 0 10px;
    z-index: 1;
}
.topIv-inner h3 span {
	color: var(--color-red);
	padding-left: 10px;
}

.topRecruit-other {
	gap: 60px;
	margin: 0 12vw;
}

.topRecruit-other-inner {
	width: 50%;
}
.topRecruit-other-inner:nth-child(2) {
	animation-delay: 0.1s;
}

.topRecruit-other-inner a {
	border-bottom: 1px solid var(--color-white);
	padding-bottom: 6%;
}
.topRecruit-other-inner a:hover {
	opacity: 0.5;
}

.topRecruit-other-inner h3, .topRecruit-other-inner p {
	color: var(--color-white);
	transition: all 0.3s;
}

.topRecruit-other-inner h3 {
	font-size: 35px;
	padding-bottom: 10px;
	background: url(./img/common/arrow-right-white.svg) right center no-repeat;
	background-size: 1em;
}

p.topRecruit-other-text {
	font-size: 20px;
}

/* 装飾------↓ */
div.topRecruit-deco {
	position: absolute;
	width: 20%;
}
div.topRecruit-deco01 {
    top: 2%;
    left: 0;
}
div.topRecruit-deco02 {
    top: 18%;
    left: 30%;
}
div.topRecruit-deco03 {
    top: 8%;
    right: 4%;
}
/* ↑------装飾 */


@media screen and (max-width: 1200px){

	.topRecruit {
        padding: 0 0 8%;
    }
	.topRecruit-container p.subtitle {
		left: -5%;
		padding: 0 1.5em 0 5%;
	}

	.topSec .topIv-container {
		display: flex;
		margin-bottom: 0;
	}

	.topIv-inner h3 {
		bottom: 10%;
		left: 5%;
		font-size: max(2vw, 20px);
		border-radius: 5px;
		padding: 0 2%;
	}
	.topIv-inner:nth-child(2) h3 {
		left: 5%;
	}
	.topIv-inner h3 span {
		padding-left: 2%;
	}

	.topSec .topRecruit-other {
        margin: 6% 5% 0;
        display: flex;
        gap: 50px;
    }
	.topRecruit-other-inner {
        width: 100%;
    }
	.topRecruit-other-inner:last-child {
        margin-bottom: 0;
    }

	.topRecruit-other-inner h3 {
        font-size: max(2.2vw, 24px);
        padding-bottom: 2%;
    }

	p.topRecruit-other-text {
        font-size: max(1.8vw, 18px);
    }

	/* 装飾------↓ */
	div.topRecruit-deco01 {
		left: 60%;
	}
	div.topRecruit-deco02 {
		top: 25%;
        left: 50%;
	}
	div.topRecruit-deco03 {
		top: 12%;
		right: 4%;
	}
	/* ↑------装飾 */

}


@media screen and (max-width: 768px){

	.topRecruit {
        padding: 0 0 10%;
    }

	.topSec .topIv-container {
		display: block;
	}

	.topIv-inner {
		margin-bottom: 1%;
	}

	.topIv-inner:last-child {
		margin-bottom: 0;
	}

	.topIv-inner h3 {
		font-size: max(3vw, 18px);
	}

	.topSec .topRecruit-other {
		margin: 10% 5% 0;
        display: block;
    }

	.topRecruit-other a {
		padding-bottom: 6%;
	}
	
	.topRecruit-other-inner {
        margin-bottom: 8%;
    }

	.topRecruit-other-inner h3 {
		font-size: max(4vw, 20px);
	}

	p.topRecruit-other-text {
		font-size: max(2.5vw, 16px);
	}

	/* 装飾------↓ */
	div.topRecruit-deco02 {
        top: 15%;
    }
	div.topRecruit-deco03 {
        top: 10%;
    }
	/* ↑------装飾 */

}


/*--------------
underlayer(下層共通)
--------------*/

.overflowHidden {
	overflow: hidden;
}

div.under-top {
	position: relative;
	animation-delay: -0.1s;
    border-bottom: 2px solid var(--color-blue);
}
div.under-top-inner {
	position: absolute;
	top: 50%;
	left: 12vw;
	transform: translateY(-50%);
	font-style: italic;
}
h2.under-title {
	font-size: 70px;
	color: var(--color-blue);
	line-height: 1.2;
}
p.under-subtitle {
	font-size: 40px;
	color: var(--color-red);
	font-family: var(--font-zenKakuNew);
	line-height: 1;
}

.underSec-margin-y {
	margin: 100px 0;
}
.underSec-margin-xy {
	margin: 100px 12vw;
}


@media screen and (max-width: 1200px){

	div.under-top-inner {
		left: 8%;
	}

	h2.under-title {
		font-size: min(70px, 5.5vw);
	}
	p.under-subtitle {
		font-size: min(40px, 4.5vw);
	}

	.underSec-margin-y {
		margin: 10% 0 12%;
	}
	.underSec-margin-xy {
        margin: 10% 5%;
    }

}


@media screen and (max-width: 768px){

	h2.under-title {
		font-size: max(6.2vw, 24px);
	}
	p.under-subtitle {
		font-size: max(4.5vw, 18px);
	}

}


/*--------------
service(事業内容)
--------------*/

div.service-firstContent {
	position: relative;
	padding-bottom: 100px;
	opacity: 0;
	animation-delay: 0.1s;
}
div.service-fc-inner {
	margin: 0 12vw;
}

div.service-fc-inner h3 {
    margin-bottom: 40px;
}
p.service-fc-text, ul.service-fc-list li {
	font-weight: var(--font-bold700);
}

div.service-fc-deco {
	position: absolute;
	right: 0;
	bottom: 0;
	z-index: -1;
	opacity: 0.5;
}

div.transportContent, 
div.warehouseContent, 
div.forkliftContent {
	margin: 100px auto;
}


@media screen and (max-width: 1200px){
	
	div.service-firstContent {
		padding-bottom: 10%;
	}
	
	div.service-fc-inner {
		margin: 0 5%;
	}

	div.service-fc-inner h3 {
		margin-bottom: 4%;
	}

	div.transportContent, 
	div.warehouseContent, 
	div.forkliftContent {
		margin: 10% auto 12%;
	}

	div.service-fc-deco {
		width: 70%;
	}

}


/*--------------
transport(運送事業)
--------------*/

/* 共通(transport, warehouse)------↓ */
section.transport-sec div.service-fc-inner h3, 
section.warehouse-sec div.service-fc-inner h3 {
	font-size: min(62px, 5vw);
    line-height: 1;
}
section.transport-sec p.service-fc-text, 
section.warehouse-sec p.service-fc-text {
	font-size: 30px;
}
/* ↑------共通(transport, warehouse) */

section.transport-sec div.service-fc-inner h3 span.num {
	font-size: 110%;
	color: var(--color-red);
}
section.transport-sec div.service-fc-inner h3 span.num span {
	font-size: 150%;
}

section.transport-sec p.service-fc-text span {
	color: var(--color-red);
}

section.transport-sec p.service-fc-text:nth-of-type(2) {
	margin-top: 3%;
}


div.tc-text {
	width: 45%;
}
div.tc-text h4 {
    display: inline-block;
    font-size: min(35px, 1.9vw);
    color: var(--color-white);
    background-color: var(--color-blue);
    padding: 5px 1.5em 5px 12vw;
    clip-path: polygon(0 0, 100% 0%, 97.5% 100%, 0% 100%);
}
p.tc-text-inner {
    width: 90%;
    padding: 20px 0 40px 12vw;
}

div.transportContent picture.tc-image {
	width: 55%;
	animation-delay: 0.1s;
}


/* 共通(transport, warehouse)------↓ */
section.service-sec2 {
	background-color: var(--color-blue);
	padding: 100px 0;
}
div.service-sec2-container {
	padding: 0 12vw;
}
h3.service-sec2-title {
	color: var(--color-white);
	font-size: 50px;
	line-height: 1.4;
}
p.service-sec2-text {
	color: var(--color-white);
	margin: 30px 0 45px;
}
/* ↑------共通(transport, warehouse) */

div.transport-sec2-container {
    flex-wrap: wrap;
    row-gap: 1.6vw;
}

div.transport-sec2-inner {
	position: relative;
	width: 49%;
}
div.transport-sec2-inner:nth-child(2n) {
	animation-delay: 0.1s;
}

.transport-sec2-inner a:after {
	position: absolute;
	content: '';
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(51,51,51,.6);
	transition:0.3s;
}
.transport-sec2-inner a:hover:after {
    background-color: rgba(51,51,51,0); /* hover時に背景を透明に */
}

div.transport-sec2-inner p {
    width: 100%;
    text-align: center;
    color: var(--color-white);
    font-size: 30px;
    font-weight: var(--font-bold700);
    text-shadow: #000 0 0 10px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1;
}

.transport-sec2-button a {
    max-width: 500px;
    width: 50%;
    margin: 40px auto 0;
    display: block;
    color: var(--color-white);
    font-size: 24px;
    text-align: center;
    border-radius: 9999px;
    border: 1px solid var(--color-white);
    padding: 10px 1.5em;
	position: relative;
	overflow: hidden;
}
.transport-sec2-button a::after {
    content: "→";
	padding-left: 0.5em;
}
.transport-sec2-button a::before {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	background: var(--color-white);
	transform-origin: 100% 50%;
	transform: scaleX(0);
	transition: transform ease .3s;
}
.transport-sec2-button a:hover {
	color: var(--color-blue);
	border: 1px solid var(--color-white);
}
.transport-sec2-button a:hover::before {
	transform-origin: 0% 50%;
	transform: scaleX(1);
}


@media screen and (max-width: 1200px){

	p.tc-text-inner {
		font-size: 18px;
	}

}


@media screen and (max-width: 1200px){

	div.transportContent {
		display: block;
	}

	div.tc-text {
		width: 100%;
	}

	div.tc-text h4 {
		width: 95%;
		font-size: 35px;
		padding: 1% 1em 1% 5%;
	}	

	p.tc-text-inner {
        width: 100%;
        padding: 3% 5% 6%;
    }

	div.transportContent picture.tc-image {
        width: 95%;
        margin: 2% 0 0 auto;
    }


	section.service-sec2 {
		padding: 12% 0 14%;
	}
	div.service-sec2-container {
		padding: 0 5%;
	}

	h3.service-sec2-title {
        font-size: min(5vw, 50px);
	}

	p.service-sec2-text {
		margin: 5% 0 8%;
	}

	div.transport-sec2-inner p {
		font-size: min(30px, 3vw);
	}

	.transport-sec2-button a {
        margin: 6% auto 0;
    }

}


@media screen and (max-width: 768px){

	/* 共通(transport, warehouse)------↓ */
	section.transport-sec div.service-fc-inner h3, 
	section.warehouse-sec div.service-fc-inner h3 {
		font-size: max(4.5vw, 22px);
	}
	section.transport-sec p.service-fc-text, 
	section.warehouse-sec p.service-fc-text {
		font-size: max(3vw, 18px);
	}
	/* ↑------共通(transport, warehouse) */

	div.tc-text h4 {
		font-size: max(3vw, 18px);
	}


	h3.service-sec2-title {
		font-size: max(4.5vw, 22px);
	}

	div.transport-sec2-inner {
		width: 100%;
		margin-bottom: 6%;
	}
	div.transport-sec2-inner:last-child {
		margin-bottom: 0;
	}

	div.transport-sec2-inner p {
		font-size: max(4vw, 20px);
	}

	.transport-sec2-button a {
        width: 50%;
        min-width: 200px;
        font-size: max(2.5vw, 16px);
        padding: 2% 1.5em;
    }

}


/*--------------
warehouse(倉庫管理事業)
--------------*/

section.warehouse-sec div.service-fc-inner h3 {
	color: var(--color-blue);
}


section.wc-inner:nth-child(odd) {
	flex-direction: row-reverse;
}
section.wc-inner:nth-child(even) {
	align-items: end;
}
section.wc-inner:nth-child(3) {
	margin-top: 4%;
}

div.wc-text {
	position: relative;
}
section.wc-inner:nth-child(odd) div.wc-text {
    margin-top: 4%;
	width: 46%;
}
section.wc-inner:nth-child(even) div.wc-text {
    margin-bottom: 5%;
	text-align: right;
	width: 42%;
}

div.wc-text h4 {
	font-size: 50px;
}

div.wc-text p.subtitle {
	font-size: 70px;
	position: absolute;
	z-index: -1;
	opacity: 0.1;
}
section.wc-inner:nth-child(odd) div.wc-text p.subtitle {
	top: 1%;
	left: 7%;
}
section.wc-inner:nth-child(even) div.wc-text p.subtitle {
	top: 0;
	right: 21%;
}
section.wc-inner:nth-child(1) div.wc-text p.subtitle {
	color: var(--color-blue);
}
section.wc-inner:nth-child(2) div.wc-text p.subtitle {
	color: var(--color-red);
}
section.wc-inner:nth-child(3) div.wc-text p.subtitle {
	color: var(--color-green);
}

div.wc-text p.wc-text-inner {
	margin-top: 30px;
}
section.wc-inner:nth-child(odd) div.wc-text p.wc-text-inner {
	margin-right: 12vw;
}
section.wc-inner:nth-child(even) div.wc-text p.wc-text-inner {
	margin-left: 12vw;
}

div.wc-image {
	width: 52%;
}


/* 共通(warehouse, forklift)------↓ */
section.service-contact {
	background-color: var(--color-lightblue);
	border-radius: 50px;
	padding: 70px;
	font-size: 30px;
	text-align: center;
}
section.service-contact h4 {
	font-size: 50px;
	color: var(--color-blue);
}
p.sc-subtext {
	font-weight: var(--font-bold700);
	align-items: center; /* 線を上下中央 */
	display: flex; /* 文字と線を横並び */
	justify-content: center; /* 文字を中央寄せ */
}
p.sc-subtext::before,
p.sc-subtext::after {
	background-color: var(--color-black); /* 線の色 */
	content: "";
	height: 2px; /* 線の高さ */
	width: 30px; /* 線の長さ */
}
p.sc-subtext::before {
	margin-right: 10px; /* 文字との余白 */
	transform: rotate(60deg); /* 傾ける */
}
p.sc-subtext::after {
	margin-left: 10px; /* 文字との余白 */
	transform: rotate(-60deg); /* 傾ける */
}
/* warehouse------↓ */
div.sc-maintext-warehouse {
	width: 500px;
	margin: 20px auto 30px;
}
/* ↑------warehouse */
/* forklift------↓ */
picture.sc-maintext-forklift {
	max-width: 700px;
    width: 90%;
    margin: 20px auto;
}
p.sc-notetext {
	font-size: 16px;
    text-align: left;
    text-indent: -1em;
    padding-left: 1em;
    display: flex;
    justify-content: center;
    margin-bottom: 30px;
}
/* ↑------forklift */
p.sc-bgtext {
	display: inline-block;
	background-color: var(--color-blue);
	color: var(--color-white);
	font-weight: var(--font-bold700);
	border-radius: 30px;
	padding: 1em 2em;
}
div.sc-arrow {
	display: flex;
	width: 50px;
	margin: 20px auto;
}

p.sc-timetext {
    display: inline-block;
    padding: 0 1.5em;
    background: linear-gradient(transparent 70%, #fef154 70%);
}
p.sc-timetext .num {
	font-size: 140%;
	font-weight: var(--font-bold700);
}
p.sc-timetext .num span {
	font-size: 160%;
}

p.sc-button a {
    max-width: 600px;
    width: 70%;
    margin: 30px auto;
    border-radius: 9999px;
    border: 2px solid var(--color-black);
    padding: 20px 0;
    font-size: 30px;
    font-weight: var(--font-bold700);
    background-color: #fef154;
}
p.sc-button a:hover {
    background-color: var(--color-white);
}
p.sc-button a::after {
    content: "→";
    padding-left: 1em;
}

div.sc-teltext {
	justify-content: center;
    gap: 30px;
}
div.sc-teltext p.sc-teltext-inner:first-child a:hover {
	opacity: 0.5;
}
div.sc-teltext p.sc-teltext-inner, 
div.sc-teltext div.slash {
	font-weight: var(--font-bold700);
}
div.sc-teltext p.sc-teltext-inner span, 
div.sc-teltext div.slash {
	font-size: min(170%, 160%);
}
/* ↑------共通(warehouse, forklift) */


.slider2 .slick-slide {
    margin:0 15px;/*スライド左右の余白調整*/
	transition: transform 0.5s ease-in-out;
}


@media screen and (max-width: 1200px){
	
	section.warehouse-sec p.service-fc-text br.pc-br {
		display: none;
	}

	section.wc-inner {
		margin: 0 0 8% 0;
	}
	section.wc-inner:nth-child(2) {
		margin-top: 0;
	}
	section.wc-inner:nth-child(3) {
		margin-top: 0;
	}

	div.wc-text h4 {
		font-size: min(5vw, 50px);
	}
	div.wc-text p.subtitle {
		font-size: min(7.5vw, 70px);
	}

	section.wc-inner:nth-child(odd) div.wc-text p.subtitle {
		top: -5%;
        left: 15%;
	}
	section.wc-inner:nth-child(even) div.wc-text p.subtitle {
        top: -2%;
        right: 18%;
    }

	section.wc-inner:nth-child(odd) div.wc-text {
		padding-right: 5%;
	}
	section.wc-inner:nth-child(even) div.wc-text {
		padding-left: 5%;
	}

	div.wc-text p.wc-text-inner {
		margin-top: 2.5%;
		font-size: max(1.8vw, 18px);
	}
	section.wc-inner:nth-child(odd) div.wc-text p.wc-text-inner {
		margin-right: 0;
	}
	section.wc-inner:nth-child(even) div.wc-text p.wc-text-inner {
		margin-left: 0;
	}

	section.wc-inner:nth-child(even) div.wc-image {
		margin-left: auto;
	}


	/* 共通(warehouse, forklift)------↓ */
	section.service-contact {
		padding: 5%;
	}

	p.sc-bgtext {
		font-size: min(3.7vw, 30px);
	}

	p.sc-button a {
		font-size: min(30px, 3.2vw);
	}

	div.sc-teltext {
		display: block;
	}
	div.sc-teltext div.slash {
		display: none;
	}

	div.sc-teltext p.sc-teltext-inner {
        line-height: 1.4;
    }
	/* ↑------共通(warehouse, forklift) */

}


@media screen and (max-width: 768px){

	div.wc-text h4 {
		font-size: max(4.5vw, 22px);
	}

	div.wc-text p.subtitle {
		font-size: max(7vw, 40px);
	}

	
	section.wc-inner:nth-child(odd) div.wc-text, 
	section.wc-inner:nth-child(even) div.wc-text {
		width: 90%;
		margin: 0 auto;
		padding: 0;
	}

	div.wc-text p.wc-text-inner {
		font-size: max(3vw, 17px);
	}

	div.wc-image {
		width: 95%;
		margin-top: 4%;
	}


	/* 共通(warehouse, forklift)------↓ */
	section.service-contact {
		border-radius: 20px;
		font-size: max(2.5vw, 16px);
	}

	section.service-contact h4 {
		font-size: max(4.5vw, 22px);
	}

	p.sc-subtext::before, p.sc-subtext::after {
		height: 1px;
		width: 5%;
	}
	div.sc-maintext-warehouse, picture.sc-maintext-forklift {
		width: 90%;
		max-width: 450px;
		margin: 4% auto 6%;
	}
	/* forklift------↓ */
	p.sc-notetext {
        font-size: max(2vw, 14px);
        margin-bottom: 6%;
    }
	/* ↑------forklift */

	p.sc-bgtext {
		border-radius: 15px;
		font-size: max(2.5vw, 16px);
	}

	div.sc-arrow {
		width: 15%;
		max-width: 40px;
		margin: 4% auto;
	}

	p.sc-timetext {
		padding: 0 0.75em;
		background: linear-gradient(transparent 70%, #fef154 70%);
	}

	p.sc-timetext .num {
		font-size: 110%;
	}
	p.sc-timetext .num span {
		font-size: 150%;
	}

	p.sc-button a {
        width: 100%;
        max-width: 450px;
        margin: 4% auto;
        padding: 3% 0;
        font-size: max(2.5vw, 16px);
    }

	div.sc-teltext p.sc-teltext-inner {
		font-size: max(3.5vw, 18px);
	}
	div.sc-teltext p.sc-teltext-inner span {
		font-size: 150%;
	}
	/* ↑------共通(warehouse, forklift) */


	.slider2 .slick-slide {
		margin:0 0.3%;/*スライド左右の余白調整*/
	}

}


/*--------------
forklift(フォークリフト塗装)
--------------*/

section.forklift-sec div.service-fc-inner h3 {
	font-size: 45px;
	color: var(--color-green);
}
section.forklift-sec p.service-fc-text {
	font-size: 30px;
}

ul.service-fc-list li {
    font-size: 35px;
    margin-bottom: 10px;
    background: url(./img/service/forklift/check.svg) left center no-repeat;
    background-size: 40px;
    padding-left: 55px;
}
ul.service-fc-list li:last-child {
	margin-bottom: 0;
}
ul.service-fc-list li span {
	border-bottom: 2px dotted var(--color-black);
	padding-right: 1em;
}


div.forkliftContent, div.forklift-ba {
	margin: 100px 12vw;
}

div.forkliftContent {
	gap: 30px;
}

div.fc-inner {
	width: 32%;
}
div.fc-inner:nth-child(2) {
	animation-delay: 0.1s;
}
div.fc-inner:nth-child(3) {
	animation-delay: 0.2s;
}

div.fc-inner h4 {
	font-size: min(35px, 2.8vw);
	color: var(--color-blue);
	line-height: 1.4;
}
div.fc-inner h4 span {
	font-size: 180%;
	padding-right: 10px;
}

p.fc-text {
	font-size: 18px;
	margin-top: 10px;
}


div.forklift-ba {
	gap: 50px;
}

div.forklift-ba-inner:nth-child(2) {
	animation-delay: 0.1s;
}

p.forklift-ba-text {
	font-size: 40px;
	text-align: center;
	font-weight: var(--font-bold700);
	color: var(--color-blue);
}
div.forklift-ba-arrow {
	display: flex;
    width: 50px;
    margin: 20px auto;
}


@media screen and (max-width: 1200px){
	
	section.forklift-sec div.service-fc-inner h3 {
    	font-size: min(45px, 4.5vw);
	}

	ul.service-fc-list li {
		font-size: min(35px, 4vw);
	}


	div.forkliftContent, div.forklift-ba {
		margin: 8% 5% 10%;
	}

	div.forkliftContent {
		gap: 2.5vw;
	}

	div.fc-inner:last-child {
		margin-bottom: 0;
	}

	div.fc-inner h4 {
		font-size: min(3vw, 35px);
	}

	picture.fc-image {
		margin: 4% 0 6%;
	}

	p.fc-text {
		font-size: max(1.8vw, 18px);
	}


	p.sc-bgtext br.pc-br {
		display: none;
	}

}


@media screen and (max-width: 768px){

	section.forklift-sec div.service-fc-inner h3 {
        font-size: max(4vw, 20px);
    }

	ul.service-fc-list li {
        font-size: max(3vw, 16px);
        background-size: 4.5%;
        padding-left: 6%;
    }


	div.fc-inner {
		width: 100%;
		margin-bottom: 8%;
	}

	div.fc-inner h4 {
		font-size: max(4vw, 20px);
		margin-bottom: 2%;
	}
	div.fc-inner h4 span {
		font-size: 150%;
		padding-right: 2%;
	}

	picture.fc-image {
        margin: 2% 0 3%;
    }

	p.fc-text {
        font-size: max(2.5vw, 16px);
        margin-top: 2%;
    }


	div.forklift-ba-inner {
		margin-bottom: 8%;
	}
	div.forklift-ba-inner:last-child {
		margin-bottom: 0;
	}

	p.forklift-ba-text {
		font-size: max(5vw, 22px);
	}

	div.forklift-ba-arrow {
		width: 15%;
		max-width: 40px;
		margin: 4% auto;
	}

}


/*--------------
lineup(車両紹介)
--------------*/

.lineup-firstContent h3 {
    font-size: 62px;
    margin-bottom: 40px;
    line-height: 1.4;
}

p.lineup-fc-text {
	font-weight: var(--font-bold700);
}


table.lineup-graph {
	width: 100%;
	margin-top: 100px;
}

table.lineup-graph th, 
table.lineup-graph td {
	border-right: 3px solid var(--color-white);
	border-left: 3px solid var(--color-white);
	font-size: 25px;
	text-align: center;
	padding: 10px 0;
}

table.lineup-graph th, table.lineup-graph td.fd-name {
	font-weight: var(--font-bold700);
}

table.lineup-graph th, table.lineup-graph td.total {
	border-top: 3px solid var(--color-white);
	border-bottom: 3px solid var(--color-white);
}
table.lineup-graph tr.bordertop-row td {
	border-top: 3px solid var(--color-white);
}
table.lineup-graph tr.borderbottom-row td {
	border-bottom: 3px solid var(--color-white);
}

table.lineup-graph th {
	color: var(--color-white);
}
table.lineup-graph th.normal-th {
	background-color: var(--color-lightgreen);
}
table.lineup-graph th.subtotal-th {
    background-color: #4040a0;
}
table.lineup-graph th.total-th {
	background-color: var(--color-blue);
}

table.lineup-graph tr.frozen-row td {
	background-color: #ebebeb;
}
table.lineup-graph tr.frozen-row td.fd-name {
	color: var(--color-blue);
}

table.lineup-graph tr.dry-row td {
	background-color: #d6d6d6;
}
table.lineup-graph tr.dry-row td.fd-name {
	color: var(--color-red);
}

table.lineup-graph tr td.subtotal-td1 {
	background-color: #e5e5f2;
}
table.lineup-graph tr td.subtotal-td2 {
	background-color: #d9d9ec;
}

table.lineup-graph tr td.total {
	background-color: #cccce6;
}


section.lineup_main {
	position: relative;
	margin-top: 0;
}

section.lineup_main h3.hidden {
	display: none;
}

div.lineup_tab {
	width: 270px;
    padding-top: 50px;
}
div.lineup_tab nav {
	position: sticky;
	top: 150px;
}
div.lineup_tab li {
	margin-bottom: 15px;
}
div.lineup_tab li:last-child {
	margin-bottom: 0;
}
div.lineup_tab li a {
	text-align: center;
	font-weight: var(--font-bold700);
	background-color: var(--color-lightgreen);
	color: var(--color-white);
	padding: 15px 1em;
}
div.lineup_tab li a.active {
	background-color: var(--color-blue);
}

div.lineup_main_container {
	width: calc(100% - 320px);
}


/*slickカスタマイズ*/
	
div.lineup_main_container .slick-dotted.slick-slider
{
	margin-bottom: 0;
}

div.lineup_main_container .slick-initialized .slick-slide {
	margin: 0;
	padding: 0;
	line-height: 0;
	display: flex;
	justify-content: center;
	align-items: center;
}

div.vehicles_photo .slide-arrow {
	margin: 0;
	width: 13px;
	cursor: pointer;
	position: absolute;
	bottom: 9px;
	z-index: 1;
}

div.lineup_main_container .prev-arrow {
	left: 12px;
}

div.lineup_main_container .next-arrow {
	right: 12px;
}

div.vehicles_photo .slide-arrow img {
	width: 100%;
	height: auto;
}

.vehicles-dots {
	margin: 0;
	padding: 0;
	text-align: center;
	font-size: 0;
	line-height: 0;
}

.vehicles-dots li {
	margin: 0 6px;
	padding: 0;
	width: 16px;
	display: inline-block;
}

.vehicles-dots li button {
	margin: 0;
	padding: 0;
	position: relative;
	text-indent: -9999px;
	font-size: 0;
	line-height: 0;
}

.vehicles-dots li button::before {
	margin: 0 auto;
	padding: 0;
	font-size: 0;
	line-height: 0;
	width: 16px;
	height: 16px;
	background-image: url(./img/lineup/dots.png);
	background-repeat: no-repeat;
	background-size: contain;
	content: "";
	cursor: pointer;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 16px;
}

.vehicles-dots li.slick-active button::before {
	background-image: url(./img/lineup/dots_active.png);
}

div.lineup_main_container button {
	background: none;
	border: none;
	outline: none;
	padding: 0 7px;
	font-size: 0;
	line-height: 0;
}

div.lineup_main_container .slick-prev,
div.lineup_main_container .slick-next {
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: 50%;
    display: block;
    width: 20px;
    height: 20px;
    padding: 0;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    cursor: pointer;
    color: transparent;
    border: none;
    outline: none;
    background: transparent;
}
div.lineup_main_container .slick-prev {
    left: -25px;
}

/*slickカスタマイズここまで*/

/* ここから金山さんコード */

#vehicle01, #vehicle02, #vehicle03, #vehicle04 {
	padding-top: 50px;
}

div.vehicles_content {
	margin: 0 auto 50px;
	width: 100%;
}
#vehicle04 div.vehicles_content {
	margin-bottom: 0;
}

div.vehicles_content h4 {
	padding: 10px 1em;
	background: var(--color-blue);
	color: var(--color-white);
	font-size: 25px;
}

div.vehicles_content h5 {
	color: var(--color-blue);
	font-size: 25px;
	margin: 15px 0;
}

div.vehicles_box {
	width: 100%;
}

div.vehicles_content div.vehicles_box:last-child {
	margin: 0 auto;
}

.gate-available-box {
	position: relative;
}

.gate-available {
	position: absolute;
	top: 25px;
	left: 9px;
	width: 80px;
	z-index: 1;
}

div.vehicles_photo {
	margin: 0 auto;
	width: 100%;
}

div.vehicles_photo img {
	width: 100%;
	height: auto;
}

div.vehicles_thumb {
	margin: 20px auto;
	width: 100%;
	text-align: center;
	overflow: hidden;
}

.vehicles_thumb div {
	margin: 0;
	overflow: hidden;
}

div.lineup_main_container .vehicles_thumb .slick-slide {
	margin: 0 3px;
}

.vehicles_thumb img {
	width: 100%;
	height: auto;
}

div.vehicles_info {
	margin-bottom: 75px;
}
#vehicle04 div.vehicles_box:last-child div.vehicles_info {
	margin-bottom: 0;
}

div.vehicles_info table {
	margin: 0 auto;
	width: 100%;
	font-size: 18px;
}

div.vehicles_info table th {
	padding: 10px 0;
	width: 150px;
	background: var(--color-blue);
	border-right: 2px solid var(--color-white);
	border-bottom: 2px solid var(--color-white);
	color: var(--color-white);
	text-align: center;
}

div.vehicles_info table td {
	padding: 10px 1em;
	background: #eeeeee;
	border-bottom: 2px solid var(--color-white);
}
/* ここまで金山さんコード */


@media screen and (max-width: 1200px){

	.lineup-firstContent {
		margin: 10% 5% 5%;
	}


	.lineup-firstContent h3 {
		font-size: min(62px, 5vw);
		margin-bottom: 2.5%;
	}


	table.lineup-graph {
		margin-top: 10%;
	}

	table.lineup-graph th, 
	table.lineup-graph td {
		border-right: 2px solid var(--color-white);
		border-left: 2px solid var(--color-white);
	}

	table.lineup-graph th, table.lineup-graph td.total {
		border-top: 2px solid var(--color-white);
		border-bottom: 2px solid var(--color-white);
	}
	table.lineup-graph tr.bordertop-row td {
		border-top: 2px solid var(--color-white);
	}
	table.lineup-graph tr.borderbottom-row td {
		border-bottom: 2px solid var(--color-white);
	}


	section.lineup_main {
		display: block;
		margin: 5% 5% 10%;
	}


	div.lineup_tab, div.lineup_main_container {
		width: 100%;
		padding-top: 0;
	}
	div.lineup_main_container {
		width: 100%;
		margin-top: 4%;
	}

}


@media screen and (max-width: 768px){

	.lineup-firstContent h3 {
		font-size: max(4.5vw, 22px);
	}


	table.lineup-graph th, table.lineup-graph td {
		font-size: max(2.5vw, 14px);
		padding: 2% 0;
	}


	section.lineup_main {
        margin: 10% 5% 12%;
    }


	div.lineup_tab nav {
		top: 70px;
	}
	div.lineup_tab li {
		margin-bottom: 3%;
	}
	div.lineup_tab li a {
		padding: 2% 1.5%;
	}

	#vehicle01, #vehicle02, #vehicle03, #vehicle04 {
		padding-top: 4%;
	}	

	div.lineup_main_container {
		margin-top: 8%;
	}

	div.vehicles_content h4 {
		padding: 2% 1em;
		font-size: max(3vw, 18px);
	}

	div.vehicles_content h5 {
		font-size: max(3vw, 18px);
		margin: 2% 0;
	}

	.gate-available {
		top: 1%;
		left: 2%;
		width: 18%;
	}

	div.vehicles_content {
		margin: 0 auto 6%;
	}

	div.vehicles_info {
		margin-bottom: 12%;
	}

	div.vehicles_info table {
		font-size: max(2.5vw, 16px);
	}

	div.vehicles_info table th {
		padding: 3% 0;
		width: 35%;
	}
	div.vehicles_info table td {
		padding: 3% 1em;
	}

}


/*--------------
about(宝持運輸について)
--------------*/

/* 共通(about, company)------↓ */
div.under-title-box {
	position: relative;
	margin-bottom: 80px;
}
div.under-title-box h3 {
    display: inline-block;
    font-size: 65px;
    padding: 0 1em 0 12vw;
    border-bottom: 3px solid var(--color-red);
}
div.under-title-box p.subtitle {
	position: absolute;
	top: 50%;
	left: 12vw;
	transform: translateY(-50%);
	z-index: -1;
	font-size: 150px;
	color: var(--color-blue);
	opacity: 0.1;
}
/* ↑------共通(about, company) */


section.about-sec-container {
	margin: 50px 0;
}
section.about-sec-container h4 {
	font-size: 60px;
	color: var(--color-blue);
    margin-bottom: 2%;
	margin-left: 12vw;
}
section.about-sec-container h4 span {
	font-size: 100px;
	color: var(--color-red);
	padding-right: 20px;
	position: relative;
	bottom: -5px;
}

section.about-sec-container:nth-child(odd) div.about-sec-inner {
	flex-direction: row-reverse;
}

div.about-sec-image {
	width: 50%;
}

p.about-sec-text {
    width: 35%;
    margin-top: 40px;
    font-size: 22px;
}
section.about-sec-container:nth-child(odd) p.about-sec-text {
	margin-left: 12vw;
}
section.about-sec-container:nth-child(even) p.about-sec-text {
	margin-right: 12vw;
}

section.about-sec2-container:nth-child(1) {
    width: 100%;
    background: url(./img/about/about-ser-image01.jpg) center center no-repeat;
    background-size: cover;
}
section.about-sec2-container:nth-child(2) {
    width: 100%;
    background: url(./img/about/about-ser-image02.jpg) center center no-repeat;
    background-size: cover;
}
section.about-sec2-container:nth-child(3) {
    width: 100%;
    background: url(./img/about/about-ser-image03.jpg) center center no-repeat;
    background-size: cover;
}

div.about-sec2-inner {
	background-color: rgba(0, 0, 128, 0.7);
	width: 65%;
	padding: 100px 0 100px 12vw;
	clip-path: polygon(0 0, 80% 0, 100% 100%, 0% 100%);
	color: var(--color-white);
}

div.about-sec2-inner h4 {
	font-size: 55px;
}

p.about-sec2-text, div.about-sec2-inner p.more-button {
	width: 75%;
}

p.about-sec2-text {
	font-size: 18px;
}

div.about-sec2-inner p.more-button a {
    margin: 15px 0 0 auto;
}

section.about-sec2-container:nth-child(2) div.about-sec2-inner  {
    clip-path: polygon(20% 0%, 100% 0%, 100% 100%, 0% 100%);
	margin: 0 0 0 auto;
    padding: 100px 12vw 100px 0;
}

div.about-sec2-image {
	display: none;
}


@media screen and (max-width: 1200px){

	/* 共通(about, company)------↓ */
	div.under-title-box {
		margin-bottom: 6%;
	}
	div.under-title-box h3 {
		font-size: min(65px, 5vw);
		padding: 0 1em 0 5%;
	}
	div.under-title-box p.subtitle {
        left: 5%;
        font-size: min(150px, 14vw);
    }
	/* ↑------共通(about, company) */


	section.about-sec-container {
		margin: 6% 0;
	}


	section.about-sec-container h4 {
		font-size: min(60px, 5vw);
		margin-left: 5%;
	}
	section.about-sec-container h4 span {
		font-size: 180%;
		padding-right: 2%;
		bottom: -3px;
	}

	div.about-sec-inner {
		align-items: center;
	}

	section.about-sec-container:nth-child(odd) div.about-sec-image {
		margin-left: auto;
	}

	p.about-sec-text, div.about-sec2-inner p.more-button {
		width: 42%;
	}


	section.about-sec2 {
		margin-top: 16%;
	}

	section.about-sec2 div.under-title-box {
		margin-bottom: 10%;
	}

	div.about-sec2-inner h4 {
		font-size: 40px;
	}

	section.about-sec2-container:nth-child(1), 
	section.about-sec2-container:nth-child(2), 
	section.about-sec2-container:nth-child(3) {
		background: none;
	}

	div.about-sec2-image {
		display: block;
	}

	p.about-sec-text {
		font-size: min(2.2vw, 20px);
	}
	section.about-sec-container:nth-child(odd) p.about-sec-text {
		margin-top: 0;
		margin-left: 5%;
	}
	section.about-sec-container:nth-child(even) p.about-sec-text {
		margin-top: 0;
		margin-right: 5%;
	}


	div.about-sec2-inner {
		width: 100%;
		padding: 8% 5% 10%;
		clip-path: initial;
        background-color: var(--color-blue);
	}
	section.about-sec2-container:nth-child(2) div.about-sec2-inner {
		padding: 8% 5% 10%;
		clip-path: initial;
	}

	p.about-sec2-text, div.about-sec2-inner p.more-button {
		width: 100%;
	}
	
	div.about-sec2-inner p.more-button a {
		margin: 4% 0 0;
	}

	div.about-sec2-inner .align-right {
		text-align: left;
	}
	div.about-sec2-inner .margin-right {
		margin: 0;
	}

}


@media screen and (max-width: 768px){

	/* 共通(about, company)------↓ */
	div.under-title-box h3 {
		font-size: max(4.5vw, 22px);
		padding: 0 1em 0 5%;
		border-bottom: 2px solid var(--color-red);
	}
	div.under-title-box p.subtitle {
		font-size: max(9vw, 50px);
	}
	/* ↑------共通(about, company) */


	section.about-sec-container h4 {
		font-size: max(4vw, 20px);
		line-height: 1;
	}

	section.about-sec-container h4 span {
		bottom: -2px;
	}
	
	div.about-sec-image {
		width: 95%;
        margin: 6% 0;
	}

	p.about-sec-text, div.about-sec2-inner p.more-button {
		width: 90%;
		margin-top: 2.5%;
	}

	p.about-sec-text {
		font-size: max(2.5vw, 16px);
	}
	section.about-sec-container:nth-child(odd) p.about-sec-text, 
	section.about-sec-container:nth-child(even) p.about-sec-text {
		margin-right: auto;
		margin-left: auto;
	}


	div.about-sec2-inner h4 {
		font-size: max(4.5vw, 22px);
	}

	div.about-sec2-inner p.about-sec2-text {
        font-size: max(2.5vw, 16px);
        margin: 2% 0 4%;
	}

}


/*--------------
company(会社案内)
--------------*/

.company-sec-inner {
	padding: 0 12vw;
}


div.cm-text {
	width: 100%;
	animation-delay: 0.1s;
}
div.cm-text p {
	margin-bottom: 20px;
}
div.cm-text p.cm-copy {
	font-size: min(40px, 2.9vw);
	font-weight: var(--font-bold700);
	color: var(--color-blue);
	line-height: 1.4;
	margin-bottom: 40px;
}
div.cm-text p.cm-name {
    margin-bottom: 0;
    text-align: right;
    font-weight: var(--font-bold700);
}


/* 共通(company, recruit)------↓ */
section.company-profile, 
section.recruit-service {
	background-color: var(--color-blue);
	padding: 100px 0;
	color: var(--color-white);
}
section.company-profile div.under-title-box h3, 
section.recruit-service div.under-title-box h3 {
    border-bottom: 3px solid var(--color-white);
}
section.company-profile div.under-title-box p.subtitle, 
section.recruit-service div.under-title-box p.subtitle {
	color: var(--color-white);
	z-index: 1;
}
/* ↑------共通(company, recruit) */

table.company-table {
	width: 100%;
}

table.cp-table th, table.cp-table td {
    border-left: 2px solid var(--color-white);
    border-top: 1px solid var(--color-white);
	padding: 30px;
}
table.ch-table th, table.ch-table td {
    border-left: 2px solid var(--color-black);
    border-top: 1px solid var(--color-black);
	padding: 30px;
}

table.company-table th:first-child, 
table.company-table td:first-child {
    border-left:none;
}
table.company-table tr:first-child th, 
table.company-table tr:first-child td {
    border-top:none;
}

table.company-table th {
	width: 20%;
	vertical-align: top;
}

table.company-table td {
	width: 80%;
	padding-left: 40px;
}
table.company-table td a {
	color: var(--color-white);
}
table.company-table td.ct-tell a:hover {
	opacity: 0.5;
}
table.company-table td div.map {
	margin-top: 1%;
}
table.company-table td div.map iframe {
    width: 90%;
    aspect-ratio: 580 / 280;
}


@media screen and (max-width: 1200px){

	.company-sec-inner {
		padding: 0 5%;
	}

	div.cm-text p.cm-copy {
        margin: 6% 0 5%;
    }
	div.cm-text p {
		margin: 3% 0;
	}


	/* 共通(company, recruit)------↓ */
	section.company-profile, section.recruit-service {
		padding: 10% 0 12%;
	}
	/* ↑------共通(company, recruit) */

	table.ch-table th, table.ch-table td {
		padding: 20px;
	}
	table.company-table th {
		width: 24%;
	}
	table.company-table td {
		width: 76%;
	}

}


@media screen and (max-width: 768px){

	div.cm-text p.cm-copy {
        font-size: max(4.5vw, 24px);
    }


	/* 共通(company, recruit)------↓ */
	section.company-profile div.under-title-box h3, section.recruit-service div.under-title-box h3 {
		border-bottom: 2px solid var(--color-white);
	}
	/* ↑------共通(company, recruit) */

	table.cp-table tr {
		border-bottom: 1px solid var(--color-white);
	}
	table.ch-table tr {
		border-bottom: 1px solid var(--color-black);
	}

	table.company-table th, table.company-table td {
        border: none;
        display: block;
        width: 100%;
    }
	table.company-table th {
        padding: 4% 0 0 0;
		font-weight: var(--font-bold700);
    }
	table.company-table td {
        padding: 0 0 4% 0;
    }
	table.company-table td div.map iframe {
		width: 100%;
	}

}


/*--------------
recruit(採用情報トップ)
--------------*/

div.recruit-top-inner {
	margin: 0 12vw;
}

p.rt-copy {
    width: 30%;
    font-size: min(35px, 2.8vw);
    font-weight: var(--font-bold700);
}

div.rt-text {
    width: 65%;
    margin: 0 0 0 auto;
	animation-delay: 0.1s;
}
div.rt-text p {
	margin-bottom: 30px;
}
div.rt-text p:last-child {
	margin-bottom: 0;
}

ul.recruit-top-slider {
	margin-top: 100px;
}


section.rs-inner {
	margin-top: 80px;
}
section.rs-inner:nth-child(odd) {
	flex-direction: row-reverse;
}

div.rs-text, div.rs-image {
	width: 48%;
}

div.rs-text {
	padding: 0 0 0 12vw;
	font-size: 18px;
}
section.rs-inner:nth-child(odd) div.rs-text {
	padding: 0 12vw 0 0;
}

div.rs-text h4 {
	font-size: 40px;
	font-weight: var(--font-bold700);
	margin-bottom: 30px;
	padding-left: 1.5em;
	position: relative;
}
div.rs-text h4 span.num {
	font-size: 90px;
	line-height: 1;
	color: var(--color-red);
	opacity: 0.5;
	position: absolute;
	bottom: 0;
	left: 0;
}
div.rs-text h4 span.rs-text-title {
	position: relative;
	z-index: 1;
}

p.rs-text-inner, ul.rs-text-list {
	margin-bottom: 15px;
}

p.rs-listbox-title {
	font-size: 20px;
	font-weight: var(--font-bold700);
	margin-bottom: 5px;
}
p.rs-listbox-title::before {
	content: "○";
}

ul.rs-listbox {
	padding: 10px;
	border: 1px solid var(--color-white);
}
ul.rs-listbox li::before, ul.rs-text-list li::before {
	content: "・";
}
ul.rs-listbox li:last-child {
	position: relative;
}
ul.rs-listbox li:last-child span {
	position: absolute;
	right: 0;
}

ul.rs-text-list {
	font-size: max(20px, 1.3vw);
	font-weight: var(--font-bold700);
}

div.rs-image {
	animation-delay: 0.1s;
}


section.recruit-footer {
	margin-bottom: 0;
}

section.rf-inner {
	position: relative;
}
section.rf-inner a {
	overflow: hidden;
}
section.rf-inner a picture {
	transition: transform .3s ease; /* ゆっくり変化させる */
}
section.rf-inner a:hover picture {
	transform: scale(1.1); /* 拡大 */
}

div.rf-text {
	position: absolute;
	bottom: 5%;
	left: 5%;
	z-index: 1;
}

p.rf-text-bgtext {
	display: inline-block;
	border-radius: 5px;
	background-color: var(--color-white);
	font-size: 16px;
	color: var(--color-blue);
	padding: 5px 10px;
}
div.rf-text h4 {
	color: var(--color-white);
	font-size: 50px;
	line-height: 1.2;
	font-weight: var(--font-bold700);
}
div.rf-text h4 span {
	color: var(--color-red);
}

div.rf-other {
	margin: 80px 12vw
}

section.rf-other-inner {
	width: 45%;
}

section.rf-other-inner a {
	border-bottom: 1px solid var(--color-blue);
}
section.rf-other-inner a:hover {
	border-bottom: 1px solid var(--color-green);
}

section.rf-other-inner h4 {
	font-size: 35px;
	color: var(--color-blue);
	background: url(./img/common/arrow-right-blue.svg) right center no-repeat;
	background-size: 1em;
	transition: all 0.3s;
}
section.rf-other-inner a:hover h4 {
	color: var(--color-green);
	background: url(./img/common/arrow-right-green.svg) right center no-repeat;
	background-size: 1em;
}

p.rf-other-text {
	font-size: 18px;
	margin-bottom: 20px;
}


@media screen and (max-width: 1200px){

	div.recruit-top-inner {
		display: block;
		margin: 0 5%;
	}

	p.rt-copy {
        width: 100%;
		font-size: 35px;
        line-height: 1.4;
    }

	div.rt-text {
		width: 100%;
		margin: 5% 0 0;
	}
	div.rt-text p {
		margin-bottom: 3%;
	}

	ul.recruit-top-slider {
		margin-top: 10%;
	}

	
	section.rs-inner {
		display: block;
		margin-top: 12%;
	}
	div.rs-text, div.rs-image {
		width: 95%;
		margin-top: 7%;
	}

	div.rs-text {
        width: 95%;
        padding-left: 5%;
		font-size: max(2vw, 20px);
    }

	section.rs-inner:nth-child(odd) div.rs-text {
		padding: 0 0 0 5%;
	}

	div.rs-text h4 {
		margin-bottom: 4%;
	}

	p.rs-text-inner, ul.rs-text-list {
		margin-bottom: 4%;
	}

	p.rs-listbox-title {
        margin-bottom: 1%;
	}
	ul.rs-listbox {
		padding: 2%;
	}
	
	section.rs-inner:nth-of-type(odd) div.rs-image {
        margin-left: auto;
    }


	div.rf-container {
		flex-wrap: wrap;
	}

	div.rf-text {
		bottom: 7%;
	}
	p.rf-text-bgtext {
		padding: 1% 4%;
		margin-bottom: 2%;
	}
	
	div.rf-other {
		margin: 8% 5%;
	}

	div.rf-text h4 {
        font-size: min(5.5vw, 60px);
    }

	section.rf-other-inner:last-child {
		margin-bottom: 0;
	}

	section.rf-other-inner h4 {
		font-size: min(3.5vw, 25px);
	}

	p.rf-other-text {
		margin-bottom: 4%;
		font-size: max(1.8vw, 18px);
	}

}


@media screen and (max-width: 768px){

	p.rt-copy {
		font-size: max(5vw, 30px);
    }

	
	div.rs-text {
        font-size: max(2.5vw, 16px);
    }

	div.rs-text h4 {
		font-size: max(4vw, 20px);
	}
	div.rs-text h4 span.num {
		font-size: 250%;
	}

	ul.rs-text-list {
		font-size: max(2.5vw, 16px);
	}

	p.rs-listbox-title {
		font-size: max(3vw, 18px);
	}
	ul.rs-listbox {
		font-size: max(2vw, 14px);
	}


	p.rf-text-bgtext {
		font-size: max(2vw, 14px);
	}
	div.rf-text h4 {
        font-size: max(4.5vw, 24px);
    }

	div.rf-other {
		margin: 10% 5%;
	}
	
	section.rf-other-inner {
		width: 100%;
		margin-bottom: 10%;
	}

	section.rf-other-inner h4 {
		font-size: max(4vw, 20px);
	}

	p.rf-other-text {
		font-size: max(2.5vw, 16px);
	}

}


/*--------------
interview
--------------*/

div.interview-info {
	margin-bottom: 30px;
}

p.ii-kinds {
	display: inline-block;
	padding: 5px 20px;
	color: var(--color-white);
	background-color: var(--color-red);
	border-radius: 10px;
}
p.ii-name {
	color: var(--color-blue);
	font-weight: var(--font-bold700);
	font-size: 60px;
	line-height: 1.4;
}

div.interview-info-copy p {
	margin-bottom: 20px;
}
div.interview-info-copy p:last-child {
	margin-bottom: 0;
}
div.interview-info-copy p span {
	color: var(--color-white);
	font-size: 35px;
	font-weight: var(--font-bold700);
    background-color: var(--color-blue);
    padding: 5px 20px;
}

picture.interview-main-image, 
div.interview-qa {
	margin-bottom: 50px;
}

div.interview-qa1 {
	flex-direction: row-reverse;
}

div.interview-qa-container, div.interview-qa-image {
	width: 48%;
}
dl.interview-qa-inner {
	margin-bottom: 30px;
}
dl.interview-qa-inner:nth-child(2) {
	margin-bottom: 0;
}
dl.interview-qa-inner dt {
	font-size: 22px;
	color: var(--color-blue);
	font-weight: var(--font-bold700);
	margin-bottom: 1%;
}
dl.interview-qa-inner dd {
	font-size: 17px;
}

div.interview-qa-image {
	animation-delay: 0.1s;
}


section.interview-schedule {
	color: var(--color-white);
}
section.interview-schedule1 {
    background: url(./img/recruit/interview/interview1-sub-image03.jpg) center center no-repeat;
    background-size: cover;
}
section.interview-schedule2 {
    background: url(./img/recruit/interview/interview2-sub-image03.jpg) center center no-repeat;
    background-size: cover;
}
section.interview-schedule3 {
    background: url(./img/recruit/interview/interview3-sub-image03.jpg) center center no-repeat;
    background-size: cover;
}
div.interview-schedule-bg {
	padding: 100px 12vw;
}

.interview-schedule h3, 
.interview-schedule p.is-sub-text {
	text-align: center;
}
.interview-schedule h3 {
	font-size: 50px;
	line-height: 1.2;
}

div.is-list {
	margin-top: 50px;
	justify-content: center;
	gap: 50px;
	font-size: 18px;
}

div.is-list-container {
	width: 40%;
}

div.is-list-inner {
	align-items: center;
	margin-bottom: 30px;
}

p.is-time {
	color: var(--color-blue);
	text-align: center;
	background-color: var(--color-white);
	width: 80px;
	border-radius: 5px;
	position: relative;
}
p.is-time::after {
	content: "";
    width: 2px;
    height: 45px;
    background-color: var(--color-white);
    position: absolute;
    top: 30px;
    left: 50%;
}
div.is-list-inner:last-child p.is-time::after {
	content: "";
    width: 0;
    height: 0;
}

p.is-text {
	width: calc(100% - 100px);
	margin-left: 1em;
}


div.if-container {
	position: relative;
	border-bottom: 3px solid var(--color-white);
}
a.if-fullLink {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    text-indent: -9999px; /* リンクテキストを非表示にする */
}

div.if-text, div.if-container div.if-image-container {
	width: 50%;
}

div.if-text {
	padding: 50px 0;
	background-color: var(--color-blue);
	color: var(--color-white);
	transition: all 0.3s;
	position: relative;
	z-index: -1;
}

div.if-text-inner {
	display: inline-block;
	position: relative;
	left: 50%;
	transform: translateX(-50%);
}

p.if-kinds {
	display: inline-block;
	border-radius: 5px;
	border: 1px solid var(--color-white);
	padding: 2px 1em;
}

div.if-text h3 {
	font-size: 50px;
	line-height: 1.2;
}
div.if-text h3 span {
	color: var(--color-red);
}

div.if-text p.more-button a {
	font-size: 16px;
    margin-top: 20px;
    border: 1px solid var(--color-white);
    background: url(./img/common/arrow-right-white.svg) right 1em center no-repeat;
    background-size: 1em;
    color: var(--color-white);
	position: relative;
	overflow: hidden;
}
div.if-text p.more-button a::before {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	background: var(--color-white);
	transform-origin: 100% 50%;
	transform: scaleX(0);
	transition: transform ease .3s;
}
div.if-container:hover div.if-text p.more-button a {
	color: var(--color-blue);
	background: url(./img/common/arrow-right-blue.svg) right 1em center no-repeat;
    background-size: 1em;
}
div.if-container:hover div.if-text p.more-button a::before {
	transform-origin: 0% 50%;
	transform: scaleX(1);
}

div.if-container div.if-image-container {
	overflow: hidden;
}
div.if-container div.if-image {
	transition: transform .3s ease; /* ゆっくり変化させる */
	height: 100%;
}
div.if-container:hover div.if-image {
	transform: scale(1.1); /* 拡大 */
}

div.if-container div.if-image1 {
	background: url(./img/recruit/interview/interview1-next-image.jpg) center center no-repeat;
	background-size: cover;
}
div.if-container div.if-image2 {
	background: url(./img/recruit/interview/interview2-next-image.jpg) center center no-repeat;
	background-size: cover;
}
div.if-container div.if-image3 {
	background: url(./img/recruit/interview/interview3-next-image.jpg) center center no-repeat;
	background-size: cover;
}
div.if-container div.if-image img {
	display: none;
}


@media screen and (max-width: 1200px){

	div.interview-info {
		margin-bottom: 8%;
	}

	p.ii-kinds {
		font-size: min(20px, 2.2vw);
		padding: 1% 3%;
		border-radius: 5px;
	}
	p.ii-name {
		font-size: min(60px, 5vw);
        margin: 1% 0;
	}

	div.interview-info-copy p span {
		font-size: min(35px, 3.5vw);
	}

	div.interview-qa {
		display: block;
	}

	picture.interview-main-image, div.interview-qa {
		margin-bottom: 8%;
	}

	div.interview-qa-container, div.interview-qa-image {
		width: 100%;
	}

	div.interview-qa-container, div.interview-qa-image {
		width: 100%;
	}

	dl.interview-qa-inner {
		margin-bottom: 3%;
	}

	dl.interview-qa-inner dt {
		font-size: max(2.2vw, 22px);
	}
	dl.interview-qa-inner dd {
		font-size: max(2vw, 20px);
	}

	div.interview-qa-image {
		margin-top: 8%;
	}


	div.interview-schedule-bg {
		padding: 10% 5%;
	}

	p.is-time::after {
		height: 50px;
	}

	div.is-list {
        margin-top: 6%;
		font-size: max(1.8vw, 18px);
    }

	div.is-list-inner {
		margin-bottom: 6%;
	}
	div.is-list-container:last-child div.is-list-inner:last-child {
        margin-bottom: 0;
    }
	
	div.if-text p.more-button a {
		margin-top: 3%;
	}

}


@media screen and (max-width: 768px){

	div.interview-info-text {
		margin-bottom: 5%;
	}

	p.ii-kinds {
        font-size: max(2.5vw, 16px);
        padding: 0.5px 2%;
        margin-bottom: 1%;
	}
	p.ii-name {
		font-size: max(6vw, 40px);
	}

	div.interview-info-copy {
		margin: 4% 0;
	}

	div.interview-info-copy p {
		margin-bottom: 2%;
	}
	div.interview-info-copy p span {
		font-size: max(4vw, 20px);
		padding: 1% 2%;
	}

	dl.interview-qa-inner {
		margin-bottom: 8%;
	}

	dl.interview-qa-inner dt {
		font-size: max(3vw, 18px);
	}
	dl.interview-qa-inner dd {
		font-size: max(2.5vw, 16px);
	}


	section.interview-schedule1 {
		background: url(./img/recruit/interview/interview1-sub-image03-sp) center center no-repeat;
		background-size: cover;
	}
	section.interview-schedule2 {
		background: url(./img/recruit/interview/interview2-sub-image03-sp) center center no-repeat;
		background-size: cover;
	}
	section.interview-schedule3 {
		background: url(./img/recruit/interview/interview3-sub-image03-sp) center center no-repeat;
		background-size: cover;
	}

	.interview-schedule h3 {
        font-size: max(5vw, 32px);
    }

	div.is-list {
		font-size: 17px;
        width: 60%;
        margin: 6% auto 0;
    }

	div.is-list-container {
		width: 100%;
	}

	div.is-list-inner {
		display: flex;
		justify-content: space-between;
	}

	p.is-time {
        width: 15%;
        min-width: 60px;
    }
	p.is-time::after {
		top: 28px;
        height: 130%;
    }
	div.is-list-inner:last-child p.is-time::after {
		width: 2px;
		height: 40px;
	}
	div.is-list-container:last-child div.is-list-inner:last-child p.is-time::after {
		width: 0;
		height: 0;
	}

	p.is-text {
        width: 100%;
    }


	div.if-container {
		border-bottom: 2px solid var(--color-white);
	}

	div.if-text, div.if-container div.if-image-container {
		width: 100%;
	}

	div.if-text {
		padding: 8%;
	}

	div.if-text-inner {
		display: block;
		left: initial;
		transform: initial;
	}

	div.if-text h3 {
		font-size: max(6vw, 40px);
		line-height: 1.5;
	}
	
	div.if-text p.more-button a {
		font-size: max(2.5vw, 16px);
	}
	
	div.if-container div.if-image {
		background: none;
	}
	div.if-container div.if-image img {
		display: block;
	}

}


@media screen and (max-width: 521px){

div.is-list {
	width: 90%;
}

}


/*--------------
numbers(数字で見る)
--------------*/

div.numbers-sec-container {
    gap: 13px;
    margin-bottom: 20px;
}

picture.numbers-sec-inner:nth-child(2) {
	animation-delay: 0.1s;
}
picture.numbers-sec-inner:nth-child(3) {
	animation-delay: 0.2s;
}


@media screen and (max-width: 768px){

	div.numbers-sec-container {
		margin-bottom: 3%;
	}
	picture.numbers-sec-inner {
		margin-bottom: 3%;
	}

}


/*--------------
guideline(募集要項)
--------------*/

.gl-accordion-area li {
	margin-bottom: 30px;
}
.gl-accordion-area li:last-child {
	margin-bottom: 0;
}

.gl-accordion-area section {
	border: 1px solid var(--color-blue);
}

/*アコーディオンタイトル*/
.gl-title {
    position: relative;/*+マークの位置基準とするためrelative指定*/
    cursor: pointer;
    font-size: 28px;
	font-weight: var(--font-regular400);
	color: var(--color-white);
	background-color: var(--color-blue);
    padding: 20px 50px 20px 30px;
    transition: all .5s ease;
}

/*アイコンの＋と×*/
.gl-title::before,
.gl-title::after {
    position: absolute;
    content:'';
    width: 15px;
    height: 2px;
    background-color: var(--color-white);
    
}
.gl-title::before {
    top:48%;
    right: 35px;
    transform: rotate(0deg);
    
}
.gl-title::after {    
    top:48%;
    right: 35px;
    transform: rotate(90deg);

}
/*closeというクラスがついたら形状変化*/
.gl-title.close::before {
	transform: rotate(45deg);
}

.gl-title.close::after {
	transform: rotate(-45deg);
}

/*アコーディオンで現れるエリア*/
.gl-box {
    display: none;/*はじめは非表示*/
    padding: 20px 30px;
}

.gl-box dl {
	border-bottom: 1px solid var(--color-black);
	padding: 20px 0;
}
.gl-box dl:last-child {
	border-bottom: 0;
}

.gl-box dl dt::before {
	padding-bottom: 5px;
}
.gl-box dl dt::before {
	content: "■";
	padding-right: 0.2em;
}


@media screen and (max-width: 768px){

	.gl-title {
		font-size: max(2.5vw, 16px);
		padding: 3% 4% 3% 4%;
	}

	.gl-title::before, .gl-title::after {
		width: 3%;
	}
	.gl-title::before {
		right: 5%;
	}
	.gl-title::after {
		right: 5%;
	}

	.gl-accordion-area li {
		margin-bottom: 5%;
	}

	.gl-box {
		padding: 3% 4%;
	}
	.gl-box dl {
		padding: 5% 0;
	}

}


/*--------------
News(お知らせ)
--------------*/

/* archive(お知らせ一覧) */

dl.main-archive-list {
	border-bottom: 1px solid var(--color-black);
    padding-bottom: 30px;
    margin-bottom: 30px;
	font-size: 25px;
}

dl.main-archive-list dt, 
dl.main-archive-list dd {
	transition: all 0.3s;
}
dl.main-archive-list dt {
	color: var(--color-blue);
}
dl.main-archive-list dd {
	background: url(./img/common/arrow-right-black.svg) right center no-repeat;
	background-size: 1em;
}
dl.main-archive-list a:hover dt, 
dl.main-archive-list a:hover dd {
	opacity: 0.6;
}

div.newsarchive-next-button {
	justify-content: center;
	gap: 30px;
}
div.newsarchive-next-button p a {
	font-size: 25px;
	color: var(--color-blue);
	transition: all 0.3s;
}
div.newsarchive-next-button p a:hover {
	color: var(--color-green);
}

/* single(お知らせ記事) */

div.single-title {
    border-bottom: 2px solid var(--color-blue);
    padding-bottom: 20px;
}
div.single-title span.date {
    font-size: 25px;
    color: var(--color-blue);
	font-weight: var(--font-bold700);
}
div.single-title h3 {
    font-size: 40px;
    color: var(--color-black);
}

div.single-text {
	margin: 30px 0 60px;
}
div.single-text p {
	margin: 20px 0;
}
div.single-text a {
	color: var(--color-green);
}

p.postnav {
    margin-bottom: 45px;
}
p.postnav a {
    color: var(--color-blue);
	transition: all 0.3s;
}
p.postnav a:hover {
    color: var(--color-green);
}

.newssingle-sec-inner p.more-button a {
	margin: 0 auto;
}


@media screen and (max-width: 768px){

	/* archive(お知らせ一覧) */

	dl.main-archive-list {
		padding-bottom: 5%;
		margin-bottom: 5%;
		font-size: max(4vw, 16px);
	}

	div.newsarchive-next-button {
		display: flex;
		gap: 2%;
	}

	div.newsarchive-next-button p a {
		font-size: max(4vw, 16px);
	}


	/* single(お知らせ記事) */

	div.single-title {
		padding-bottom: 4%;
	}

	div.single-title span.date {
		font-size: max(4vw, 16px);
	}

	div.single-title h3 {
		font-size: max(5.5vw, 20px);
	}

	div.single-text {
		margin: 6% 0 8%;
	}

	div.single-text p {
		margin: 2% 0;
	}

	p.postnav {
		margin-bottom: 8%;
		display: flex;
	}

}


/*--------------
404
--------------*/

div.text404 p.more-button a {
    margin-top: 30px;
}


@media screen and (max-width: 768px){

	div.text404 p.more-button a {
		margin-top: 3%;
        min-width: 200px;
	}

}


/*--------------
contactForm(コンタクトフォーム)
--------------*/


div.contactForm-table dl {
    display: flex;
    justify-content: space-between;
    margin-bottom: 5%;
}

div.contactForm-table dl dt {
    width: 250px;
    color: var(--color-blue);
    font-size: min(22px, 1.7vw);
    font-weight: var(--font-bold700);
}
div.contactForm-table dl dt span {
    font-size: 18px;
    color: var(--color-red);
    margin-left: 3%;
    border-radius: 5px;
    border: 2px solid var(--color-red);
    padding: 1% 0.5em 2%;
}

div.contactForm-table dl dd {
	width: calc(100% - 300px);
}

div.contactForm-table dl dd.message-check label {
	display: flex;
    align-items: center;
	gap: 10px;
	margin-bottom: 1%;
}
div.contactForm-table dl dd.message-check label input {
	width: 15px;
}

div.contactForm-table dl dd span {
    display: block;
}
div.contactForm-table dl dd span input {
    width: 100%;
    padding: 2%;
    border: 2px solid var(--color-blue);
    border-radius: 5px;
    font-family: var(--font-notoSans);
    font-size: 20px;
    color: var(--color-black);
}

div.contactForm-table dl dd textarea {
    width: 100%;
    height: 20vw;
    border-radius: 5px;
    border: 2px solid var(--color-blue);
    padding: 2%;
    font-family: var(--font-notoSans);
    font-size: 20px;
}

p.contactForm-check {
    text-align: center;
    font-weight: var(--font-bold700);
    font-size: 18px;
}
span.wpcf7-list-item {
	margin: 0;
	padding-right: 0.5%;
}

p.contactForm-submit {
    text-align: center;
}
p.contactForm-submit input {
    margin-top: 2%;
    padding: 1.5% 20%;
    font-family: var(--font-notoSans);
    font-size: 26px;
    font-weight: var(--font-bold700);
    background-color: var(--color-blue);
    color: var(--color-white);
	border: none;
    border-radius: 9999px;
}

span.wpcf7-spinner {
	display: none;
}


@media screen and (max-width: 1200px){

	div.contactForm-table dl {
		display: block;
		margin-bottom: 6%;
	}

	div.contactForm-table dl dt, div.contactForm-table dl dd {
		width: 100%;
	}

	div.contactForm-table dl dt {
		font-size: 22px;
	}
	div.contactForm-table dl dt span {
        margin-left: 2%;
        padding: 0.5% 0.5em 0.7%;
    }
	
	div.contactForm-table dl dd {
		margin-top: 2%;
	}

	div.contactForm-table dl dd textarea {
		height: 30vw;
	}

	p.contactForm-submit input {
        padding: 3% 30%;
    }

}


@media screen and (max-width: 768px){

	div.contactForm-table dl {
        margin-bottom: 8%;
    }

	div.contactForm-table dl dt {
        font-size: max(3vw, 18px);
    }
	div.contactForm-table dl dd span input, 
	div.contactForm-table dl dd textarea {
        font-size: max(2.5vw, 16px);
    }

	div.contactForm-table dl dt span {
		font-size: max(2vw, 12px);
	}

	p.contactForm-check {
		font-size: max(2.5vw, 16px);
	}

	p.contactForm-submit input {
		font-size: max(2.5vw, 16px);
		border: 2px solid var(--color-blue);
	}

}


/*--------------
thanks(送信完了ページ)
--------------*/

section.thanks-sec p.main-text {
	font-size: 40px;
    font-weight: var(--font-bold700);
    color: var(--color-blue);
	margin-bottom: 2%;
}

section.thanks-sec p.note-text {
	color: var(--color-red);
	margin-top: 1%;
}


@media screen and (max-width: 768px){

	section.thanks-sec p.main-text {
        font-size: max(5.5vw, 20px);
        margin-bottom: 4%;
    }

	section.thanks-sec p.note-text {
		margin-top: 4%;
	}

}



/*--------------
footer
--------------*/

div.footer-main {
	position: relative;
}

/* contactSec(お問い合わせ) */

section.contactSec {
    padding: 100px 12vw;
    background-color: var(--color-green);
    color: var(--color-white);
}

div.contactSec-container {
    margin-top: 30px;
	gap: 30px;
}

section.contactSec-inner {
    width: 50%;
    border: 1px solid var(--color-white);
    padding: 30px;
}

section.contactSec-inner h3 {
    font-size: 30px;
	align-items: center; /* 横線を上下中央 */
	display: flex; /* 文字と横線を横並び */
}
section.contactSec-inner h3::after {
	background-color: var(--color-white); /* 横線の色 */
	content: "";
	flex-grow: 1; /* 横幅いっぱい */
	height: 2px; /* 横線の高さ */
	margin-left: 15px; /* 文字との余白 */
}

section.contactSec p.subtitle {
    display: inline-block;
    position: relative;
    left: -12vw;
    padding: 0 1.5em 0 12vw;
}

div.contactSec-text-box {
	margin: 5px 0 15px;
}
p.contactSec-text {
	font-size: 18px;
}

div.contactSec-tel p {
	font-size: 40px;
	font-weight: var(--font-bold700);
	line-height: 1.2;
	margin-bottom: 1%;
}
div.contactSec-tel p a {
	color: var(--color-white);
}
div.contactSec-tel p:first-child a:hover {
	opacity: 0.5;
}

div.contactSec-mail a {
    background-color: var(--color-white);
    border-radius: 9999px;
    font-size: 22px;
    color: var(--color-green);
    text-align: center;
    font-weight: var(--font-bold700);
    padding: 15px 0;
}
div.contactSec-mail a::after {
	content: "→";
	padding-left: 0.5em;
}
div.contactSec-mail a:hover {
	border: 1px solid var(--color-white);
	background-color: var(--color-green);
	color: var(--color-white);
}

/* footer-container */

div.footer-container {
	padding: 100px 12vw 50px;
}

div.footer-logo {
	width: 250px;
	margin-bottom: 15px;
}
div.footer-logo a:hover {
	opacity: 0.5;
}
div.footer-address {
	font-size: 18px;
}

.footer-mark {
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	width: 250px;
	margin-top: 50px;
}
.footer-mark01 {
	width: 180px;
}
.footer-mark02 {
	width: 250px;
}

div.footer-menu, div.footer-menu-inner {
	gap: 60px;
}
div.footer-menu-item {
	margin-bottom: 20px;
}
p.footer-menu-text {
	color: var(--color-blue);
	font-size: 30px;
	font-weight: var(--font-bold700);
}
ul.footer-menu-links li a {
	font-size: 18px;
	padding-bottom: 2%;
}
ul.footer-menu-links li a:hover {
	color: var(--color-green);
}


p.copyright {
	font-size: 14px;
	text-align: center;
	margin-top: 100px;
}


div.footer-deco {
	width: 70%;
	position: absolute;
	right: 0;
	bottom: 0;
	z-index: -1;
	opacity: 0.5;
}


@media screen and (max-width: 1200px){

	/* contactSec(お問い合わせ) */

	section.contactSec {
		padding: 8% 5%;
	}

	.contactSec div.contactSec-container {
		margin-top: 6%;
		display: flex;
		gap: 20px;
	}

	section.contactSec-inner {
        width: 100%;
        padding: 3% 4%;
    }
	section.contactSec-inner:last-child {
		margin-bottom: 0;
	}

	section.contactSec-inner h3 {
		font-size: max(2vw, 20px);
	}
	section.contactSec-inner h3::after {
		height: 1px;
		margin-left: 3%;
	}

	div.contactSec-text-box {
		margin: 1% 0 4%;
	}
	p.contactSec-text {
		font-size: 18px;
	}

	div.contactSec-tel p {
		font-size: max(3.5vw, 30px);
	}

	div.contactSec-mail a {
		font-size: max(2vw, 16px);
		margin-top: 2%;
		padding: 2% 0;
	}

	/* footer-container */

	div.footer-container {
		padding: 8% 5% 4%;
	}

	div.footer-inner {
		display: block;
	}

	div.footer-text {
		margin-bottom: 4%;
	}
	div.footer-logo {
		width: 30%;
		margin-bottom: 3%;
	}
	div.footer-address {
		font-size: max(2vw, 20px);
	}

	div.footer-mark {
        width: 100%;
        gap: 6vw;
        margin: 8% 0 14%;
    }
	.footer-mark01 {
		width: 30%;
	}
	.footer-mark02 {
		width: 40%;
	}

	div.footer-menu, div.footer-menu-inner {
		justify-content: flex-start;
		gap: 11vw;
	}
	div.footer-menu-item {
		margin-bottom: 14%;
	}

	p.footer-menu-text {
		font-size: max(3.5vw, 38px);
	}

	ul.footer-menu-links li a {
		font-size: max(2vw, 20px);
		padding-bottom: 5%;
	}
	

	p.copyright {
		margin-top: 4%;
		font-size: max(1.5vw, 16px);
	}

}


@media screen and (max-width: 768px){

	section.contactSec {
		padding: 10% 5%;
	}

	.contactSec div.contactSec-container {
		margin-top: 8%;
		display: block;
	}

	section.contactSec-inner {
        padding: 4% 5%;
        margin-bottom: 6%;
    }

	section.contactSec-inner h3 {
		font-size: max(3vw, 18px);
	}
	
	p.contactSec-text {
		font-size: max(2.5vw, 15px);
	}

	div.contactSec-tel p {
		font-size: max(4.5vw, 26px);
	}

	div.contactSec-mail a {
		font-size: max(2.5vw, 16px);
	}

	/* footer-container */

	div.footer-logo {
		width: 50%;
		max-width: 250px;
	}

	div.footer-address {
		font-size: max(2.5vw, 16px);
	}

	div.footer-menu {
        display: flex;
		gap: 15vw;
    }

	.footer-mark01 {
		width: 50%;
        max-width: 200px;
	}
	.footer-mark02 {
		width: 60%;
        max-width: 300px;
	}

	p.footer-menu-text {
        font-size: max(4.5vw, 24px);
		line-height: 2;
	}

	ul.footer-menu-links li a {
		font-size: max(2.5vw, 16px);
	}
	

	p.copyright {
		margin-top: 8%;
		font-size: max(2vw, 12px);
	}

}