/* CSS Document */

@charset "UTF-8";

/*@font-face {
  font-family: 'Jaapokki';
  src: url("/assets/new/fonts/jaapokki-regular-webfont.eot");
  src: url("/assets/new/fonts/jaapokki-regular-webfont.eot?#iefix") format("embedded-opentype"), url("/assets/new/fonts/jaapokki-regular-webfont.woff2") format("woff2"), url("/assets/new/fonts/jaapokki-regular-webfont.woff") format("woff"), url("/assets/new/fonts/jaapokki-regular-webfont.ttf") format("truetype"), url("/assets/new/fonts/jaapokki-regular-webfont.svg#jaapokkiregular") format("svg");
  font-weight: normal;
  font-style: normal;
}*/

/* 必ずファイルの先頭（1行目）に記述してください */
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;700&family=Noto+Sans+JP:wght@400;500;700&family=Rethink+Sans:ital,wght@0,400..800;1,400..800&family=Shippori+Mincho+B1:wght@400;700&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho+B1&display=swap');

/*h2, h3, .serif {*/
.serif {
    font-family: "Shippori Mincho B1", serif;
}

.menu::after, .morelink span {
    font-family: "Cinzel", serif;
}

.jpn {
	line-height: 2.0;
}

.eng {
	font-size: 0.9em !important;
	line-height: 1.6;
}

.sponlysmall {
	font-size: 100%;
}
@media only screen and (max-width: 769px) {
	.sponlysmall {
		font-size: 90%;
	}
}

/* Safariや古いchrome */
summary::-webkit-details-marker {
 display:none;
}

body {
	/*border: 10px solid #000;*/
	margin: 0px;
	padding: 0px;
	/*overflow-y:hidden;*/
    background-color: #FFF;
    /*font-family: "游ゴシック体", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;*/
	/*font-family: "Rethink Sans", "Noto Sans JP", sans-serif;*/
	font-family: "Noto Sans JP", sans-serif;
    /*font-weight: 500;*/
	min-width: 900px;
    max-width: none;
 	/*background: url("../img/common/bg.svg") no-repeat left top;*/
	background-image: url('../img/common/bg.svg');
    background-size: cover; /* 画像を全体にフィットcovercontain */
    background-position: center center; /* 中央に配置 */
    background-repeat: no-repeat; /* 繰り返しを防止 */
	text-size-adjust: none;
	-webkit-text-size-adjust: none;
}
@media only screen and (max-width: 769px) {
body {
	background-size: 140%; /* 画像を全体にフィットcovercontain */
    background-position: top center; /* 中央に配置 */
	max-width: 100vw;
	min-width: 100vw;
	background-image: url('../img/common/bg_sp.jpg');
}
}
/*@media only screen and (orientation: landscape) {*/
@media (orientation: landscape) and (max-width: 900px){
body {
	max-width: 100vw;
	min-width: 100vw;
}
}

.flex {
	display: block;
}
@media only screen and (min-width: 769px) {
.flex {
	display: -webkit-flex;
	display: flex;
}
}

.flex2 {
	display: block;
}
@media only screen and (min-width: 769px) {
.flex2 {
	/*width: 48%;*/
	display: -webkit-flex;
	display: flex;
}
}

.sans-serif {
    font-family: "游ゴシック体", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
}
.serif {
    font-family: "遊明朝体", YuMincho, 'Yu Mincho', 'Hiragino Mincho ProN', 'serif';
}

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

.pcinline { display: inline; }
@media only screen and (max-width: 767px) {
.pcinline { display: none; }
}
.spinline { display: none; }
@media only screen and (max-width: 767px) {
.spinline { display: inline; }
}


@media print {
.noprint { display: none !important; }
}

tbody {
    -webkit-text-size-adjust: 100%;
}

