@charset "utf-8";
/* ===================================================
	Base CSS
====================================================== */
body {
	min-width: 1100px; min-height: 100vh; background: #fff; color: #000;
	font-size: 15px; font-weight: normal; line-height: 1.9;
	font-family: '游明朝', YuMincho, 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'Times New Roman',serif;
	-webkit-text-size-adjust: 100%; position: relative;

	font-feature-settings: "palt"; letter-spacing: 0.08em;
	/* font-feature-settings: "palt"; こちらの指定をすると文字が詰まりすぎてしまう場合があるので、letter-spaceingの記述が必要です。デザイン上不要であれば削除してください。
	縦書きテキストだと崩れる可能性があります。縦書きの項目は下記のようにしてください。
	.v_rl{ writing-mode: vertical-rl; font-feature-settings: "palt" 0;}*/
}
body.noscroll{ overflow: hidden;}


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

div { box-sizing: border-box;}

a { color: #000; text-decoration: none; transition: all .5s;}

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

.ofi { object-fit: cover; width: 100%; height: 100%;}
.view_sp { display: none;}
.num { text-combine-upright: all; -webkit-text-combine: horizontal; -ms-text-combine-horizontal: all;}

@media screen and (hover:hover) and (min-width: 601px) {
	a:hover { opacity: .7;}
}


@media screen and (max-width: 600px) {
	body,
	input,
	select,
	textarea { font-size: 16px;}

	body { min-width: 0; line-height: 1.6;}
	.view_sp { display: block;}
	.view_pc { display: none !important;}
}


/* ---------------------------------------------------
	Base Layout
------------------------------------------------------ */
.inner_md{ margin: 0 auto; width: 86%; max-width: 1100px;}
.inner_sm{ margin: 0 auto; width: 86%; max-width: 1000px;}

/* 背景 */
.bg_col{ background: url(../img/bg.png);}


/* タイトル */
.tit_en{ margin-bottom: 60px; text-align: center;}
.tit_en span{ display: block; line-height: 1.6;}
.tit_en .ja{ font-size: 16px;}
.tit_en .en{ font-size: 30px; color: #542653;}

.tit_icon{
	margin-bottom: 60px; text-align: center;
	display: flex; align-items: center; flex-direction: column;
	position: relative;
}
.tit_icon::before{
	display: block; content: "";
	margin-bottom: 20px; width: 62px; height: 64px;
	background: url(../img/icon.svg) no-repeat;
	background-size: contain;
}

.tit_icon span{ display: block; line-height: 1.4;}
.tit_icon .ja{ font-size: 45px;}
.tit_icon .en{ margin-top: 10px; font-size: 12px; color: #a2781d;}


.tit_icon_line{
	margin-bottom: 30px; padding-bottom: 20px;
	border-bottom: 1px solid #ccc;
}
.tit_icon_line span{
	font-size: 35px; line-height: 1.4;
	display: flex; align-items: center;
}
.tit_icon_line span:before{
	display: block; content: '';
	margin-right: 10px; width: 18px; height: 18px;
	background: url(../img/icon_tit.png) no-repeat;
	background-size: contain;
}

.tit_txt{
	margin-bottom: 20px;
	font-size: 25px; line-height: 1;
}

@media screen and (max-width: 600px) {
	.tit_en{ margin-bottom: 10vw;}
	.tit_en .en{ margin-top: 5px; font-size: 28px; line-height: 1.3;}
	.tit_icon{ margin-bottom: 10vw;}
	.tit_icon::before{ margin-bottom: 15px; width: 52px; height: 54px;}
	.tit_icon .ja{ font-size: 26px;}
	.tit_icon_line{ margin-bottom: 5vw; padding-bottom: 5vw;}
	.tit_icon_line span{ font-size: 26px;}
	.tit_icon_line span:before{ margin-right: 10px; width: 10px; height: 10px;}
	.tit_txt{ margin-bottom: 7vw; font-size: 24px;}
}

/* リンク */
.cmn_linkbtn_01 {
	display: flex; justify-content: center; align-items: center;
	width: 248px; height: 54px;
	color: #fff; background: #542653;
	position: relative; box-sizing: border-box;
}
.cmn_linkbtn_01::after{
	display: block; content: '';
	width: 100%; height: 100%;
	bottom: -5px; right: -5px; position: absolute;
	border-right: 1px solid #542653;
	border-bottom: 1px solid #542653;
	transition: all .5s;
}

@media screen and (hover:hover) and (min-width: 601px) {
	.cmn_linkbtn_01:hover::after{ bottom: 0; right: 0;}
}
@media screen and (max-width: 600px) {
	.cmn_linkbtn_01{ width: 100%;}
}

/* c_nav 幅などはページごとに追記してください */
.c_nav{
	margin: 0 auto 80px;
	display: flex; justify-content: center; align-items: center; flex-wrap: wrap;
	list-style: none;
}
.c_nav li{ margin: 0 9px 20px; width: 23.5%; max-width: 260px;}
.c_nav li:first-of-type{ margin-left: 0;}
.c_nav li:nth-of-type(4n){ margin-right: 0;}

.c_nav li a{
	display: block; padding:20px 10px; width: 100%; height: 120px;
	display: flex; justify-content: center; align-items: center;
	flex-direction: column; font-size: 18px; text-align: center; line-height: 1.5;
	border: 1px solid #b4a582; box-sizing: border-box;
 }
 .c_nav li a::after{
	display: block; content: ''; margin-top: 15px; width: 12px; height: 9px;
	background: url(../img/cn_arrow_off.png) no-repeat;
	background-size: contain;
 }
 
 @media screen and (hover:hover) and (min-width: 601px) {
	.c_nav li a:hover{
		color: #fff; opacity: 1;
		background: #542653; border-color: #542653;
	}
	.c_nav li a:hover::after{
		background-image: url(../img/cn_arrow_on.png);
	}
}

@media screen and (max-width: 600px) {
	.c_nav{ margin-bottom: 10vw; justify-content: space-between;}
	.c_nav li{ margin: 0 0 15px; width: 49%;}
	.c_nav li a{ padding: 4vw 3vw 3vw; height: auto;}
	.c_nav li a::after{ margin-top: 7px;}
}

/* cmn_outline */
.cmn_outline{ display: flex; border-bottom: 1px solid #aaa;}
.cmn_outline dt,
.cmn_outline dd{ line-height: 2.1; box-sizing: border-box;}
.cmn_outline dt{
	padding: 14px 15px 14px 40px;
	display: flex; align-items: center;
	width: 200px; background: #f1ece0;
}
.cmn_outline dd{ 
	padding: 14px 15px 14px 35px;
	width: calc(100% - 200px);
}

@media screen and (max-width: 600px) {
	.cmn_outline{ flex-direction: column;}
	.cmn_outline dt{ padding: 12px 4vw; width: 100%;}
	.cmn_outline dd{ padding: 12px 4vw; width: 100%;}
}


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

@keyframes h-top {
	0% { transform: translateY(0); background: #fff; position: fixed;}
	50% { transform: translateY(-100%); background: none; position: fixed; opacity: 0;}
	51% { transform: translateY(0);}
	100% { opacity: 1; position: absolute;}
}
/* animation End */

#header_wrap{ position: relative;}

#header {
	width: 100%; height: 60px; position: absolute; z-index: 10; 
	display: flex; justify-content: flex-end;
}

#h_logowrap{
	margin-right: auto; padding: 10px 0 0 25px; width: 295px;
	display: flex; align-items: center;
	box-sizing: border-box;
}

#h_logowrap .logo_black{ display: none;}

#h_logowrap ul{ display: flex; align-items: center;}
#h_logowrap ul li:first-of-type{ margin-left: 25px;}
#h_logowrap ul li:last-of-type{ margin-left: 10px;}

#h_navwrap,
#h_nav{
	display: flex; align-items: center;
}

#h_nav li a{
	display: flex; justify-content: center; align-items: center;
	margin: 10px 10px 5px; padding: 10px 10px 0; height: 100%;
	color: #fff; font-size: 17px; text-decoration: none;
	box-sizing: border-box; position: relative;
}
#h_nav li span{ white-space: nowrap;}

#h_nav a::before {
	position: absolute; top: 0; left: calc(50% - 5px);
	content:''; display:block; width: 10px; height: 10px;
	background: #7b5d7a; opacity:0;
	transition: opacity .5s; border-radius:50%;
}
#home #h_nav li:first-child a::before,
#appeal #h_nav li:nth-child(2) a::before,
#spa #h_nav li:nth-child(3) a::before,
#meal #h_nav li:nth-child(4) a::before,
#room #h_nav li:nth-child(5) a::before,
#facilities #h_nav li:nth-child(6) a::before { opacity:1; }

