@charset "utf-8";
/* ===================================================
	Base CSS
====================================================== */
body {
	min-width: 1200px; min-height: 100vh; background: #fff; color: #1a1a1a;
	font-size: 16px; font-weight: normal; line-height: 2.2; letter-spacing: 0.08em;
	font-family: "Yu Mincho", YuMincho, "Hiragino Mincho ProN", serif;
	-webkit-text-size-adjust: 100%; position: relative;
}

input,
select,
textarea { font-size: 16px;}

div { box-sizing: border-box;}

a { color: #1a1a1a; text-decoration: none;}
a img { transition: opacity .3s;}

.fixed { width: 100%; min-width: 1200px; position: fixed; top:0; left: 0; z-index: 999;}
iframe[name="google_conversion_frame"] { position: absolute; bottom: 0; left: 0;}

body.pos_fix { overflow: hidden;}

.ofi { object-fit: cover; width: 100%; height: 100%;}
.sp { display: none;}

@media screen and (hover: hover) {
	a:hover { color: #1a1a1a;}
	a:hover img { opacity: 0.7; }
}

@media screen and (max-width: 600px) {
	body { min-width: 0; line-height: 1.8;}
	.sp { display: inline-block;}
	.pc { display: none !important;}
	.fixed { min-width: 0; }
}


/* ---------------------------------------------------
	Base Layout
------------------------------------------------------ */
/* コンテンツ幅 */
.inner_lg { width: 1400px; max-width: 96%; margin: 0 auto;}
.inner_md { width: 1200px; max-width: 94%; margin: 0 auto;}
.inner_sm { width: 1110px; max-width: 92%; margin: 0 auto;}

@media screen and (max-width: 600px) {
	.inner_lg { max-width: 92%;}
	.inner_md { max-width: 92%;}
}


/* ---------------------------------------------------
	Header
------------------------------------------------------ */
/* animation */
@keyframes h-fixed {
	0% { transform: translateY(-100%); }
	100% { transform: translateY(0); }
}

@keyframes h-top {
	0% { transform: translateY(0); position: fixed; background: rgba(255 255 255/80%);}
	100% { transform: translateY(-200%); position: absolute; }
}
/* animation End */

#header_wrap { position: relative; }
header {
	z-index: 10; display: flex; align-items: center; width: 100%; min-width: 1200px; box-sizing: border-box;
	padding: 10px 35px; background: linear-gradient(0deg, transparent 5% 0, rgba(26 26 26 /55%) 100% 0); position: absolute; color: #fff; }
header a { color: #fff; }
header .logo { position: relative; }
header .logo a { display: flex; align-items: center; transition: opacity .5s; }
header .logo a:hover { opacity: .6; }
header .logo a > span { margin-left: 20px; font-size: 11px; }
header .logo a > span span:nth-of-type(2) { font-size: 17px; line-height: 1; }
header .logo .black { opacity: 0; position: absolute; }
header .logo img { transition: opacity .5s; }
header #h_nav { display: flex; align-items: center; margin-left: auto; }
header #h_nav a { text-decoration: none; position: relative; margin: 0 7px; padding: 0 5px 10px; font-size: 18px; letter-spacing: 0.08em; }
header #h_nav a::after { content: ''; display: block; width: 100%; height: 1px; background: #fff; position: absolute; bottom: 0; left: 0; transform: scaleX(0); transition: transform .5s; }
header .tel-link { display: flex; align-items: center; padding: 0; font-size: 25px; padding: 5px 0 5px 24px; border-left: 1px solid #fff; line-height: 1; }
header .reserve { display: block; margin-left: 20px; padding: 0px 40px; background: #c42c2f; border-radius: 5px; font-size: 18px; transition: background .5s; text-decoration: none; color: #fff!important; letter-spacing: 0.1em; }
header .open_menu { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 50px; padding: 15px; box-sizing: border-box; transition: background-color .5s; background: #000; }
header .open_menu>span { position: relative; line-height: 1; font-size: 0;}
header .open_menu::before,
header .open_menu>span::before,
header .open_menu>span::after { content: ''; display: block; width: 20px; height: 1px; margin-bottom: 4px; background: #fff; transition: transform .5s, opacity .5s, background-color .3s; }
header .open_menu>span::after { margin-bottom: 0;}
header .open_menu { display: none;}

.lang { position: absolute; bottom: -86px; right: 50px; display: flex; align-items: center; opacity: 1; pointer-events: auto; transform: translateY(100%); z-index: 5; }
.lang li { display: flex; align-items: stretch; opacity: .5; }
.lang,
.lang a { color: #fff; font-size: 18px; line-height: 1.8; }
.lang li:has(a) { opacity: 1;}
.lang a { transition: opacity .5s, color .5s; }
.lang li + li::before { content: ''; display: block; width: 1px; background: #fff; margin: 0 15px; }

header.top { animation: h-top 1.2s; transition: color 1.2s; }
header.top a { transition: color 1.2s, opacity .5s; }
header.top .logo .white { transition: opacity 1.2s; }
header.top .logo .black { transition: opacity 1.2s; }
header.top .tel-link { transition: border-left-color 1.2s; }
header.top #h_nav a:not([class])::after { transition: background 1.2s, transform .5s; }
header.top .lang {  transition: opacity 0s 1.2s; }

header.fixed  { background: rgba(255 255 255/80%); animation: h-fixed 1s; color: #1a1a1a; }
header.fixed a { color: #1a1a1a; }
header.fixed .tel-link { border-left-color: #000; }
header.fixed #h_nav a:not([class])::after { background: #222; }
header.fixed .logo .black { opacity: 1;}
header.fixed .logo img { opacity: 0;}
header.fixed .lang { opacity: 0; pointer-events: none; }

.pos_fix header .logo .black { opacity: 1;}
.pos_fix header .logo img { opacity: 0;}
.pos_fix header .logo a { color: #1a1a1a;}
.pos_fix header { background: #fff;}
.pos_fix header .tel-link{ color: #1a1a1a; }
.pos_fix header .tel-link::before { opacity: 0; }
.pos_fix header .tel-link::after { opacity: 1; }
.pos_fix header .tel-link::before,
.pos_fix header .tel-link::after { transition: opacity .6s; }
.pos_fix header .open_menu { background: #1a1a1a!important; }
.pos_fix header .open_menu>span { font-size: 14px; }
.pos_fix header .open_menu>span::before { opacity: 0; }
.pos_fix header .open_menu::before { transform: rotate(45deg) translate(2px, 2px); }
.pos_fix header .open_menu>span::after { transform: rotate(-45deg) translate(5px, -5px); }
.pos_fix .lang { opacity: 0; pointer-events: none; }

@media screen and (hover: hover) {
	header #h_nav a:hover::after { transform: scaleX(1); }
	header .reserve:hover { background: #a11e20; }
	header a:hover { color: #fff; }
	header.fixed a:hover { color: #1a1a1a; }
	.lang li a:hover { text-decoration: none; opacity: 1!important; }
}

@media screen and (max-width: 1320px) {
	header .logo a > span { margin-left: 10px;}
	header #h_nav a { padding: 0 5px 10px; margin: 0 5px; font-size: 16px; }
	header .tel-link { padding: 5px 0 5px 15px;}
	header .reserve { margin-left: 10px;}
}

@media screen and (max-width: 600px) {
	header { min-width: 0; padding: 0; transition: background .6s; }
	header .logo { padding: 5px 0 5px 5px; margin: 0 auto 0 0; }
	header .logo img { width: min(135px, 35vw); }
	header .logo a { transition: color .6s; }
	header .logo a > span { font-size: 10px; line-height: 1.8; }
	header .logo a > span span:nth-of-type(2) { font-size: 12px; }
	header.top .logo .white { transition: opacity .6s; }
	header #h_nav { pointer-events: none; opacity: 0;}
	header .tel-link { flex-direction: column; margin-left: auto; padding: 0 15px; font-size: 11px; line-height: 1; text-decoration: none; border-left: none; transition: color .6s; position: relative; }
	header .tel-link::before,
	header .tel-link::after { content: ''; background: url(../img/common/icon_tel_w.svg) no-repeat; margin: 0 0 3px; border: 0; width: 15px; height: 20px; background-size: contain; transition: opacity .6s; }
	header .tel-link::after { background: url(../img/common/icon_tel_b.svg) no-repeat; background-size: contain; opacity: 0; position: absolute; top: 0; left: calc(50% - 7.5px);}
	header .reserve { display: flex; align-items: center; justify-content: center; height: 50px; margin-left: 0; border-top: 0; border-bottom: 0; padding: 0 20px; font-size: 14px; flex-shrink: 0; border-radius: 0; }

	.lang { bottom: -60px; right: 2%; filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.7)); }
	.lang a { padding: 0; }
	.lang li + li::before { margin: 0 8px;}
	.lang,
	.lang a { font-size: 16px; }

	header.fixed .open_menu { background: #000; }
	header.fixed .tel-link::before { background: url(../img/common/icon_tel_b.svg) no-repeat; background-size: contain; }
	header.fixed .tel-link::before { opacity: 0; }
	header.fixed .tel-link::after { opacity: 1; }

	header.top .tel-link { transition: color .6s; }

	header .open_menu { display: flex; transition: background .6s; }
}

@media screen and (max-width: 400px) {
	header .logo a > span br { display: none;}
	header .logo a > span span:nth-of-type(1) { display: none;}
	header .logo a > span span:nth-of-type(2) { display: inline-block; }
}


/* ---------------------------------------------------
	G-nav
------------------------------------------------------ */
#gnav_wrap {
	opacity:0; pointer-events: none; transition: opacity .6s ease-out; position: fixed; top: 0; left: 0; z-index: 9; width: 100%; height: 100vh; overflow: scroll; background: #1a1a1a; color: #fff;
	min-height: 100%; min-height: -webkit-fill-available; padding-bottom: 120px; }
#gnav_wrap.active { opacity: 1; pointer-events: auto; }
#gnav { display: flex; justify-content: space-between; width: 94%; margin: 0 auto; padding-top: calc(50px + 12vw); }
#gnav > ul { width: 50%; }
#gnav > ul:first-child { padding-left: 10px; box-sizing: border-box; }
#gnav > ul li + li { margin-top: 6vw; }
#gnav > ul a { position: relative; padding-left: 20px; box-sizing: border-box; color: #fff; transition: opacity .3s;}
#gnav > ul a::before { position: absolute; top: calc(50% - 7px); left: 0; content: ''; display: inline-block; width: 7px; height: 14px; background: url(../img/common/icon_arrow01.svg) no-repeat; }


/* ---------------------------------------------------
	Main img
------------------------------------------------------ */
#main_img { position: relative; }
#main_img > .cmn_tit { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; color: #fff; font-size: 48px; filter: drop-shadow(0 0 2px #1a1a1a) drop-shadow(0 0 5px #1a1a1a); line-height: 1; text-stroke: 1px #fff; -webkit-text-stroke: 1px #fff; }
#main_img > .cmn_tit .font_en { text-transform: capitalize; font-size: 26px; display: block; padding-bottom: 15px; text-stroke: 0; -webkit-text-stroke: 0;}

@media screen and (max-width: 600px) {
	#main_img > .cmn_tit { font-size: 32px; }
	#main_img > .cmn_tit .font_en { font-size: 16px; padding-bottom: 5px; }
}


/* ---------------------------------------------------
	Contents
------------------------------------------------------ */
#contents_wrap { clear: both; flex-grow: 1;}

/* breadcrumb */
#contents_wrap #breadcrumb { margin: 5px auto 25px; font-size: 14px; }
#contents_wrap #breadcrumb li { display: inline-block; line-height: 1.6;}
#contents_wrap #breadcrumb li:before { content: '-'; margin: 0 10px 0 5px;}
#contents_wrap #breadcrumb li:first-child:before { display: none;}

/* cmn */
.cmn_tit01 { font-size: 44px; line-height: 1; text-stroke: 1px #1a1a1a; -webkit-text-stroke: 1px #1a1a1a; padding-top: 65px; margin-bottom: 50px; position: relative; text-align: center; letter-spacing: 0.1em; }
.cmn_tit01 .en { display: block; }
.cmn_tit01::before { content: ''; width: 1px; height: 45px; background: #000; position: absolute; top: 0; right: 50%; }

.cmn_btn01 { position: relative; background: #1a1a1a; border: 1px solid #1a1a1a; color: #fff; width: 220px; display: flex; align-items: center; justify-content: center; line-height: 1; padding: 17px 2%; box-sizing: border-box; transition: color .3s; z-index: 1; }
.cmn_btn01::before { position: absolute; top: 0; right: 0; bottom: 0; left: 0; content: ''; z-index: -1; background: #fff; transform-origin: top left; transform: scale(0, 1); transition: transform .3s; }
.cmn_btn02 span { position: relative; display: inline-block; line-height: 1.5;}
.cmn_btn02 span::before { content: ''; position: absolute; bottom: -1px; left: 0; width: 0; height: 1px; background: #222; transition: width .3s ease; }

@media screen and (hover: hover) {
	.cmn_btn01:hover { color: #1a1a1a; }
	.cmn_btn01:hover::before { transform: scale(1, 1); }
	.cmn_btn02:hover span::before { width: 100%;}
}

@media screen and (max-width: 600px) {
	.cmn_tit01 { font-size: 30px; padding-top: 30px; margin-bottom: 25px; }
	.cmn_tit01::before { height: 20px; }
}

/* lead */
.lead_col { padding: 60px 0 0; position: relative; }
.lead_col::before { content: ''; z-index: -1; background: url(../img/common/contents_bg01.jpg); width: 100%; height: 635px; position: absolute; top: 0; left: 0; }
.lead_col .cmn_tit01 { font-size: 36px; }
.lead_col .cmn_tit01 + p { text-align: center; margin-bottom: 55px; }

@media screen and (max-width: 600px){
	.lead_col { padding: 8vw 0 0; }
	.lead_col .cmn_tit01 { font-size: 24px; line-height: 1.5; margin-bottom: 15px; }
	.lead_col .cmn_tit01 + p { text-align: left; margin-bottom: 4vw; }
}


/* slick_dots */
div[class^="slick_"] { font-size: 0; line-height: 0; }
.slick_dots > div { margin-bottom: 30px; }
div[class^="slick_"] .slick-dots { z-index: 3; bottom: -30px; margin: 0; padding: 0 15px; line-height: 1; box-sizing: border-box; }
div[class^="slick_"] .slick-dots li { width: 12px; height: 12px; margin: 0 5px; }
div[class^="slick_"] .slick-dots li button { width: 12px; height: 0; padding: 12px 0 0; overflow: hidden;}
div[class^="slick_"] .slick-dots li button:before { content: ''; width: 100%; height: 100%; border: 1px solid #1a1a1a; border-radius: 50%; line-height: 0; opacity: 1; transform: scale(.9); transition:.5s; box-sizing: border-box;}
div[class^="slick_"] .slick-dots li.slick-active button::before { background: #1a1a1a; opacity: 1; transform: scale(1);}

@media screen and (max-width: 600px) {
	.slick_dots > div { margin-bottom: 20px;}
	div[class^="slick_"] .slick-dots { padding: 0; bottom: -20px;}
	div[class^="slick_"] .slick-dots li { width: 10px; height: 10px; margin: 0 3px; }
	div[class^="slick_"] .slick-dots li button { width: 10px; padding: 10px 0 0;}
}

/* ---------------------------------------------------
	Footer
------------------------------------------------------ */
#pagetop { display: block; position: fixed; bottom: 20px; right: 20px; z-index: 9999; cursor: pointer; }
#pagetop p { display: block; width: 48px; height: 0; padding: 48px 0 0; position: relative; background: #fff; border: 1px solid #ccc; font-size: 0; opacity: 0.8; overflow: hidden; transition: opacity 0.5s;}
#pagetop p::before { width: 18px; height: 18px; position: absolute; top: 20px; left: 15px; border-left: 1px solid #ccc; border-top: 1px solid #ccc; content: ""; transform: rotate(45deg);}
#pagetop:hover p { opacity: 1;}

#ft_navwrap { background: #1a1a1a; color: #fff; padding: 90px 0;}
#ft_navwrap > div { display: flex; flex-wrap: wrap; justify-content: space-between;}
#ft_navwrap #ft_logo { width: 100%; margin-bottom: 30px;}
#ft_navwrap #ft_logo a { color: #fff; display: flex; align-items: center; transition: opacity .5s; }
#ft_navwrap #ft_logo a > span { margin-left: 20px; font-size: 13px; line-height: 2;}
#ft_navwrap #ft_logo a > span span { font-size: 20px; }
#ft_navwrap #ft_txt address .tel { margin-right: 1em;}
#ft_navwrap #ft_txt address .tel-link { color: #fff; display: inline-block; }

#ft_navwrap #f_nav { width: 470px; margin-top: 10px;}
#ft_navwrap #f_nav #fnav { display: flex; justify-content: space-between;}
#ft_navwrap #f_nav #fnav ul { width: 50%;}
#ft_navwrap #f_nav #fnav ul li { position: relative; line-height: 1.5; padding-left: 35px; background: url(../img/common/icon_arrow01.svg) no-repeat center left; }
#ft_navwrap #f_nav #fnav ul li + li { margin-top: 30px;}
#ft_navwrap #f_nav #fnav a { color: #fff; transition: opacity .5s; }
#ft_navwrap #f_nav #fnav .cmn_btn02 span::before { background: #fff;}

#group_wrap { padding: 50px 0 40px; text-align: center; background: #e6e6e6; font-size: 18px; }
#group_wrap ul { display: flex; justify-content: center; margin-top: 30px; }
#group_wrap ul li:not(:last-child) { margin-right: 30px;}

#copyright { width: 100%; padding: 25px 0; display: flex; align-items: center; justify-content: center; text-align: center; font-size: 14px; background: #e6e6e6; }

@media screen and (hover: hover) {
	#ft_navwrap #ft_logo a:hover { opacity: 0.7;}
}

@media screen and (max-width: 600px) {
	#pagetop { position: static;}
	#pagetop p { width: 100%; height: auto; padding: 35px 0 10px; background: none; border: none; border-top: 1px solid #ccc; font-size: 10px; opacity: 1; text-align: center;}
	#pagetop p::before { top: 19px; left: calc(50% - 10px);}
	#pagetop p:hover { text-decoration: none;}

	#ft_navwrap { padding: 10vw 0;}
	#ft_navwrap > div { display: block;}
	#ft_navwrap #ft_logo a { justify-content: center;}
	#ft_navwrap #ft_logo img { width: 80%;}
	#ft_navwrap #ft_txt { width: 100%; text-align: center;}
	#ft_navwrap #ft_txt address span { display: inline-block; }
	#ft_navwrap #ft_txt address .tel,
	#ft_navwrap #ft_txt address .fax { margin: 0 0.5em; }

	#ft_navwrap #f_nav { width: 100%;}
	#ft_navwrap #f_nav > p { border: 1px solid #fff; display: block; text-align: center; padding: 12px 0; margin-top: 20px; position: relative; font-size: 14px; }
	#ft_navwrap #f_nav > p::before {
		content: ''; display: block; width: 13px; height: 8px; background: url(../img/common/icon_arrow02.svg) no-repeat; background-size: contain; position: absolute; top: calc(50% - 4px); right: 40px;	}
	#ft_navwrap #f_nav #fnav { margin-top: 5vw;}
	#ft_navwrap #f_nav #fnav ul:first-child { padding-left: 10px; box-sizing: border-box; }
	#ft_navwrap #f_nav #fnav ul li + li { margin-top: 6vw;}
	#ft_navwrap #f_nav #fnav ul li { padding-left: 20px;}

	#group_wrap { padding: 6vw 0 0; font-size: 16px;}
	#group_wrap ul { flex-direction: column; margin-top: 5px; }
	#group_wrap ul li:not(:last-child) { margin: 0 0 5px 0;}

	#copyright { padding: 5vw 0;}
}



/* 全ページ公開後削除*/
.prepare { opacity: 0.4; pointer-events: none; }
.cmn_btn01.prepare::before,
.cmn_btn02.prepare:hover span::before { display: none; }
.cmn_btn01.prepare:hover { color: #fff; }