a:link { color:#000; text-decoration: none; }
a:visited { color:#000; text-decoration: none; }
a:hover { color:#000; text-decoration: none; }
a:active { color:#000; text-decoration: none; }
a:focus { outline:none;}

.hidden {
	display: none;
}

.icons {
	width: 1em;
	height: auto;
}

/*.morelink {
	margin: 3em auto;
	z-index: 1;
	max-width: 240px;
	width: 20vw;
	height: calc(20vw * 0.242);
	background-image:url("../img/common/icon_readmore.svg");
	background-repeat: no-repeat;
    background-size: 100%;
    overflow: hidden;
	clear: both;
}
@media only screen and (max-width: 769px) {
.morelink {
	width: 50vw;
	height: calc(50vw * 0.242);
}
}
.morelink span {
	width: 20vw;
	height: 8vw;
	display: block;
	text-indent: -10000px;
}*/

.toplink {
	display:block;
	margin: 3em auto;
	z-index: 1;
	width: 20vw; /*calc*/
	height: calc(20vw * 0.242);
	background-image:url("../img/common/icon_top.svg");
	background-repeat: no-repeat;
    background-size: 100%;
    overflow: hidden;
	clear: both;
}
@media only screen and (max-width: 769px) {
.toplink {
	width: 50vw; /*calc*/
	height: calc(50vw * 0.242);
}
}
.toplink span {
	width: 20vw; /*calc*/
	height: 8vw; /*calc*/
	display: block;
	text-indent: -10000px;
}




.middle {
	/*position: relative;
	z-index: 3;*/
	background-color: #EDF5F7;
  	padding-top: 3em;
  	padding-bottom: 3em;
}

.middle ul {
	width: 100%;
	margin: 0;
	padding: 0;
	display: -webkit-flex;
	display: flex;
	flex-wrap: wrap;
	list-style: none;
	justify-content: center;
	align-items:center;
}
.middle ul li {
	position: relative;
	width: 30%;
    margin: 20px 5%;
	/*padding: 0;*/
	border-bottom: 2px solid #000;
	background-image: url('../img/common/icon_arrow.svg');
    background-position: right center; /* 中央に配置 */
    background-repeat: no-repeat; /* 繰り返しを防止 */
	background-size: 0.9em;
}
@media only screen and (max-width: 769px) {
.middle ul li {
	width: 100%;
}
}


.middle ul li a {
    color: #000; /*#808080*/
	font-weight: bold;
    font-size: 1.8em;
    /*font-weight: bold;*/
    /*padding: 40px;*/
    text-decoration: none;
    transition: .5s;
}
@media only screen and (max-width: 769px) {
.middle ul li a {
    font-size: 1.4em;
}
}

.middle ul li a:hover{
    color: #000;
}




/* ボタン */
.recruit-btn {
  position: fixed !important; /* absolute から fixed に変更 */
  top: 20px;
  right: 100px; /* MENUの左に配置 */
  z-index: 999999;
  display: block;
}

/* SVGサイズ */
.recruit-btn img {
  display: block;
  width: 200px;   /* デザインに合わせて調整 */
  height: auto;
}

@media only screen and (max-width: 769px) {
.recruit-btn {
  top: 2.8vw; /* スマホ時の位置微調整14px */
  right: 16vw; /* MENUの左に配置 80px*/
}
.recruit-btn img {
  width: 30vw;   /* デザインに合わせて調整 */
  height: auto;
}

}


/* =========================
   Read more 共通化
========================= */
.morelink {
	width: 260px;  /* ←ここを拡大 */
	max-width: 100%;
	margin-top: 2vw;
	margin: auto !important;
}

.morelink a {
	display: block;
	width: 100%;
	height: 64px;  /* ←高さも連動 */
	background: url("../img/common/icon_readmore.svg") no-repeat center / contain;
}

.morelink span {
	display: block;
	height: 0;
	overflow: hidden;
	text-indent: -9999px;
	white-space: nowrap;
}

@media only screen and (max-width: 769px) {
	.morelink {
		width: 260px;
		margin-top: 4vw;
	}

	.morelink a {
		height: 50px;
	}
}


/* =========================
   FOOTER
========================= */

.footer {
	background: #e9eaec;
	text-align: center;
	padding: 6vw 4vw 4vw;
}

/* -------------------------
   CTAボタン（上）
------------------------- */

.footer__cta {
	margin-bottom: 4vw;
}

.footer__cta img {
	width: 620px;
	max-width: 90%;
	display: block;
	margin: 0 auto;
}

/* -------------------------
   CONTACT（SVG）
------------------------- */

.footer__contact-title {
	margin: 0 0 2vw 0;
	width: 280px;
	max-width: 80%;
	margin-left: auto;
	margin-right: auto;

	background: url("../img/top/h2_contact.svg") no-repeat center / contain;
	aspect-ratio: 280 / 80;
}

.footer__contact-title span {
	display: block;
	height: 0;
	overflow: hidden;
	text-indent: -9999px;
}

/* -------------------------
   問い合わせテキスト
------------------------- */

.footer__contact {
    display: flex;
    justify-content: center; /* 全体を中央に寄せる */
    margin: 0 auto 2.5vw;
}

.footer__contact-grid {
    display: grid;
    /* 3列の幅を自動調整（左・中・右） */
    grid-template-columns: auto auto auto; 
    /* 列同士の隙間（好みに合わせて調整してください） */
    column-gap: 30px; 
    /* 行同士の隙間 */
    row-gap: 8px;
    text-align: left; /* 中身の文字は左揃え */
    font-size: 14px;
    color: #333;
}

/* スマホ表示での崩れ防止 */
@media (max-width: 769px) {
    .footer__contact-grid {
        display: block; /* スマホでは縦並びに戻す */
        text-align: center;
    }
    .footer__contact-grid span {
        display: block;
        margin-bottom: 5px;
    }
    .footer__contact-grid span.c-email {
        margin-bottom: 20px; /* 1ブロックごとの区切り */
    }
}

/* -------------------------
   区切り線
------------------------- */

.footer__copy {
	margin-top: 2.5vw;
	padding-top: 2vw;
	border-top: 1px solid #bfc3c7;

	font-size: 1.0em;
	color: #666;
}


@media (max-width: 769px) {

	.footer {
		padding: 10vw 4vw 6vw;
	}

	.footer__cta img {
		width: 100%;
	}

	.footer__contact-title {
		margin-top: 3em;
		width: 60vw;
	}

	.footer__contact {
		font-size: 1.0em;
		line-height: 1.2;
	}

	.footer__copy {
		font-size: 11px;
	}
}