#h_nav a::after {
	display: block; content: '';
	width: 100%; height: 1px; background: #fff;
	position: absolute; bottom: 0; left: 0;
	transform: scaleX(0); transition: transform .5s;
}

#h_tel{
	padding: 10px 20px 0; height: 100%;
	display: flex; justify-content: center; align-items: center;
	border-left: 1px solid #888b80; box-sizing: border-box;
}
#h_tel .tel-link{ color: #fff;}

#h_tel .view_pc{ font-size: 22px; line-height: 1.3; white-space: nowrap;}
#h_tel .view_pc .txt{ font-size: 18px;}
#h_tel .view_pc .time{ display: block; font-size: 14px;}

#h_tel .tel_black{ display: none;}

#h_reserve{	width: 210px; height: 100%;}
#h_reserve a{
	width: 100%; height: 100%; color: #fff; font-size: 18px;
	display: flex; justify-content: center; align-items: center;
	background: #542653;
}

#header.fixed {
	height: 66px; position:fixed;
	background-color: rgba(255,255,255,0.9);
	animation: h-fixed 1s;
}
#header.fixed #h_nav li a,
#header.fixed #h_tel{ color: #000;}
#header.fixed #h_logowrap .logo_white{ display: none;}
#header.fixed #h_logowrap .logo_black{ display: block;}
#header.fixed #h_nav li a::after{ background: #000;}
#header.fixed #h_tel .tel-link{ color: #000;}

#header.top { animation: h-top 1.5s; left: 0!important;}

@media screen and (max-width: 1280px) {
	#h_logowrap{ padding: 10px 0 0 15px;}
	#h_logowrap ul li:first-of-type{ margin-left: 15px;}
	#h_nav li a{ margin: 5px 5px 0; padding: 10px 7px 0;}
	#h_tel{ padding: 10px 15px 0;}
}

@media screen and (hover: hover) {
	#h_nav a:hover{ opacity: 1;}
	#h_nav a:hover::after { transform: scaleX(1); }
	#header.fixed #h_nav a:hover::after { background-color: #222;} 
}

@media screen and (max-width: 600px) {
	#header{ width: calc(100% - 45px); height: 45px;}
	#h_logowrap{ padding: 0 0 0 5px; width: 185px;}
	#h_logowrap > a{ line-height: 1;}
	#h_logowrap ul{ width: 80px;}
	#h_logowrap ul li:first-of-type{ margin-left: 10px;}
	#h_logowrap ul img{ vertical-align: middle;}
	#h_tel{ border-left: 0; padding: 0;}
	#h_tel a{
		padding: 4px 15px 0; color: #fff;
		text-align: center; line-height: 1;
	}
	#h_tel .view_sp .txt{ display: block; margin-top: 2px; font-size: 12px;}

	#h_reserve{ width: 80px;}
	#h_reserve a{ font-size: 15px;}
	#header.fixed { min-width: calc(100% - 45px); height: 45px;}
	#header.fixed #h_tel .tel_white{ display: none;}
	#header.fixed #h_tel .tel_black{ display: block;}
	#header.fixed #h_tel a{ color: #000;}
}


