@charset "utf-8";

/*===========================================================
カバー
===========================================================*/

.cover {
	max-width: 1920px;
	width: 100%;
	margin: 0 auto;
	aspect-ratio: 800 / 900;
	position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    isolation: isolate;
    transform: translateZ(0);
}

.cover-area {
    width: 100%;
}

.cover .carousel-item {
    position: relative;
    z-index: 1;
    height: 0;
    padding-top: 112.5%;
}

.cover .carousel-item img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
}

.cover .carousel-item::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, .1);
    mix-blend-mode: overlay;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 2;
    margin: auto;
}

.cover-text-container {
	margin: auto;
	padding: 0 15px;
	max-width: 1870px;
	width: 100%;
	position: absolute;
	right: 0;
	left: 0;
	bottom: 20px;
    z-index: 3;
}

.cover-text-area01 {
	text-align: center;
}

.cover-text01 {
	font-size: clamp(34px, calc(2.125rem + ((1vw - 3.75px) * 2.3301)), 70px);
	font-weight: 700;
	letter-spacing: 0;
	line-height: 1.67692em;
	color: var(--white);
	text-shadow: 0 0 26px rgba(0, 0, 0), 0 0 26px rgba(0, 0, 0);
}

.cover-text02 {
	font-size: clamp(15px, calc(0.9375rem + ((1vw - 3.75px) * 0.9709)), 30px);
	font-weight: 700;
	letter-spacing: 0;
	line-height: 1.8em;
	color: var(--white);
	text-shadow: 0 0 26px rgba(0, 0, 0), 0 0 26px rgba(0, 0, 0);
}

.cover-text-area02 {
    margin: 20px 0 0;
    width: 100%;
    display: flex;
    justify-content: center;
}

.cover-radius-area {
    max-width: 670px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
}

.cover-radius-item {
    padding: 8px;
    max-width: 110px;
    width: 100%;
    height: 110px;
    background: var(--white);
    border-radius: 50%;
    background-color: rgba(255, 255, 255, .9);
}

.cover-radius-box {
    width: 100%;
    height: 100%;
    border: 2px solid var(--primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
	text-align: center;
}

.cover-radius-text01 {
    font-size: clamp(12px, calc(0.75rem + ((1vw - 3.75px) * 0.7767)), 24px);
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.3333em;
}

/*===========================================================
TOP02
===========================================================*/

.top02-area {
    gap: 30px 5%;
}

/*===========================================================
TOP03
===========================================================*/

.top03-left {
	display: contents;
}

.top03-title-box {
	order: 1;
}

.top03-loop-area {
	order: 2;
}

.top03-btn-area {
	order: 3;
}

/*===========================================================
TOP04
===========================================================*/

.top04::before {
    content: "";
    display: block;
    width: 60%;
    height: 39%;
    background-color: var(--bg-secondary);
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}

/*===========================================================
TOP05
===========================================================*/

.top05-area {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
}

.top06-logo-area {
    gap: 20px 40px;
}

.top06-address-row {
    padding: 20px 0 18px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--tertiary);
}

.top06-address-row:first-child {
    padding: 0 0 18px;
}

.top06-address-th {
    width: 22%;
    padding: 0 5px 0 0;
}

.top06-address-td {
    width: 78%;
}

.top06-text-flex {
    display: flex;
}

/*===========================================================
お知らせ
===========================================================*/

.top-news-area section {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
}

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width:414px) {


/*===========================================================

===========================================================*/

.top04::before {
    height: 43%;
}

} /* min-width: 414px ここまで */


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width:544px) {


/*===========================================================
カバー
===========================================================*/

.cover-radius-area {
    gap: 10px;
}

/*===========================================================
TOP01
===========================================================*/

.top01-text-box01 {
    text-align: center;
}

/*===========================================================
TOP04
===========================================================*/

.top04-text-box01 {
    text-align: center;
}

} /* min-width: 544px ここまで */


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width: 768px) {


/*===========================================================
カバー
===========================================================*/

.cover {
	aspect-ratio: 1920 / 840;
}

.cover .carousel-item {
    padding-top: 43.75%;
}

.cover-text-container {
    bottom: 40px;
}

.cover-text01 {
	font-size: clamp(30px, calc(1.875rem + ((1vw - 7.68px) * 3.0382)), 65px);
}

.cover-text02 {
	font-size: clamp(18px, calc(1.125rem + ((1vw - 7.68px) * 1.4757)), 35px);
}

.cover-text-area02 {
    justify-content: flex-end;
}

.cover-radius-area {
    gap: 20px;
}

.cover-radius-item {
    max-width: 150px;
    height: 150px;
}

/*===========================================================
TOP01
===========================================================*/

.top01-text-box01 {
    text-align: left;
}

/*===========================================================
TOP04
===========================================================*/

.top04-text-box01 {
    text-align: left;
}

.top01-text-box01 p br {
    display: block;
}

/*===========================================================
TOP04
===========================================================*/

.top04::before {
    width: 60%;
    height: 54%;
}

/*===========================================================
TOP05
===========================================================*/

.top05-area {
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}

/*===========================================================
TOP06
===========================================================*/

.top06-address-th {
    width: 17%;
}

.top06-address-td {
    width: 83%;
}

/*===========================================================
お知らせ
===========================================================*/

.top-news-area section {
    grid-template-columns: repeat(4, 1fr);
}

} /* min-width: 768px ここまで */


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width: 1024px) {

/*===========================================================
TOP03
===========================================================*/

.top03-left {
	display: block;
}

.top03-title-box,
.top03-loop-area,
.top03-btn-area {
	order: unset;
}

/*===========================================================
TOP04
===========================================================*/

.top04::before {
    width: 38.8%;
    height: auto;
	aspect-ratio: 745 / 915;
}

/*===========================================================
TOP05
===========================================================*/

.top05-area {
    gap: 25px;
}

/*===========================================================
お知らせ
===========================================================*/

.top-news-area section {
    gap: 25px;
}

} /* min-width: 1024px ここまで */


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width:1200px) {


/*===========================================================
カバー
===========================================================*/

.cover-text-area02 {
	margin: 80px 0 0;
}

.cover-radius-item {
    max-width: 210px;
    height: 210px;
}

/*===========================================================
TOP01
===========================================================*/

.top01-text-box01 p br {
    display: block;
}

/*===========================================================
TOP04
===========================================================*/

.top04 {
    padding: 90px 0 0 0 !important;
}

/*===========================================================
TOP06
===========================================================*/

.top06-address-th {
    width: 16%;
}

.top06-address-td {
    width: 84%;
}

} /* min-width: 1200px ここまで */


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width:1300px) {

/*===========================================================
TOP02
===========================================================*/

.top02-area {
    gap: 30px 7.4%;
}

} /* min-width: 1300px ここまで */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width:1600px) {

/*===========================================================
TOP04
===========================================================*/

.top04 {
    padding: 90px 0 125px 0 !important;
}

} /* min-width: 1600px ここまで */


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width:1730px) {


.top05-illust-box01 {
	top: 10px !important;
}

} /* min-width: 1730px ここまで */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */