@charset "utf-8";

/* amiri-regular - latin */
@font-face {
	font-family: 'Amiri';
	font-style: normal;
	font-weight: 400;
	src: local(''),
		 url('../fonts/amiri-v26-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
		 url('../fonts/amiri-v26-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  }
  /* amiri-700 - latin */
  @font-face {
	font-family: 'Amiri';
	font-style: normal;
	font-weight: 700;
	src: local(''),
		 url('../fonts/amiri-v26-latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
		 url('../fonts/amiri-v26-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  }

.amiri { font-family: 'Amiri', serif; }

/* ===================================================
	Base CSS
====================================================== */
body {
	min-width: 1200px; min-height: 100vh; background: #000; color: #fff;
	font-size: 16px; font-weight: normal; line-height: 1.5;
	font-family: serif;
	/* font-family: "Yu Mincho", YuMincho, "Hiragino Mincho ProN", serif; */
	-webkit-text-size-adjust: 100%; position: relative;

	font-feature-settings: "palt"; letter-spacing: 0.1em;
}
.v_rl { writing-mode: vertical-rl; font-feature-settings: "palt" 0; }


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

div { box-sizing: border-box;}

a { color: #fff; text-decoration: none;}
a:hover { text-decoration: underline;}
/* a:hover img { opacity: 0.75;} */

#lineup-font-size-sampler { bottom: 0; left: 0;}
.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%;}
.sp { display: none;}

.inner_lg { width: 1350px; max-width: 92%; margin: 0 auto; }
.inner_md { width: 1200px; max-width: 92%; margin: 0 auto; }

@media screen and (max-width: 600px) {
	body { font-size: 14px;}

	body { min-width: 0;}
	.sp { display: inline-block;}
	.pc { display: none !important;}
}

/* Links */
.logo { transition: opacity .5s; }
.logo:hover { text-decoration: none; }
.link_run, .link_run_lr { position: relative; padding-bottom: 5px; }
.link_run:hover, .link_run_lr:hover { text-decoration: none; }
.link_run::before, .link_run::after, .link_run_lr::before { position: absolute; content: ''; width: 50%; height: 1px; transition: transform .4s; transform: scale(0, 1); background: #fff; }
.link_run_lr::before { width: 100%; }
.link_run::before, .link_run_lr::before { bottom: 0; left: 0; transform-origin: left top; }
.link_run::after { bottom: 0; right: 0; transform-origin: right top; }
.cmn_link_01 { position: relative; display: block; width: 274px; line-height: 40px; margin: 0 auto; padding: 10px; text-align: center; }
.cmn_link_01:hover { text-decoration: none; }
.cmn_link_01::before,
.cmn_link_01::after { content: ''; position: absolute; border: solid rgba(255 255 255/60%); width: 280px; height: 40px; transition: all .3s ease-in-out; }
.cmn_link_01::before { top: 0; left: 0; border-width: 2px 0 0 2px; }
.cmn_link_01::after { right: 0; bottom: 0; border-width: 0 2px 2px 0; }

@media screen and (hover: hover) {
	.logo:hover { opacity: .75; }
	.link_run:hover::before,
	.link_run:hover::after,
	.link_run_lr:hover::before { transform: scale(1, 1); }
	.cmn_link_01:hover::before,
	.cmn_link_01:hover::after { width: calc(100% - 2px); height: calc(100% - 2px); border-color: rgba(255 255 255/90%); }
}
@media screen and (max-width: 600px) {
	.cmn_link_01 { line-height: 33px; }
}

/* Table layout */
.cmn_table { display: flex; flex-wrap: wrap; }
.cmn_table dt { background: #262829; }
.cmn_table dt, .cmn_table dd { padding: 20px 36px; box-sizing: border-box; border-bottom: 1px solid #404040; }
@media screen and (min-width: 601px) {
	.cmn_table dt { width: 262px; }
	.cmn_table dd { width: calc(100% - 262px); }
}
@media screen and (max-width: 600px) {
	.cmn_table { border-top: 1px solid #404040; }
	.cmn_table dt, .cmn_table dd { width: 100%; padding: 10px 4%; }
	.cmn_table dd { padding: 12px 4%; }
}


/* ---------------------------------------------------
	Base Layout
------------------------------------------------------ */
@media screen and (max-width: 600px) {}


/* ---------------------------------------------------
	Header
------------------------------------------------------ */
#g_header,
#g_header .logo,
#g_header .hd_nav>ul { display: flex; align-items: center; }
#g_header { position: fixed; top: 0; left: 0; z-index: 11; justify-content: space-between; width: 100%; min-width: 1200px; padding-left: 32px; box-sizing: border-box; background: #000; }
#g_header .hd_nav { display: flex; position: relative; }
#g_header .hd_nav>ul li:not(:last-of-type) { height: 100%; }
#g_header .hd_nav>ul>li+li { margin-left: 1.5vw; }
#g_header .hd_nav>ul>li a { display: flex; align-items: center; box-sizing: border-box; height: 100%; }
#g_header .hd_nav>ul>li a:hover { text-decoration: none; }
#g_header .hd_nav .link_run { padding: 8px 4px; line-height: 1.3; }
#g_header .hd_nav .link_run::before,
#g_header .hd_nav .link_run::after { background: #b3bff3; }
#g_header .logo .amiri { margin-left: 1.5em; line-height: 1.3; }
#g_header #h_lang { position: relative; margin: 0; }
#g_header #h_lang .acc_tit { width: 10vw; min-width: 120px; padding: 10px 0; text-align: center; }
#g_header #h_lang .acc_tit:hover { cursor: pointer; }
#g_header #h_lang .acc_tit::after { position: absolute; top: 50%; content: ''; display: inline-block; width: 6px; height: 6px; margin-left: 10px; transform: translateY(-50%) rotate(45deg); border-right: 1px solid #fff; border-bottom: 1px solid #fff; }
#g_header #h_lang .acc_contents { display: none; position: absolute; top: 44px; z-index: 1; width: 10vw; min-width: 120px; }
#g_header #h_lang .acc_contents li:not(:last-child) { border-bottom: 1px solid #333; }
#g_header #h_lang .acc_contents a { display: block; padding: 6px 0; background: rgba(0 0 0/90%); text-align: center; transition: color .3s; }
#g_header #h_lang .acc_contents a:hover { text-decoration: none; }
#g_header #h_lang .acc_contents li:first-child a { padding: 0 0 10px; }
#g_header .cmn_btn_01 { width: 15vw; min-width: 200px; line-height: 100px; font-size: 22px; background: url(../img/cmn/btn_bg_bl.gif); text-align: center; letter-spacing: 0.1em; transition: opacity .5s; }
#g_header .cmn_btn_01:hover { text-decoration: none; }

@media screen and (hover: hover) {
	#g_header .hd_nav>ul>li a:hover .link_run::before,
	#g_header .hd_nav>ul>li a:hover .link_run::after { transform: scale(1, 1); }
	#g_header #h_lang .acc_contents a:hover { color: #b3bff3; }
	#g_header .cmn_btn_01:hover { opacity: .85; }
}
@media screen and (max-width: 1300px) {
	#g_header .logo .amiri { display: none; }
}
@media screen and (max-width: 1200px) {
	#g_header .hd_nav>ul>li+li { margin-left: 18px; }
}
@media screen and (max-width: 600px) {
	#g_header { min-width: 0; padding-left: 4%; }
	#g_header .logo { width: 90px; }
	#g_header .hd_nav>ul>li:not(#h_lang) { display: none; }
	#g_header #h_lang { opacity: 0; pointer-events: none; transition: opacity 0s;}
	#g_header #h_lang .acc_tit,
	#g_header #h_lang .acc_contents { min-width: 0; width: 20vw; }
	#g_header #h_lang .acc_tit::after { width: 4px; height: 4px; margin-left: 6px; }
	#g_header #h_lang .acc_contents { top: 40px; }
	#g_header #h_lang .acc_contents a,
	#g_header #h_lang .acc_contents li:first-child a { padding: 3px 0; }
	#g_header #h_lang .acc_contents a { background: #171717; }
	#g_header .cmn_btn_01 { min-width: 0; width: 100px; line-height: 60px; font-size: 13px; }
	#g_header .open_menu { position: relative; display: flex; align-items: center; justify-content: center; width: 60px; padding: 10px 0; }
	#g_header .open_menu>span { line-height: 0; }
	#g_header .open_menu span span { position: absolute; bottom: 8px; left: 0; display: block; width: 100%; text-align: center; opacity: 0; font-size: 13px; }
	#g_header .open_menu::before,
	#g_header .open_menu>span::before,
	#g_header .open_menu>span::after { content: ''; display: inline-block; width: 1px; height: 20px; margin-left: 10px; background: #969696; transition: transform .5s, opacity .5s, background-color .3s;}
	#g_header .open_menu::before { margin-left: 0; }

	.pos_fix #g_header { background: none; }
	.pos_fix #g_header #h_lang { opacity: 1; pointer-events: auto; margin-right: -110px; transition: opacity .5s; }
	.pos_fix #g_header .logo,
	.pos_fix #g_header .cmn_btn_01,
	.pos_fix #g_header .open_menu>span::before { opacity: 0; pointer-events: none; }
	.pos_fix #g_header .open_menu span span { opacity: 1; pointer-events: auto; }
	.pos_fix #g_header .open_menu::before { transform: translate(11px, 0px) rotate(-45deg); }
	.pos_fix #g_header .open_menu>span::after { transform: translate(-11px, 0px) rotate(45deg); }
}


/* ---------------------------------------------------
	G-nav
------------------------------------------------------ */
@media screen and (min-width: 601px) {
	#gnav { display: none; } 
}
@media screen and (max-width: 600px) {
	/* ▼ jquery-dropdown 用のcss設定です ▼
		#menuOuter,#menuInner,.pos_fix はjsで自動的に追加される要素です。
		別にgnavを囲むwrapper等を使用する場合はid名が被らないようにしてください。
	*/
	/* html,body 固定用クラス ※iphoneでは効きません。 */
	.pos_fix { overflow: hidden; /* メニューボタンがfixedじゃない場合は右記を追記 position: fixed; top: 0; width: 100%; */}
	/* gnav外側に追加する要素 画面全体を覆います。 */
	#menuOuter {
		width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 10;
		background: #000; overflow: auto; pointer-events: none;
		transition: 0.75s; opacity: 0;
	}
	#menuOuter.active {
		pointer-events: auto; opacity: 1;
	}
	/* gnav外の領域用要素 この部分をタップするとメニューが閉じます。 */
	#menuInner { width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 0; cursor: pointer;}
	/* ▲ jquery-dropdown 用のcss設定です ▲ */

	#gnav { width: 92%; padding: 0; margin: 0 auto 100px; position: relative; z-index: 15; background: none;}

	#gnav .logo { font-size: 24px; padding: 65px 0 30px; text-align: center;}
	#gnav .logo a { display: inline-block; width: 33vw; }

	#gnav .close_menu { cursor: pointer;}
	#gnav .close_menu span::before,
	#gnav .close_menu span::after { position: absolute; top: 50%; left: 10px; content: ''; display: inline-block; width: 13px; height: 1px; background: #787878;}
	#gnav .close_menu span::before { transform: translate(0px, calc(-50% + -1px)) rotate(-45deg); }
	#gnav .close_menu span::after { margin: -1px 0 0; transform: translate(0px, -50%) rotate(45deg);}
	#gnav #close_top { width: 50px; height: 50px; padding: 0; position: absolute; top: 10px; right: 0; font-size: 0;}
	#gnav #close_bot { position: relative; margin: 3em 0 0; padding: 10px 45px 10px 60px; border: 1px solid #252525; text-align: center; color: #787878;}

	#gnav li a { display: block;}
	#gnav #g_container>ul { display: flex; flex-wrap: wrap; }
	#gnav #g_container>ul li { width: 50%; height: auto; border-right: none; }
	#gnav #g_container>ul a { padding: 5px 20px; position: relative; line-height: 2;}
	#gnav #g_container>ul a::before {
		content: ''; width: 6px; height: 6px;
		position: absolute; top: 50%; left: 0;
		border-top: 1px solid #4d4d4d; border-right: 1px solid #4d4d4d;
		box-sizing: border-box; transform: rotate(45deg) translateY(-50%);
	}
	#gnav #g_container .inq_col { margin-top: 1.5em; padding-top: 2em; border-top: 1px solid #4d4d4d; text-align: center; }
	#gnav #g_container .inq_col>p:not([class]) { line-height: 1.2; }
	#gnav #g_container .inq_col>p:not([class])>span:first-of-type { display: block; font-size: 19px; color: #bbaa82;}
	#gnav #g_container .inq_col>p .amiri { margin-right: 5px; font-size: 22px; }
	#gnav #g_container .inq_col>p .sm { font-size: 12px; }
	#gnav #g_container .inq_col ul { margin-top: 2em; }
	#gnav #g_container .inq_col li+li { margin-top: 10px; }
	#gnav #g_container .inq_col li a { line-height: max(13vw, 55px); letter-spacing: 0.1em; }
	#gnav #g_container .inq_col li a:hover { text-decoration: none; }
	#gnav #g_container .inq_col li:first-child a { background: url(../img/cmn/btn_bg_bl.gif); }
	#gnav #g_container .inq_col li:last-child a { background: url(../img/cmn/btn_bg_gr.gif); }
}


/* ---------------------------------------------------
	Main img
------------------------------------------------------ */
#main_img { position: relative; width: 100%; margin: 0 auto; background: #000; }
#main_img h1 { position: absolute; top: 50%; left: calc(50vw - 600px); /*transform: translateY(-50%);*/ max-width: 92%; font-size: 40px; color: #fff; text-shadow: 0 0 8px #000, 0 0 8px #000; }
#main_img ul.imgs { display: flex; }
#main_img ul.imgs li { width: 100%; }

@media screen and (max-width: 1304px) {
	#main_img h1 { left: 4%; }
}
@media screen and (max-width: 600px) {
	#main_img h1 { font-size: max(5.8vw,20px); }
	#main_img .imgs { display: block; height: 43vw; }
}


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

@media screen and (max-width: 600px) {
	#breadcrumb { font-size: 12px; }
}


/* ---------------------------------------------------
	Footer
------------------------------------------------------ */
#footer_wrap { background: url(../img/cmn/ft_bg.jpg)no-repeat center/cover;}
#footer { padding: 100px 0 75px; text-align: center; }
address { margin-top: 1em; line-height: 1.8; }
address>span { display: block; }
address .tel { margin-top: 0.5em; }
address .tel-link { font-size: 30px; }
#footer .btn { display: block; width: 266px; margin: 30px auto 0; padding: 23px 10px; font-size:18px; letter-spacing: .1em; background: #fff; color: #000; transition: background-color .6s ease, color .5s ease; }
#footer .btn:hover { text-decoration: none; }
#f_contents { margin-top: 50px; }
#f_contents #fnav { display: flex; justify-content: center; }
#f_contents #fnav li+li { margin-left: 2em; }
#f_contents #fnav a { transition: color .5s; }
#f_contents #fnav a:hover { text-decoration: none; }
#f_contents>ul { display: flex; align-items: center; justify-content: center; }
#f_contents .sns { margin: 25px auto 0; }
#f_contents .sns li+li { margin-left: 38px; }
#f_contents .sns a { transition: opacity .5s; }
#f_contents .wifi { display: inline-block; margin: 25px auto 0; padding: 2px 25px; border: 1px solid #6b6b6b; color: #d2d2d2; }
#f_contents .wifi::before { content: ''; display: inline-block; width: 24px; height: 17px; margin-right: 1.25em; background: url(../img/cmn/ico_wifi.svg)no-repeat center/contain; vertical-align: text-bottom; }
#copyright { margin-top: 60px; color: #969696; font-size: 12px;}

@media screen and (hover: hover) {
	#footer .btn:hover { background: #474e6e; color: #fff; }
	#f_contents #fnav a:hover { color: #b3bff3; }
	#f_contents .sns a:hover { opacity: .75; }
}
@media screen and (max-width: 600px) {
	#footer { padding: 10vw 0 8vw; }
	#footer .logo { display: inline-block; width: 36vw; }
	address { margin-top: 1.5em; }
	address .tel-link { font-size: 24px; }
	#footer .btn { width: 220px; max-width: 92%; margin: 20px auto 0; padding: 15px 10px; font-size: 15px; }
	#f_contents { margin-top: 6vw; }
	#f_contents #fnav { flex-wrap: wrap; justify-content: space-between; max-width: 350px; margin: 0 auto; }
	#f_contents #fnav li { width: 49.5%; }
	#f_contents #fnav li+li { margin-left: 0; }
	#f_contents #fnav a { display: block; padding: 2px 0; text-align: left; }
	#f_contents .sns li+li { margin-left: 1.5em; }
	#f_contents .wifi { width: 168px; padding: 5px 10px; }
	#f_contents .wifi::before { width: 18px; height: 13px; }
	#copyright { margin-top: 45px; font-size: 10px; }
}


/* ---------------------------------------------------
	clear
------------------------------------------------------ */