/* ---------------------------------------------------
hd_menu
------------------------------------------------------ */
@media screen and (max-width: 600px) {
	.hd_menu {
		width: 45px; height: 45px; background: #845a83;
		position: fixed; z-index: 1000; top: 0; right: 0;
	}
	.hd_menu > .bar{
		transition: all 0.3s; box-sizing: border-box;
		position: absolute; height: 1px; width: 31px;
		text-indent: 100%; white-space: nowrap; overflow: hidden;
		z-index: 2; transform-origin: center center; right: 7px;
	}
	.hd_menu > .bar::after{
		content: ""; height: 1px; width: 31px;
		display: block; background: #fff;
		position: absolute; top: 0; left: 0;
	}

	.hd_menu > .bar:nth-of-type(1) { top: 14px;}
	.hd_menu > .bar:nth-of-type(2) { top: 22px;}
	.hd_menu > .bar:nth-of-type(3) { top: 30px;}
	.hd_menu.on > .bar { width: 30px; right: 6px;}
	.hd_menu.on > .bar::after{ width: 30px;}
	.hd_menu.on > .bar:nth-of-type(1) { transform: rotate(45deg); top: 20px;}
	.hd_menu.on > .bar:nth-of-type(2) { opacity: 0;}
	.hd_menu.on > .bar:nth-of-type(3) { transform: rotate(-45deg); top: 20px;}

	.hd_menu .close{
		text-align: center; font-size: 11px; line-height: 1;
		letter-spacing: 0.1em; position: absolute;
		top: 36px; left: 0; width: 100%; transition: opacity 0.5s;
	}
	.hd_menu .close{ opacity: 0;}
	.hd_menu.on .close{ opacity: 1;}
}

/* ---------------------------------------------------
go_en
------------------------------------------------------ */
#go_en{
	top: 75px; right: 15px; position: absolute; z-index: 5;
	display: block; padding: 8px 15px;
	color: #fff; text-align: center; line-height: 1;
	background: rgba(255,255,255,0.4);
}

#go_en span{ display: flex; align-items: center;}
#go_en span:after {
	display: block; content: ''; margin-left: 10px; width: 8px; height: 8px;
	background: url(../img/link_btn_arrow.png) no-repeat;
	background-size: contain;
}

@media screen and (max-width: 600px) {
	#go_en{ top: 55px; right: 5px; font-size: 14px;}
}


/* ---------------------------------------------------
	G-nav
------------------------------------------------------ */
#gnav {
	position: fixed; top: 0; right: 0; bottom: 0;
	width: 100%; height: 100%; opacity: 0; visibility: hidden;
	transition: all 0.5s; display: block; z-index: 999;
}
#gnav.on { opacity: 1; visibility: visible;}

#gnav .gn_inner{
	width: 600px; height: 100%; padding: 100px 80px 50px;
	background-color: #fff; overflow-y: auto;
	position: absolute; top: 0; right: -380px;
	box-sizing: border-box; z-index: 2; transition: all 0.5s;
}
#gnav.on .gn_inner{ right: 0;}

#gnav .logo a{ display: block; text-align: center;}
#gnav .logo span{ display: block; font-size: 14px; line-height: 1.4;}
#gnav .logo img{ width: 332px; margin: 10px auto 30px;}


#gnav .gnav_menu ul{ 
	display: flex; justify-content: space-between;
	flex-wrap: wrap;
}
#gnav .gnav_menu ul:first-of-type{
	margin-bottom: 15px; padding-bottom: 15px;
	border-bottom: 1px solid #ccc;
}
#gnav .gnav_menu ul:last-of-type{ font-size: 14px;}

#gnav .gnav_menu li{ width: 50%; line-height: 1.4; margin: 5px 0;}
#gnav .gnav_menu li a{
	display: block; color: #000; text-decoration: none;
	position: relative; padding: 8px 0 8px 20px;
}
#gnav .gnav_menu li a::before{
	content: ""; display: block; width: 8px; height: 1px;
	background: #7f7f7f; position: absolute; top: 18px; left: 0;
}

#gnav #main_menu{
	margin-bottom: 20px; padding-bottom: 20px;
	font-size: 17px;
}
#gnav #sub_menu{ margin-bottom: 20px; font-size: 15px;}

#gnav #gn_reserve{ margin: 0 auto;}
#gnav #gn_reserve a{
	padding: 15px 0; width: 100%; color: #fff; font-size: 18px;
	display: flex; justify-content: center; align-items: center;
	background: #542653;
}

#gnav .gn_close{
	display: block; width: 100%; height: 100%;
	background: rgba(0,0,0,0.5); z-index: 1;
	position: fixed; top: 0; left: 0;
	text-indent: 100%; white-space: nowrap; overflow: hidden;
}

@media screen and (hover:hover) and (min-width: 601px) {
	#gnav .gnav_menu li a:hover{ color: #70602b;}
}
@media screen and (max-width: 600px) {
	#gnav .gn_inner{ width: 100%; padding: 70px 5% 30px; right: -100%;}
	#gnav .logo a{ margin: 0 auto; width: 80%;}
	#gnav #main_menu{
		margin-bottom: 20px; padding-bottom: 0;
		font-size: 16px;
	}
	#gnav #gn_reserve a{ font-size: 16px;}
}

/* ---------------------------------------------------
	Main Tit
------------------------------------------------------ */
#main_tit{ height: 480px; position: relative;}
#main_tit:before {
	display: block; content: ""; width: 100%; height: 240px;
	top: 0; left: 0; position: absolute; z-index: 1;
	background: linear-gradient(rgba(0,0,0,.85),transparent);
}

#main_tit .tit_block{
	width: 100%; height: 100%;
	top: 0; left: 0; position: absolute; z-index: 1;
	display: flex; justify-content: center; align-items: center;
}
#main_tit h1{
	color: #fff; line-height: 1.4;
	display: flex; justify-content: center; align-items: center;
	flex-direction: column;
}
#main_tit .tit_block .ja{
	font-size: 35px; text-align: center;
	text-shadow: 0px 0px 10px rgba(0,0,0,0.7);
}
#main_tit .tit_block .en{ margin-top: 5px; font-size: 15px;}

@media screen and (max-width: 600px) {
	#main_tit{ height: 100vw;}
	#main_tit:before { height: 50vw;}
	#main_tit .tit_block{ padding-top: 45px; box-sizing: border-box;}
	#main_tit .tit_block .ja{ font-size: 28px;}
}


/* ---------------------------------------------------
	Contents
------------------------------------------------------ */
#contents_wrap{ position: relative; overflow: hidden;}
#contents_wrap::before{
	display: block; content: ''; width: 100%; height: 300px;
	top: 0; right: calc(50% - 350px); position: absolute; z-index: -1;
	background: url(../img/contents_bg_pc.png) no-repeat right top;
	background-size: auto 100%;
}

/* breadcrumb */
#breadcrumb { padding: 10px 2% 0; font-size: 14px; text-align: right;}
#breadcrumb li { display: inline-block; line-height: 1.6;}
#breadcrumb li:before { content: '>'; margin: 0 15px;}
#breadcrumb li:first-child:before { display: none;}


/* lead */
#lead{ margin: 100px 0 70px; text-align: center;}
#lead .lead_tit{ margin-bottom: 40px; font-size: 35px;}
#lead .lead_txt{ line-height: 1.8;}

@media screen and (max-width: 600px) {
	#contents_wrap::before{
		right: 0;
		background-image: url(../img/contents_bg_sp.png);
	}

	#breadcrumb { padding: 5vw 2vw;}

	#lead{ margin: 10vw 0;}
	#lead .lead_tit{ margin-bottom: 5vw; font-size: 28px;}
	#lead .lead_txt{ text-align: left;}
}



/* slider
------------------------------------------------------ */
.slick-dotted.slick-slider{ margin-bottom: 0 !important;}
.slick-dots{ position: static;}
.slick_dots .slick-slide.slick-current { opacity: 1; }

.slick-dots {
	margin: 5px 0 0 !important; padding: 0 !important; line-height: 1 !important;
	box-sizing: border-box !important; position: static !important;
}
.slick-dots li { margin: 0 6px !important;  width: 10px !important; height: 10px !important;}
.slick-dots li button { width: 10px !important; height: 0 !important; padding: 10px 0 0  !important; overflow: hidden; }
.slick-dots li button::before {
	font-size: 0 !important; content: '' !important;
	width: 100% !important; height: 100% !important;
	border: 1px solid #a4782f; border-radius: 50%;
	line-height: 0 !important; opacity: 1; transition:.5s;
	box-sizing: border-box;
}
.slick-dots li.slick-active button::before {
	background: #a4782f !important; opacity: 1 !important;
}


@media screen and (max-width: 600px) {
	.slick_dots .slick-slide { margin: 0; }
	.slick_dots .slick-slide img { height: 58vw; min-height: 250px; }
	.slick-dots li { width: 6px; height: 6px; }
	.slick-dots li button { width: 6px; padding: 6px 0 0; }
}


/* ---------------------------------------------------
img_col
------------------------------------------------------ */
#img_col{ height: 491px; position: relative;}
#img_col div{
	width: 100%; height: 100%;
	top: 0; left: 0; position: absolute;
	display: flex; justify-content: center; align-items: center;
}
#img_col div p{
	color: #fff; font-size: 22px;
	text-align: center; line-height: 1.9;
}

@media screen and (max-width: 600px) {
	#img_col{ height: 70vw;}
	#img_col div p{
		margin: 0 auto; width: 90%;
		font-size: 17px; line-height: 1.7;
	}
}


/* ---------------------------------------------------
	Footer
------------------------------------------------------ */
#ft_guide{ padding: 70px 0 50px; text-align: center;}
#ft_guide .ft_logo{
	margin-bottom: 40px; display: flex;
	justify-content: center; align-items: center; flex-direction: column;
}
#ft_guide .ft_logo img:first-child{ margin-bottom: 10px;}
#ft_guide .ft_txt{ margin-bottom: 35px; line-height: 1.8;}
#ft_guide .ft_txt .time{ display: block; font-size: 14px;}
#ft_guide .ft_reserve{
	display: flex; justify-content: center;
}
#ft_guide .ft_reserve li{ width: 100%; max-width: 288px;}
#ft_guide .ft_reserve a{
	padding: 15px 0; width: 100%;
	color: #542653; border: 1px solid #7e599b;
}
#ft_guide .ft_reserve a,
#ft_guide .ft_reserve a span{
	display: flex;
	justify-content: center; align-items: center;
}
#ft_guide .ft_reserve a span::before{ margin-right: 13px;}

#ft_guide .ft_reserve #ft_plan a{ color: #fff; background: #542653;}
#ft_guide .ft_reserve #ft_plan a span::before{
	display: block; content: ""; width: 15px; height: 15px;
	background: url(../img/icon_search_w.svg) no-repeat;
}

#ft_guide .ft_reserve #ft_room{ margin: 0 37px;}
#ft_guide .ft_reserve #ft_room a span::before{
	display: block; content: ""; width: 22px; height: 16px;
	background: url(../img/icon_bed_p.svg) no-repeat;
}

#ft_guide .ft_reserve #ft_cal a span::before{
	display: block; content: ""; width: 16px; height: 17px;
	background: url(../img/icon_cal_p.svg) no-repeat;
}

@media screen and (hover:hover) and (min-width: 601px) {
	#ft_guide .ft_reserve a:hover{ opacity: 1;}
	#ft_guide .ft_reserve #ft_plan a:hover{ color: #542653; background: #fff;}
	#ft_guide .ft_reserve #ft_plan a:hover span::before{
		background: url(../img/icon_search_p.svg) no-repeat;
	}
	#ft_guide .ft_reserve #ft_room a:hover{ color: #fff; background: #542653;}
	#ft_guide .ft_reserve #ft_room a:hover span::before{
		background: url(../img/icon_bed_w.svg) no-repeat;
	}
	#ft_guide .ft_reserve #ft_cal a:hover{ color: #fff; background: #542653;}
	#ft_guide .ft_reserve #ft_cal a:hover span::before{
		background: url(../img/icon_cal_w.svg) no-repeat;
	}
}
@media screen and (max-width: 600px) {
	#ft_guide{ padding: 10vw 0;}
	#ft_guide .ft_logo{ margin-bottom: 10vw;}
	#ft_guide .ft_txt{ margin-bottom: 10vw;}
	#ft_guide .ft_reserve{ flex-direction: column;}
	#ft_guide .ft_reserve li{ margin: 0 0 10px; max-width: 100%;}
	#ft_guide .ft_reserve a{ padding: 10px 0;}
	#ft_guide .ft_reserve #ft_room{ margin: 0 0 10px;}
}

#f_nav{ padding: 35px 0 40px; border-top: 1px solid #bababa;}
#f_nav .inner_col{ margin: 0 auto; width: 92%; max-width: 1200px;}

.f_nav{ display: flex; justify-content: center; align-items: center;}
.f_nav li{
	padding: 0 15px;
	border-right: 1px solid #a3a3a3; box-sizing: border-box;
}
.f_nav li:last-of-type{ border-right: 0;}
.f_nav li span{ font-size: 14px; white-space: nowrap;}

#ft_btm{ padding: 60px 0 50px;}
#ft_btm .inner_block{
	margin: 0 auto; width: 92%; max-width: 1200px;
	display: flex; justify-content: space-between; align-items: center;
	flex-wrap: wrap;
}
#ft_btm p:first-of-type{ font-size: 14px; line-height: 1.9;}
#ft_btm ul{ display: flex; justify-content: flex-end; align-items: center;}
#ft_btm ul li{ margin-left: 15px;}
#ft_btm #copyright{
	display: block; width: 100%;
	font-size: 12px; text-align: right; line-height: 1;
}

@media screen and (max-width: 1304px) {
	.f_nav li{ padding: 0 8px;}
}

@media screen and (hover:hover) and (min-width: 601px) {
	.f_nav a:hover{ text-decoration: underline;}
}
@media screen and (max-width: 600px) {
	#f_nav{ padding: 6vw 0;}
	#f_nav .acc_tit{
		padding: 10px; color: #fff; text-align: center;
		background: #a57ca4; position: relative;
	}
	#f_nav .acc_tit::after{
		display: block; content: '';
		top: calc( 50% - 4.5px); right: 10px; position: absolute;
		width: 12px; height: 9px;
		background: url(../img/icon_arrow_down.svg) no-repeat;
		background-size: contain;
		transition: all .5s;
	}
	#f_nav .acc_tit.active::after{ top: calc( 50% - 5px); transform: rotate(-180deg);}
	.f_nav{
		padding: 5vw 0 5vw 3vw;
		justify-content: flex-start;
		align-items: flex-start;
		flex-wrap: wrap;
	}
	#f_nav .inner_col{ width: 86%;}
	.f_nav li{ margin-bottom: 5px; width: 50%; border-right: 0; box-sizing: border-box;}
	#ft_btm{ padding: 10vw 7vw;}
	#ft_btm .inner_block{ flex-direction: column;}
	#ft_btm p:first-of-type{ margin-bottom: 7vw; line-height: 1.6;}
	#ft_btm ul{ margin-bottom: 7vw; justify-content: center;}
	#ft_btm ul li{ margin: 0 8px;}
	#ft_btm ul li:first-child img{ width: 36px; height: 36px;}
	#ft_btm ul li:last-child img{ width: 35px; height: 35px;}
	#ft_btm #copyright{ text-align: center;}
}

/* ---------------------------------------------------
pagetop
------------------------------------------------------ */
#pagetop {
	position: fixed; bottom: 30px; right: 20px;
	width: 30px; height: 160px; z-index: 9999;
}
#pagetop a {
	width: 100%; height: 100%; position: relative;
	display: flex; justify-content: flex-end; align-items: flex-end;
}
#pagetop a::before{
	display: block; content: ''; width: 100%; height: 100%;
	top: 0; left: 0; position: absolute;
	background: url(../img/pagetop_arrow.png) no-repeat;
	background-size: contain;
}
#pagetop a span{
	font-size: 14px; color: #a3a3a3;
	writing-mode: vertical-rl; font-feature-settings: 'palt' 0;
}

@media screen and (max-width: 600px) {
	#pagetop{ display: none !important;}
}