﻿@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300&family=Noto+Serif+JP:wght@300..900&display=swap');

/* reset */
/* -------------------------------------------------------- */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {margin:0; padding:0;}
html {width:100%; height:100%; overflow-y:scroll;}
h1,h2,h3,h4,h5,h6 {font-size:100%; font-weight:bold;}
p, ul, ol, dl, address, blockquote, table, div {font-size:100%;}
p {margin:0 0 0 0;}
ol,ul {list-style:none;}
fieldset,img {border:0; vertical-align:top;}
table {border-collapse:collapse; border-spacing:0;}
caption,th {text-align:left;}
th {vertical-align:top; font-weight:normal; text-align:left;}
td {vertical-align:top;}
address,caption,cite,code,dfn,em,strong,th,var {font-style:normal; font-weight:normal;}
q:before,q:after {content:'';}
abbr,acronym {border:0;}


/* common */
/* -------------------------------------------------------- */
html,body {font-variant-ligatures:none;}
html {font-size:62.5%;}
body {font-size:14px; font-size:1.4rem; font-family:"Noto Serif JP", serif; font-weight:500; color:#333; text-align:center; -webkit-text-size-adjust:100%; text-size-adjust:100%; background:none;}

h1, h2, h3, h4, h5, h6, h7 {font-weight:700; line-height:1.2;}
p, li, dt, dd, th, td, address, blockquote, div {line-height:1.6;}
input, select, option, textarea, button {font-size:14px; font-size:1.4rem; font-family:"Noto Serif JP", serif; font-weight:500; line-height:1.4; vertical-align:middle; color:inherit; outline:none;}
input[type='submit'],input[type='reset'],input[type='button'], button {color:inherit; cursor:pointer; -ms-appearance:none; -webkit-appearance:none; appearance:none;}
:placeholder-shown {color:#ccc;}
::-webkit-input-placeholder {color:#ccc;}
:-moz-placeholder {color:#ccc; opacity:1;}
::-moz-placeholder {color:#ccc; opacity:1;}
:-ms-input-placeholder {color:#ccc;}

strong {font-weight:bold;}
ol {list-style-type:decimal; margin-left:2.2em;}
img {max-width:100%; width:auto; height:auto; line-height:0; vertical-align:top; border:0; display:inline;}

a {color:#333; text-decoration:none;}
a:hover {color:#333; text-decoration:underline;}


/* decision */
/* -------------------------------------------------------- */
#bpCheck {display:none;}

body .pc {display:block;}
br.pc, span.pc, img.pc {display:inline;}
body .sp, br.sp, span.sp, img.sp {display:none;}

a.off {pointer-events:none; cursor:default; opacity:0.3;}
a[href^="tel:"] {pointer-events:none; cursor:default;}
body.mobile a[href^="tel:"] {pointer-events:auto; cursor:pointer;}

@media screen and (max-width:767px){
	#bpCheck {display:block;}

	body .pc, br.pc, span.pc, img.pc {display:none;}
	body .sp {display:block;}
	br.sp, span.sp, img.sp {display:inline;}
}


/* container */
/* -------------------------------------------------------- */
#container {width:100%; overflow:hidden;}


/* header */
/* -------------------------------------------------------- */
#header {padding:140px 0 100px 0;}
#header .ttl {text-align:left;}
#header .ttl .en {font-size:5.4rem; line-height:1; color:#b3b3b3; display:block;}
#header .ttl .jp {font-size:2.8rem; line-height:1; margin:1.0em 0 0 0; display:block;}
#header .mv {width:100%; margin:50px 0 0 0; padding:66% 0 0 0; position:relative;}
#header .mv img {width:100%; height:100%; object-fit:cover; display:block; position:absolute; top:0; left:0;}
#header .ttl.parallax .en {opacity:0; transform:translate3d(0,-15px,0);}
#header .ttl.parallax.on .en {opacity:1; transform:translate3d(0,0,0); transition:opacity 0.6s 0.3s ease, transform 0.6s 0.3s ease;}
#header .ttl.parallax .jp {opacity:0; transform:translate3d(0,15px,0);}
#header .ttl.parallax.on .jp {opacity:1; transform:translate3d(0,0,0); transition:opacity 0.6s 0.3s ease, transform 0.6s 0.3s ease;}
#header .mv.parallax {opacity:0; transform:translate3d(0,15px,0);}
#header .mv.parallax.on {opacity:1; transform:translate3d(0,0,0); transition:opacity 0.6s 0.6s ease, transform 0.6s 0.6s ease;}

#gNavBtn {width:40px; height:40px; position:fixed; top:15px; right:15px; z-index:101; cursor:pointer; display:block;}
#gNavBtn > span {width:100%; height:2px; margin:-1px 0 0 0; background-color:rgba(0,0,0,1); display:block; position:absolute; top:50%; left:0; transition-property:background-color;}
#gNavBtn > span::before,
#gNavBtn > span::after {content:''; width:100%; height:2px; background-color:rgba(0,0,0,1); display:block; position:absolute; left:0;}
#gNavBtn > span::before {top:-12px; transition-property:top;}
#gNavBtn > span::after {bottom:-12px; transition-property:bottom;}
body.load #gNavBtn,
body.load #gNavBtn > span::before,
body.load #gNavBtn > span::after {transition-duration:0.3s; transition-delay:0s; transition-timing-function:ease;}

#gNav {width:100%; height:100vh; background-color:rgba(0,0,0,0.75); display:flex; justify-content:center; align-items:center; position:fixed; top:0; left:0; z-index:100; overflow:hidden; pointer-events:none; opacity:0; transition:opacity 0.6s ease;}
#gNavCheck:checked + #head #gNav {opacity:1; pointer-events:auto;}
#gNavCheck {display:none;}
#gNavCheck:checked + #head #gNavBtn > span {background-color:rgba(255,255,255,0);}
#gNavCheck:checked + #head #gNavBtn > span::before {background-color:rgba(255,255,255,1); top:0; transform:rotate(45deg); transition-property:transform;}
#gNavCheck:checked + #head #gNavBtn > span::after {background-color:rgba(255,255,255,1); bottom:0; transform:rotate(-45deg); transition-property:transform;}
#gNav > div {width:100%; max-height:100vh; padding:50px 0; box-sizing:border-box; overflow:auto;}
#gNav .logo {width:172px; margin:0 auto;}
#gNav .nav {text-align:center; color:#fff; margin:30px 0 0 0;}
#gNav .nav li {font-size:2.0rem; line-height:1.2; margin:1em 0 0 0;}
#gNav .nav a {letter-spacing:0.2em; text-decoration:none; color:#fff; transition:opacity 0.3s ease;}
#gNav .nav a:hover {opacity:0.7;}
#gNav .sns {text-align:center; margin:20px 0 0 0;}
#gNav .sns > div {padding:20px 0 0 0;}
#gNav .sns a {width:32px; height:32px; margin:0 auto; background-color:#fff; border-radius:100%; display:flex; justify-content:center; align-items:center; transition:opacity 0.3s ease;}
#gNav .sns a:hover {opacity:0.7;}
#gNav .sns a img {display:block;}

@media screen and (max-width:767px){
	#header {padding:50px 0;}
	#header .ttl .en {font-size:4.2rem;}
	#header .ttl .jp {font-size:2.2rem;}
	#header .mv {margin:30px 0 0 0;}
	
	#gNav > div {padding:30px 0;}
	#gNav .logo {width:160px;}
	#gNav .nav {text-align:center; color:#fff; margin:10px 0 0 0;}
	#gNav .nav li {font-size:1.8rem; margin:0.6em 0 0 0;}
	#gNav .sns {margin:10px 0 0 0;}
	#gNav .sns > div {padding:10px 0 0 0;}
}


/* footer */
/* -------------------------------------------------------- */
#footer {padding:200px 0 40px 0;}
#footer .sec {max-width:1200px;}
#footer .clm {display:flex; flex-wrap:wrap;}
#footer .logo a {max-width:176px; display:block; transition:opacity 0.3s ease;}
#footer .logo a:hover {opacity:0.7;}
#footer .nav {display:flex; justify-content:center; flex:1;}
#footer .nav ul {padding:0 3em;}
#footer .nav li {font-size:1.7rem; font-weight:900; padding:0 0 0.2em 0;}
#footer .sns {display:flex; flex-wrap:wrap; justify-content:center;}
#footer .sns > div {padding:0 10px;}
#footer .sns img {width:40px; display:block;}
#footer .copy {width:100%; font-family:"Noto Sans JP", sans-serif; font-size:1.5rem; font-weight:400; text-align:left; margin:60px 0 0 0;}
#pagetop-btn {position:fixed; bottom:15px; right:30px; z-index:10; opacity:0; transition:bottom 0.6s ease, opacity 0.6s ease; pointer-events:none;}
#pagetop-btn a {width:72px; height:72px; background-color:rgba(255,255,255,0.5); border-radius:100%; box-sizing:border-box; display:flex; justify-content:center; align-items:center; position:relative; transition:opacity 0.3s ease;}
#pagetop-btn a:hover {opacity:0.7;}
#pagetop-btn a svg {width:50%; height:50%; display:block;}
body.move #pagetop-btn {bottom:30px; opacity:1; pointer-events:auto;}

@media screen and (max-width:767px){
	#footer {padding:100px 0 20px 0;}
	#footer .clm {display:block;}
	#footer .logo {text-align:center;}
	#footer .logo a {margin:0 auto;}
	#footer .nav {margin:20px 0 0 0; display:block;}
	#footer .nav ul {padding:0;}
	#footer .nav li {font-size:1.6rem; text-align:center; padding:0 0 0.2em 0;}
	#footer .sns {margin:20px 0 0 0;}
	#footer .copy {font-size:1.2rem; text-align:center; margin:30px 0 0 0;}
	#pagetop-btn {bottom:0; right:5px;}
	#pagetop-btn a {width:40px; height:40px;}
	body.move #pagetop-btn {bottom:5px;}
}


/* contents */
/* -------------------------------------------------------- */
.sec {max-width:1000px; text-align:left; margin:0 auto; padding:0 10px; box-sizing:border-box;}

#loading-layer {width:100%; height:100%; background-color:rgba(255,255,255,0.8); display:block; position:fixed; top:0; left:0; opacity:0; pointer-events:none; z-index:9999; transition:opacity 0.3s ease;}
#loading-layer svg {width:60px; height:60px; margin:-30px 0 0 -30px; display:block; position:absolute; top:50%; left:50%;}
body.loading #loading-layer {opacity:1; pointer-events:auto;}
body.loading #loading-layer svg {animation:loading 2s linear 0s infinite normal none;}
@keyframes loading {
	0% {transform:rotate(0deg);}
	100% {transform:rotate(360deg);}
}

@media screen and (max-width:767px){
	.sec {padding:0 4.0vw;}
}

.mult-clm {margin:-5px -0.5em 0 -0.5em; display:flex; flex-wrap:wrap; align-items:center;}
.mult-clm.center {justify-content:center;}
.mult-clm + .mult-clm {margin-top:0;}
.mult-clm > div {margin:0; padding:5px 0.5em 0 0.5em; display:flex; align-items:center;}
.mult-clm > div > div {padding:0 0 0 0.2em;}
.mult-clm > dl {padding:5px 0.5em 0 0.5em; display:flex; align-items:center;}
.mult-clm > dl > dt {font-size:80%; line-height:1.2; white-space:nowrap;}
.mult-clm > dl > dd {padding:0 0 0 0.2em;}
.mult-clm input {width:100%;}

/* top */
.top-mv-sec {width:100%; height:100vh; padding:0 5.0vw; box-sizing:border-box; display:flex; justify-content:center; align-items:center; position:relative;}
.top-mv-sec > div {text-align:center;}
.top-mv-sec .logo {width:430px; height:140px; margin:0 auto; position:relative;}
.top-mv-sec .logo img {width:100%; height:auto; display:block;}
.top-mv-sec .logo > div {width:100%; position:absolute; top:0; left:0;}
.top-mv-sec .logo .mark1 {opacity:0; transform:scale3d(1.1,1.1,1); transform-origin:15.5% 50%;}
.top-mv-sec .logo .mark2 {opacity:0; transform:scale3d(0.9,0.9,1); filter:blur(3px); transform-origin:15.5% 50%;}
.top-mv-sec .logo .type1 {opacity:0; transform:translate3d(0,-5px,0);}
.top-mv-sec .logo .type2 {opacity:0; transform:translate3d(0,5px,0);}
.top-mv-sec .catch {font-size:1.8rem; line-height:1.9; text-align:center; margin:5em 0 0 0;}
.top-mv-sec .catch > div {opacity:0; transform:translate3d(0,10px,0);}
.top-mv-sec .scrolldown {width:100%; position:absolute; bottom:0; left:0; animation:arrowmove 1s ease-in-out infinite; opacity:0;}
.top-mv-sec .scrolldown a {margin:0 auto; display:inline-block; transition:opacity 0.3s ease;}
.top-mv-sec .scrolldown a:hover {opacity:0.7;}
body.load .top-mv-sec .logo .mark1 {opacity:1; transform:scale3d(1,1,1); transition:opacity 2.0s 2.0s ease, transform 3.0s 2.0s ease;}
body.load .top-mv-sec .logo .mark2 {opacity:1; transform:scale3d(1,1,1); filter:blur(0); transition:opacity 2.0s 1.0s ease, transform 3.0s 1.0s ease, filter 3.0s 1.0s ease;}
body.load .top-mv-sec .logo .type1 {opacity:1; transform:translate3d(0,0,0); transition:opacity 2.0s 4.5s ease, transform 2.0s 4.5s ease;}
body.load .top-mv-sec .logo .type2 {opacity:1; transform:translate3d(0,0,0); transition:opacity 2.0s 4.5s ease, transform 2.0s 4.5s ease;}
body.load .top-mv-sec .catch > div:nth-of-type(1) {opacity:1; transform:translate3d(0,0,0); transition:opacity 1.0s 6.0s ease, transform 1.0s 6.0s ease;}
body.load .top-mv-sec .catch > div:nth-of-type(2) {opacity:1; transform:translate3d(0,0,0); transition:opacity 1.0s 6.3s ease, transform 1.0s 6.3s ease;}
body.load .top-mv-sec .catch > div:nth-of-type(3) {opacity:1; transform:translate3d(0,0,0); transition:opacity 1.0s 6.6s ease, transform 1.0s 6.6s ease;}
body.load .top-mv-sec .catch > div:nth-of-type(4) {opacity:1; transform:translate3d(0,0,0); transition:opacity 1.0s 6.9s ease, transform 1.0s 6.9s ease;}
body.load .top-mv-sec .catch > div:nth-of-type(5) {opacity:1; transform:translate3d(0,0,0); transition:opacity 1.0s 7.2s ease, transform 1.0s 7.2s ease;}
body.load .top-mv-sec .scrolldown {opacity:1; transition:opacity 1.0s 8.0s ease;}
@keyframes arrowmove{
	0%{bottom:0;}
	50%{bottom:2%;}
	100%{bottom:0;}
}

.top-catch-sec {padding:50px 0 0 0;}
.top-catch-sec a {text-decoration:none;}
.top-catch-sec .clm > div > div {text-align:center; display:inline-block;}
.top-catch-sec .clm > div:nth-of-type(1) {text-align:left;}
.top-catch-sec .clm > div:nth-of-type(2) {text-align:right;}
.top-catch-sec .clm > div:nth-of-type(2) > div {margin:0 0 0 auto;}
.top-catch-sec .clm > div:nth-of-type(3) {text-align:left; margin:15px 0 0 0;}
.top-catch-sec .clm > div:nth-of-type(4) {text-align:right;}
.top-catch-sec .clm > div:nth-of-type(4) .txt1 {margin:1.5em 0 0 0;}
.top-catch-sec .clm > div:nth-of-type(4) > div {margin:0 0 0 auto;}
.top-catch-sec .clm > div:nth-of-type(5) {margin:0 0 0 12%;}
.top-catch-sec .clm > div:nth-of-type(5) .txt1 {margin:1.5em 0 0 0;}
.top-catch-sec .clm > div:nth-of-type(6) {margin:200px 0 0 0;}
.top-catch-sec .clm > div:nth-of-type(6) > div {display:block;}
.top-catch-sec .clm1 {margin:50px 0 0 0; padding:50px 0; background-color:#eee; position:relative;}
.top-catch-sec .clm1::before {content:''; width:100%; height:100%; background:url(../img/top_bg_01.png) center center no-repeat; background-size:800px auto; display:block; position:absolute; top:0; left:0; opacity:0.2;}
.top-catch-sec .clm1 .sec {position:relative; z-index:10;}
.top-catch-sec .txt1 {font-size:3.8rem; line-height:1; color:#b3b3b3;}
.top-catch-sec .txt2 {font-size:3.5rem; line-height:1.2; margin:0.5em 0 0 0;}
.top-catch-sec .txt3 {font-size:1.7rem; line-height:1.8; margin:1.0em 0 0 0;}
.top-catch-sec .txt4 {text-align:center;}
.top-catch-sec .txt4 dt {font-size:4.6rem; line-height:1.2; padding:0 0 1em 0;}
.top-catch-sec .txt4 dd {font-size:1.8rem; line-height:2.5;}
.top-catch-sec .img1 {max-width:600px; width:100%; margin:20px 0 0 0; display:flex; justify-content:center; align-items:center;}
.top-catch-sec .img1 > div {padding:1px; box-sizing:border-box; flex:1;}
.top-catch-sec .parallax .txt1 {opacity:0; transform:translate3d(0,15px,0);}
.top-catch-sec .parallax.on .txt1 {opacity:1; transform:translate3d(0,0,0); transition:opacity 0.6s 0.3s ease, transform 0.6s 0.3s ease;}
.top-catch-sec .parallax .txt2 {opacity:0; transform:translate3d(0,15px,0);}
.top-catch-sec .parallax.on .txt2 {opacity:1; transform:translate3d(0,0,0); transition:opacity 0.6s 0.6s ease, transform 0.6s 0.6s ease;}
.top-catch-sec .parallax .txt3 {opacity:0; transform:translate3d(0,15px,0);}
.top-catch-sec .parallax.on .txt3 {opacity:1; transform:translate3d(0,0,0); transition:opacity 0.6s 0.9s ease, transform 0.6s 0.9s ease;}
.top-catch-sec .parallax .txt4 dt,
.top-catch-sec .parallax .txt4 dd {opacity:0; transform:translate3d(0,15px,0);}
.top-catch-sec .parallax.on .txt4 dt,
.top-catch-sec .parallax.on .txt4 dd {opacity:1; transform:translate3d(0,0,0); transition:opacity 0.6s 0.3s ease, transform 0.6s 0.3s ease;}
.top-catch-sec .parallax.on .txt4 dd:nth-of-type(1) {transition-delay:0.6s, 0.6s;}
.top-catch-sec .parallax.on .txt4 dd:nth-of-type(2) {transition-delay:0.8s, 0.8s;}
.top-catch-sec .parallax.on .txt4 dd:nth-of-type(3) {transition-delay:1.0s, 1.0s;}
.top-catch-sec .parallax.on .txt4 dd:nth-of-type(4) {transition-delay:1.2s, 1.2s;}
.top-catch-sec .parallax.on .txt4 dd:nth-of-type(5) {transition-delay:1.4s, 1.4s;}
.top-catch-sec .parallax.on .txt4 dd:nth-of-type(6) {transition-delay:1.6s, 1.6s;}
.top-catch-sec .parallax.on .txt4 dd:nth-of-type(7) {transition-delay:1.8s, 1.8s;}
.top-catch-sec .parallax.on .txt4 dd:nth-of-type(8) {transition-delay:2.0s, 2.0s;}
.top-catch-sec .parallax .img1 {opacity:0; transform:translate3d(0,15px,0);}
.top-catch-sec .parallax.on .img1 {opacity:1; transform:translate3d(0,0,0); transition:opacity 0.6s 1.2s ease, transform 0.6s 1.2s ease;}

.top-contents-sec .sec {max-width:1180px;}
.top-contents-sec .clm1 {margin:120px 0 0 0; padding:60px 0; background-color:#eee;}
.top-contents-sec .ttl {font-size:3.8rem; color:#b3b3b3;}
.top-contents-sec .list1 {margin:0 -20px; display:flex; flex-wrap:wrap;}
.top-contents-sec .list1 > div {width:33.33%; padding:20px 20px 0 20px; box-sizing:border-box;}
.top-contents-sec .list1 a {text-decoration:none; display:block; transition:opacity 0.3s ease;}
.top-contents-sec .list1 a:hover {opacity:0.7;}
.top-contents-sec .list1 .img {width:100%; padding:61% 0 0 0; background-color:#ccc; position:relative;}
.top-contents-sec .list1 .img img {width:100%; height:100%; object-fit:cover; display:block; position:absolute; top:0; left:0;}
.top-contents-sec .list1 .img.noimage::before {content:''; width:100%; height:100%; background:url(../img/logo.png) center center no-repeat; background-size:60% auto; display:block; position:absolute; top:0; left:0;}
.top-contents-sec .list1 .date {font-size:1.6rem; font-weight:500; color:#fff; padding:0 0.5em; background-color:#000; box-sizing:border-box;}
.top-contents-sec .list1 dl {margin:0.5em 0 0 0;}
.top-contents-sec .list1 dt {font-size:1.8rem;}
.top-contents-sec .list1 dd {font-size:1.6rem; color:#808080; display:flex; flex-wrap:wrap;}
.top-contents-sec .list1 dd a {color:#808080; margin:0 1.0em 0 0; display:block;}
.top-contents-sec .list2 dl {margin:-1px 0 0 0; padding:1.5em 0; border-top:1px solid #808080; border-bottom:1px solid #808080; display:flex;}
.top-contents-sec .list2 dt {width:8em; font-size:1.8rem; font-weight:500; line-height:1.4;}
.top-contents-sec .list2 dd {font-size:1.8rem; font-weight:500; line-height:1.4; flex:1;}
.top-contents-sec .more a {font-size:1.8rem; text-decoration:none; padding:0 1.5em 0 0; display:inline-block; position:relative; transition:opacity 0.3s ease;}
.top-contents-sec .more a:hover {opacity:0.7;}
.top-contents-sec .more svg {width:10px; height:10px; margin:-5px 0 0 0; display:block; position:absolute; top:50%; right:0;}
.top-contents-sec .catch {padding:160px 0 0 0; display:flex; justify-content:space-between;}
.top-contents-sec .catch .img {width:42%;}
.top-contents-sec .catch .ctx {width:52%;}
.top-contents-sec .catch .ctx dl {text-align:left;}
.top-contents-sec .catch .ctx dt {font-size:3.0rem; line-height:1.7;}
.top-contents-sec .catch .ctx dd {font-size:2.0rem; line-height:1.7; margin:1.0em 0 0 0;}
.top-contents-sec .catch .ttl {font-size:4.8rem; margin:0.5em 0 0 0;}
.top-contents-sec .catch .more {margin:1.5em 0 0 0;}
.top-contents-sec .mhb {margin:120px 0 0 0;}
.top-contents-sec .event {margin:120px 0 0 0;}
.top-contents-sec .event .more {margin:1em 0 0 0; text-align:right;}
.top-contents-sec .news {display:flex; flex-wrap:wrap;}
.top-contents-sec .news .ttl {width:6em;}
.top-contents-sec .news .list2 {flex:1;}
.top-contents-sec .news .more {width:100%; margin:1.5em 0 0 0; text-align:right;}
.top-contents-sec .parallax {opacity:0; transform:translate3d(0,15px,0);}
.top-contents-sec .parallax.on {opacity:1; transform:translate3d(0,0,0); transition:opacity 0.6s 0.3s ease, transform 0.6s 0.3s ease;}

@media screen and (max-width:1000px){
	.top-mv-sec .catch {font-size:2.4vw;}
}
@media screen and (max-width:767px){
	.top-mv-sec .logo {width:56.0vw; height:18.2vw;}
	.top-mv-sec .catch {font-size:1.4rem; margin:3em -5.0vw 0 -5.0vw;}

	.top-catch-sec {padding:30px 0 0 0;}
	.top-catch-sec .clm > div:nth-of-type(1) {text-align:center;}
	.top-catch-sec .clm > div:nth-of-type(2) {text-align:center;}
	.top-catch-sec .clm > div:nth-of-type(3) {text-align:center; margin:0;}
	.top-catch-sec .clm > div:nth-of-type(4) {text-align:center;}
	.top-catch-sec .clm > div:nth-of-type(5) {text-align:center; margin:0;}
	.top-catch-sec .clm > div:nth-of-type(6) {margin:100px 0 0 0;}
	.top-catch-sec .clm1 {margin:30px 0 0 0; padding:30px 0;}
	.top-catch-sec .clm1::before {background-size:120% auto;}
	.top-catch-sec .txt1 {font-size:2.4rem; margin:1.5em 0 0 0;}
	.top-catch-sec .txt2 {font-size:2.0rem;}
	.top-catch-sec .txt3 {font-size:1.4rem;}
	.top-catch-sec .txt4 dt {font-size:2.6rem; line-height:1.4; padding:0 0 1em 0;}
	.top-catch-sec .txt4 dd {font-size:1.4rem; line-height:1.8;}
	.top-catch-sec .img1 {margin:10px 0 0 0;}

	.top-contents-sec .ttl {font-size:2.6rem;}
	.top-contents-sec .clm1 {margin:60px 0 0 0; padding:30px 0;}
	.top-contents-sec .list1 > div {width:100%;}
	.top-contents-sec .list1 .date {font-size:1.4rem;}
	.top-contents-sec .list1 dl {margin:0.2em 0 0 0;}
	.top-contents-sec .list1 dt {font-size:1.6rem;}
	.top-contents-sec .list1 dd {font-size:1.4rem;}
	.top-contents-sec .list2 {margin:15px 0 0 0;}
	.top-contents-sec .list2 dl {padding:1.0em 0; display:block;}
	.top-contents-sec .list2 dt {width:auto; font-size:1.4rem;}
	.top-contents-sec .list2 dd {font-size:1.6rem;}
	.top-contents-sec .more a {font-size:1.6rem; padding:0 1.2em 0 0;}
	.top-contents-sec .catch {padding:60px 0 0 0; display:block;}
	.top-contents-sec .catch .img {width:auto;}
	.top-contents-sec .catch .ctx {width:auto; margin:10px 0 0 0;}
	.top-contents-sec .catch .ctx dt {font-size:2.0rem;}
	.top-contents-sec .catch .ctx dd {font-size:1.6rem; margin:1.0em 0 0 0;}
	.top-contents-sec .catch .ttl {font-size:2.6rem; margin:1.0em 0 0 0;}
	.top-contents-sec .catch .more {margin:1.0em 0 0 0;}
	.top-contents-sec .mhb {margin:60px 0 0 0;}
	.top-contents-sec .event {margin:60px 0 0 0;}
	.top-contents-sec .news {display:block;}
	.top-contents-sec .news .ttl {width:auto;}
	.top-contents-sec .news .more {margin:1.0em 0 0 0;}
}

/* about */
.about-sec .clm1 {margin:120px 0 0 0;}
.about-sec .clm2 {margin:80px 0 0 0;}
.about-sec .clm3 {margin:0 -3px; display:flex; flex-wrap:wrap; justify-content:center; align-items:center;}
.about-sec .clm3 > div {width:33.33%; padding:3px; box-sizing:border-box;}
.about-sec .clm4 {margin:0;}
.about-sec .clm5 {padding:80px 0; background-color:#eee;}
.about-sec .txt1 {font-size:3.4rem;}
.about-sec .txt2 {padding:15px 0 0 0;}
.about-sec .txt2 dl {margin:40px 0 0 0;}
.about-sec .txt2 dt {font-size:1.9rem;}
.about-sec .txt2 dd {font-size:2.4rem; margin:0.2em 0 0 0;}
.about-sec .txt3 {font-size:1.8rem; font-weight:500; line-height:2.2; margin:1.5em 0 0 0 ;}
.about-sec .txt4 {padding:15px 0 0 0;}
.about-sec .txt4 dl {margin:30px 0 0 0;}
.about-sec .txt4 dt {font-size:2.4rem;}
.about-sec .txt4 dd {font-size:1.4rem; margin:0.2em 0 0 0;}
.about-sec .txt5 {margin:10px 0 0 0;}
.about-sec .txt5 dt {font-size:2.8rem; line-height:1.75;}
.about-sec .txt5 dd {font-size:1.8rem; font-weight:500; line-height:1.75; margin:0.3em 0 0 0;}
.about-sec .txt5 dd + dd {margin-top:1.5em;}
.about-sec .txt6 {margin:50px 0 0 0;}
.about-sec .txt6 dt {font-size:2.0rem; line-height:1.75;}
.about-sec .txt6 dd {font-size:1.8rem; font-weight:500; line-height:1.75; margin:0.3em 0 0 0;}
.about-sec .txt6 li {line-height:1.75; padding:0 0 0 1.0em; position:relative;}
.about-sec .txt6 li::before {content:'・'; display:block; position:absolute; top:0; left:0;}
.about-sec .txt7 {margin:60px 0 0 0;}
.about-sec .txt7 dl {padding:1.2em 0; border-bottom:solid 1px #000; display:flex;}
.about-sec .txt7 dt {width:12em; font-size:2.0rem; font-weight:700; line-height:1.75;}
.about-sec .txt7 dd {font-size:1.8rem; font-weight:500; line-height:1.75; flex:1;}
.about-sec .txt7 dd ul {list-style-type:disc; margin:0 0 0 1.5em;}
.about-sec .parallax {opacity:0; transform:translate3d(0,15px,0);}
.about-sec .parallax.on {opacity:1; transform:translate3d(0,0,0); transition:opacity 0.6s 0.3s ease, transform 0.6s 0.3s ease;}

@media screen and (max-width:767px){
	.about-sec .clm1 {margin:50px 0 0 0;}
	.about-sec .clm2 {margin:30px 0 0 0;}
	.about-sec .clm3 {margin:0 -2px;}
	.about-sec .clm3 > div {width:50%; padding:2px;}
	.about-sec .clm5 {padding:30px 0;}
	.about-sec .txt1 {font-size:2.4rem;}
	.about-sec .txt2 {padding:10px 0 0 0;}
	.about-sec .txt2 dl {margin:20px 0 0 0;}
	.about-sec .txt2 dt {font-size:1.4rem;}
	.about-sec .txt2 dd {font-size:2.0rem;}
	.about-sec .txt3 {font-size:1.6rem; line-height:1.8;}
	.about-sec .txt4 {padding:10px 0 0 0;}
	.about-sec .txt4 dl {margin:15px 0 0 0;}
	.about-sec .txt4 dt {font-size:1.8rem;}
	.about-sec .txt4 dd {font-size:1.2rem;}
	.about-sec .txt5 {margin:5px 0 0 0;}
	.about-sec .txt5 dt {font-size:2.0rem;}
	.about-sec .txt5 dd {font-size:1.6rem;}
	.about-sec .txt6 {margin:30px 0 0 0;}
	.about-sec .txt6 dt {font-size:1.6rem;}
	.about-sec .txt6 dd {font-size:1.6rem;}
	.about-sec .txt7 {margin:30px 0 0 0;}
	.about-sec .txt7 dl {display:block;}
	.about-sec .txt7 dt {width:auto; font-size:1.8rem;}
	.about-sec .txt7 dd {font-size:1.6rem;}
}

/* contact */
.contact-top-sec .txt1 {font-size:2.0rem; line-height:1.8;}
.contact-top-sec .btns {max-width:640px; margin:80px auto 0 auto;}
.contact-top-sec .btns > div {padding:40px 0 0 0;}
.contact-top-sec .btns a {height:60px; font-size:2.0rem; text-align:center; text-decoration:none; background-color:#fff; border:1px solid #808080; box-sizing:border-box; display:flex; justify-content:center; align-items:center; transition:background-color 0.3s ease;}
.contact-top-sec .btns a:hover {text-decoration:none; background-color:#eee;}
.contact-top-sec .parallax {opacity:0; transform:translate3d(0,15px,0);}
.contact-top-sec .parallax.on {opacity:1; transform:translate3d(0,0,0); transition:opacity 0.6s 0.3s ease, transform 0.6s 0.3s ease;}

.contact-sec .sec {max-width:900px;}
.contact-sec .form {display:block;}
.contact-sec .form > dl {margin:100px 0 0 0; padding:0.8em 0; border-bottom:solid 1px #333; display:flex; align-items:center;}
.contact-sec .form > dl + dl {margin-top:0;}
.contact-sec .form > .txt2 + dl {margin-top:0;}
.contact-sec .form > dl > dt {font-size:2.0rem; width:11em;}
.contact-sec .form > dl > dd {font-size:2.0rem; flex:1;}
.contact-sec .form > dl.type1 {align-items:flex-start;}
.contact-sec .form > dl.type1 > dt {padding-top:1.0em;}
.contact-sec .form input[type="text"],
.contact-sec .form input[type="tel"],
.contact-sec .form input[type="email"],
.contact-sec .form select,
.contact-sec .form textarea {width:100%; font-size:1.8rem; line-height:1; padding:1.0em 0.5em; background-color:#e6e6e6; border:1px solid transparent; box-sizing:border-box; outline:none; resize:none; transition:border 0.3s ease;}
.contact-sec .form textarea {height:300px; font-size:1.6rem; line-height:1.4;}
.contact-sec .form .erro-txt {font-size:1.8rem; color:#c00; margin:5px 0 0 0;}
.contact-sec .form input.inputCheck {display:none;}
.contact-sec .list1 label {font-size:1.8rem; display:flex; align-items:center;}
.contact-sec .list1 label input {margin-right:1em;}
.contact-sec .list2 {margin:0 0 0 -20px; display:flex; flex-wrap:wrap;}
.contact-sec .list2 label {font-size:1.8rem; padding:0 0 0 20px; display:flex; align-items:center;}
.contact-sec .list2 label input {margin-right:0.3em;}
.contact-sec .btns {margin:60px 0 0 0; display:flex; flex-wrap:wrap; justify-content:center;}
.contact-sec .btns > div {padding:20px 20px 0 0;}
.contact-sec .btns button {font-size:2.2rem; line-height:1; padding:0.7em 1.5em; background-color:#fff; border:1px solid #333; display:block; transition:background-color 0.3s ease;}
.contact-sec .btns button:hover {background-color:#e6e6e6;}
.contact-sec .txt1 {font-size:2.0rem; line-height:1.8;}
.contact-sec .txt2 {font-size:2.0rem; line-height:1.8; padding:1.5em 0; border-bottom:solid 1px #333;}
.contact-sec .txt2 ul > li {font-size:2.0rem; line-height:1.8; padding:0 0 0 1.1em; position:relative;}
.contact-sec .txt2 ul > li span {position:absolute; top:0; left:0;}
.contact-sec .parallax {opacity:0; transform:translate3d(0,15px,0);}
.contact-sec .parallax.on {opacity:1; transform:translate3d(0,0,0); transition:opacity 0.6s 0.3s ease, transform 0.6s 0.3s ease;}

@media screen and (max-width:767px){
	.contact-top-sec .txt1 {font-size:1.6rem;}
	.contact-top-sec .btns {margin:20px auto 0 auto;}
	.contact-top-sec .btns > div {padding:20px 0 0 0;}
	.contact-top-sec .btns a {height:40px; font-size:1.6rem;}

	.contact-sec .form > dl {margin:30px 0 0 0; padding:0.5em 0; display:block;}
	.contact-sec .form > dl + dl {margin-top:0;}
	.contact-sec .form > .txt2 + dl {margin-top:0;}
	.contact-sec .form > dl > dt {font-size:1.6rem; width:auto;}
	.contact-sec .form > dl.type1 > dt {padding-top:0;}
	.contact-sec .form input[type="text"],
	.contact-sec .form input[type="tel"],
	.contact-sec .form input[type="email"],
	.contact-sec .form select,
	.contact-sec .form textarea {font-size:1.6rem;}
	.contact-sec .form textarea {height:100px; font-size:1.6rem;}
	.contact-sec .form button {font-size:1.8rem;}
	.contact-sec .form .erro-txt {font-size:1.2rem;}
	.contact-sec .list1 label {font-size:1.6rem;}
	.contact-sec .list2 label {font-size:1.6rem;}
	.contact-sec .btns {margin:30px 0 0 0;}
	.contact-sec .btns > div {padding:10px 10px 0 0;}
	.contact-sec .txt1 {font-size:1.6rem; line-height:1.8;}
	.contact-sec .txt2 {font-size:1.6rem; line-height:1.8;}
	.contact-sec .txt2 ul > li {font-size:1.6rem; line-height:1.8;}
}

/* privacy-policy */
.privacy-policy-sec .clm1 {margin:120px 0 0 0;}
.privacy-policy-sec .txt1 {font-size:3.4rem;}
.privacy-policy-sec .txt2 {margin:30px 0 0 0;}
.privacy-policy-sec .txt2 li {font-size:1.8rem; font-weight:500; line-height:2.2; padding:0 0 0 2.0em; position:relative;}
.privacy-policy-sec .txt2 li span {position:absolute; top:0; left:0;}
.privacy-policy-sec .txt3 {font-size:1.8rem; font-weight:500; line-height:2.2; margin:1.5em 0 0 0 ;}
.privacy-policy-sec .parallax {opacity:0; transform:translate3d(0,15px,0);}
.privacy-policy-sec .parallax.on {opacity:1; transform:translate3d(0,0,0); transition:opacity 0.6s 0.3s ease, transform 0.6s 0.3s ease;}

@media screen and (max-width:767px){
	.privacy-policy-sec .clm1 {margin:50px 0 0 0;}
	.privacy-policy-sec .txt1 {font-size:2.4rem;}
	.privacy-policy-sec .txt2 {margin:15px 0 0 0;}
	.privacy-policy-sec .txt2 li {font-size:1.6rem;}
	.privacy-policy-sec .txt3 {font-size:1.6rem; line-height:1.8;}
}

/* brand */
.brand-sec .clm1 {margin:50px 0 0 0; padding:50px 0;}
.brand-sec .txt1 {font-size:2.0rem;}
.brand-sec .txt2 {max-width:850px;}
.brand-sec .txt2 dt {font-size:3.7rem;}
.brand-sec .txt2 dd {font-size:1.8rem; font-weight:500; margin:0.5em 0 0 0;}
.brand-sec .txt2 dd.img {margin:1.0em -3px 0 -3px; display:flex; position:relative;}
.brand-sec .txt2 dd.img > div {width:50%; padding:0 3px; box-sizing:border-box;}
.brand-sec .txt2 dd.img > div.logo {width:13%; padding:5px 0 0 0; position:absolute; top:100%; right:0;}
.brand-sec .parallax {opacity:0; transform:translate3d(0,15px,0);}
.brand-sec .parallax.on {opacity:1; transform:translate3d(0,0,0); transition:opacity 0.6s 0.3s ease, transform 0.6s 0.3s ease;}

@media screen and (max-width:767px){
	.brand-sec .clm1 {margin:30px 0 0 0; padding:30px 0;}
	.brand-sec .txt1 {font-size:1.6rem;}
	.brand-sec .txt2 dt {font-size:1.8rem;}
	.brand-sec .txt2 dd {font-size:1.4rem;}
	.brand-sec .txt2 dd.img {margin:1.0em -2px 0 -2px;}
	.brand-sec .txt2 dd.img > div {padding:0 2px;}
}





/* project */
.project-sec .clm1 {margin:100px 0 0 0; padding:80px 0; background-color:#eee;}
.project-sec .clm2 {margin:100px 0 0 0; padding:80px 0; background-color:#eee;}
.project-sec .clm3 {margin:100px 0 0 0; padding:80px 0; background-color:#eee;}
.project-sec .clm4 .txt2 {padding:1.0em 1.2em;}
.project-sec .clm4 dl:nth-of-type(odd) {color:#fff; background-color:#999;}
.project-sec .clm4 dl:nth-of-type(odd) a {color:#fff;}
.project-sec .clm4 dl:nth-of-type(even) {}
.project-sec .clm5 {margin:0 -15px; padding:0 0 20px 0; display:flex; flex-wrap:wrap;}
.project-sec .clm5 > div {width:25%; padding:20px 15px 0 15px; box-sizing:border-box;}
.project-sec .clm5 .img {max-width:180px; width:100%; margin:0 auto; padding:/*66%*/0 0 0 0; background-color:rgba(255,255,255,0.5); position:relative;}
/* .project-sec .clm5 .img.cs::before {content:'coming soon'; width:100%; height:100%; font-size:1.6rem; line-height:1.1; text-align:center; display:flex; justify-content:center; align-items:center; position:absolute; top:0; left:0;} */
.project-sec .clm5 .img.cs.s1::before {content: '理想の家づくりを形に';  position: absolute;  top: 55%;  left: 50%;  transform: translate(-50%, -50%);  font-size: 1.2rem; text-align: center; color: #000;  font-family: "Yu Mincho", "游明朝", serif; white-space: nowrap; pointer-events: none;}
.project-sec .clm5 .img.cs.s1::after {  content: 'こちらをクリック';  position: absolute;  top: 65%;  left: 50%;  transform: translate(-50%, -50%); color: #000;  font-family: "Yu Mincho", "游明朝", serif; font-size: 0.9rem; text-align: center; pointer-events: none;}
.project-sec .clm5 .img.cs.s2::before {content: 'あなたの家づくりのタイプは？';  position: absolute;  top: 55%;  left: 50%;  transform: translate(-50%, -50%);  font-size: 1.2rem; text-align: center; color: #000;  font-family: "Yu Mincho", "游明朝", serif; white-space: nowrap; pointer-events: none;}
.project-sec .clm5 .img.cs.s2::after {  content: 'こちらをクリック';  position: absolute;  top: 65%;  left: 50%;  transform: translate(-50%, -50%); color: #000;  font-family: "Yu Mincho", "游明朝", serif; font-size: 0.9rem; text-align: center; pointer-events: none;}
.project-sec .clm5 .img.cs.s3::before {content: '予算の見える化で安心';  position: absolute;  top: 55%;  left: 50%;  transform: translate(-50%, -50%);  font-size: 1.2rem; text-align: center; color: #000;  font-family: "Yu Mincho", "游明朝", serif; white-space: nowrap; pointer-events: none;}
.project-sec .clm5 .img.cs.s3:after {  content: 'こちらをクリック';  position: absolute;  top: 65%;  left: 50%;  transform: translate(-50%, -50%); color: #000;  font-family: "Yu Mincho", "游明朝", serif; font-size: 0.9rem; text-align: center; pointer-events: none;}
.project-sec .clm5 .img.cs.s4::before {content: '未来のお金をシミュレーション';  position: absolute;  top: 55%;  left: 50%;  transform: translate(-50%, -50%);  font-size: 1.2rem; text-align: center; color: #000;  font-family: "Yu Mincho", "游明朝", serif; white-space: nowrap; pointer-events: none;}
.project-sec .clm5 .img.cs.s4::after {  content: 'こちらをクリック';  position: absolute;  top: 65%;  left: 50%;  transform: translate(-50%, -50%); color: #000;  font-family: "Yu Mincho", "游明朝", serif; font-size: 0.9rem; text-align: center; pointer-events: none;}
.project-sec .clm5 .txt {font-size:1.4rem; line-height:1.2; text-align:center; margin:0.5em 0 0 0;}
.project-sec .txt1 {font-size:2.0rem;}
.project-sec .txtsmall {font-size:1.0rem; line-height:1.0; text-align:center; margin:0.5em 0 0 0;}
.project-sec .txt2 {margin:60px 0 0 0;}
.project-sec .txt2 dt {display:flex; align-items:center;}
.project-sec .txt2 dt span:nth-of-type(1) {font-size:2.8rem; line-height:1; color:#fff; padding:0 0.3em 0.1em 0.3em; background-color:#000; display:block;}
.project-sec .txt2 dt span:nth-of-type(2) {font-size:1.6rem; margin:0 0 0 1.0em;}
.project-sec .txt2 dd {font-size:1.8rem; font-weight:500; margin:0.8em 0 0 0;}
.project-sec .txt3 {text-align:left;}
.project-sec .txt3 dt {font-size:4.2rem;}
.project-sec .txt3 dd {font-size:1.8rem; font-weight:500; line-height:1.8; margin:0.5em 0 0 0;}
.project-sec .txt4 {margin:50px 0 0 0;}
.project-sec .txt4 dl {font-size:1.6rem; text-align:left; padding:1.2em 1.0em; border-bottom:solid 1px #999; box-sizing:border-box; display:flex;}
.project-sec .txt4 dl:nth-of-type(odd) {color:#fff; background-color:#999;}
.project-sec .txt4 dl:nth-of-type(even) {}
.project-sec .txt4 dt {width:15em; font-size:1.8rem; font-weight:700;}
.project-sec .txt4 dd {font-size:1.6rem; flex:1;}
.project-sec .txt4 + .txt3 {margin-top:150px;}
.project-sec .parallax {opacity:0; transform:translate3d(0,15px,0);}
.project-sec .parallax.on {opacity:1; transform:translate3d(0,0,0); transition:opacity 0.6s 0.3s ease, transform 0.6s 0.3s ease;}

@media screen and (max-width:767px){
	.project-sec .clm1 {margin:50px 0 0 0;}
	.project-sec .clm2 {margin:50px 0 0 0;}
	.project-sec .clm3 {margin:50px 0 0 0;}
	.project-sec .clm5 {margin:0 -5px;}
	.project-sec .clm5 > div {width:50%; padding:5px 5px 0 5px;}
	/* .project-sec .clm5 .img.cs::before {font-size:1.4rem;} */
	.project-sec .clm5 .txt {font-size:1.4rem;}
	.project-sec .txtsmall {font-size:1.2rem;}
	.project-sec .txt1 {font-size:1.6rem;}
	.project-sec .txt2 {margin:30px 0 0 0;}
	.project-sec .txt2 dt {display:block;}
	.project-sec .txt2 dt span:nth-of-type(1) {font-size:2.0rem; display:inline-block;}
	.project-sec .txt2 dt span:nth-of-type(2) {font-size:1.2rem; margin:0.2em 0 0 0; display:block;}
	.project-sec .txt2 dd {font-size:1.4rem;}
	.project-sec .txt3 dt {font-size:2.8rem;}
	.project-sec .txt3 dd {font-size:1.6rem;}
	.project-sec .txt4 {margin:30px 0 0 0;}
	.project-sec .txt4 dl {font-size:1.4rem; display:block;}
	.project-sec .txt4 dt {width:auto; font-size:1.6rem;}
	.project-sec .txt4 dd {font-size:1.4rem; margin:0.2em 0 0 0;}
	.project-sec .txt4 + .txt3 {margin-top:100px;}
}

/* scroll-img-sec */
.scroll-img-sec {width:100%; height:200px; position:relative; overflow:hidden;}
.scroll-img-sec.parallax {opacity:0;}
.scroll-img-sec.parallax.on {opacity:1; transition:opacity 0.6s 0.3s ease;}
.scroll-img-sec > div {width:3600px; height:100%; display:flex; position:absolute; top:0; left:0; animation:scrollImg 50.0s linear 0s infinite normal none;}
.scroll-img-sec > div > div {flex:1;}
@keyframes scrollImg {
	0% {transform:translate3d(-50%,0,0);}
	100% {transform:translate3d(0,0,0);}
}

/* showroom */
.showroom-sec .clm1 {margin:0 -20px; display:flex; flex-wrap:wrap;}
.showroom-sec .clm1 > div {width:50%; padding:50px 20px 0 20px; box-sizing:border-box;}
.showroom-sec .clm1 .img {position:relative;}
.showroom-sec .clm1 .img a {text-decoration:none; display:block; transition:opacity 0.3s ease;}
.showroom-sec .clm1 .img a:hover {opacity:0.7;}
.showroom-sec .clm1 .img .cap {font-size:2.0rem; color:#fff; padding:0 0.5em; background-color:#000; box-sizing:border-box; position:absolute; top:0; left:0;}
.showroom-sec .clm1 .img .cf {font-size:1.4rem; position:absolute; bottom:0.5em; right:1.0em;}
.showroom-sec .clm1 dt {font-size:2.2rem; margin:0.8em 0 0 0;}
.showroom-sec .clm1 dd {font-size:2.0rem; margin:0.5em 0 0 0;}
.showroom-sec .clm1 dd.link {text-align:right; margin:0;}
.showroom-sec .clm1 dd.more a {font-size:1.8rem; text-decoration:none; padding:0 1.5em 0 0; display:inline-block; position:relative; transition:opacity 0.3s ease;}
.showroom-sec .clm1 dd.more a:hover {opacity:0.7;}
.showroom-sec .clm1 dd.more svg {width:10px; height:10px; margin:-5px 0 0 0; display:block; position:absolute; top:50%; right:0;}
.showroom-sec .catch .img {margin:60px 0 0 0; position:relative;}
.showroom-sec .catch .img a {display:block; position:absolute;}
.showroom-sec .catch .img img {width:100%;}
.showroom-sec .catch .txt dt {font-size:3.2rem;}
.showroom-sec .catch .txt dd {font-size:2.0rem; line-height:1.8; margin:1.5em 0 0 0;}
.showroom-sec .catch-mhb dl + dl dt {margin-top:3.0em;}
.showroom-sec .catch-mhb dt {font-size:3.2rem; line-height:1.8;}
.showroom-sec .catch-mhb dd {font-size:2.0rem; line-height:1.8; margin:2.0em 0 0 0;}
.showroom-sec .catch-mhb .map {text-align:center; margin:160px 0 0 0;}
.showroom-sec .catch-mhb .map > div {display:inline-block; position:relative;}
.showroom-sec .catch-mhb .map a {display:block; position:absolute;}
.showroom-sec .pickup {margin:160px 0 0 0;}
.showroom-sec .pickup .ttl {font-size:3.6rem;}
.showroom-sec .reservation {margin:160px 0 0 0;}
.showroom-sec .reservation .ttl {font-size:4.0rem; color:#b3b3b3;}
.showroom-sec .reservation .ttl span {font-size:2.0rem; line-height:1; color:#333; margin:1.0em 0 0 0; display:block;}
.showroom-sec .reservation .txt {font-size:2.0rem; text-align:left; margin:60px 0 0 0;}
.showroom-sec .reservation .btn {max-width:640px; margin:60px auto 0 auto;}
.showroom-sec .reservation .btn a {height:60px; font-size:2.0rem; text-align:center; text-decoration:none; background-color:#fff; border:1px solid #808080; box-sizing:border-box; display:flex; justify-content:center; align-items:center; transition:background-color 0.3s ease;}
.showroom-sec .reservation .btn a:hover {text-decoration:none; background-color:#eee;}
.showroom-sec .mhb {margin:160px 0 0 0;}
.showroom-sec .mhb .ttl {font-size:4.0rem; color:#b3b3b3;}
.showroom-sec .location {margin:100px 0 0 0;}
.showroom-sec .location .ttl {font-size:3.4rem; font-weight:500;}
.showroom-sec .location .clm {margin:30px 0 0 0; display:flex; justify-content:space-between;}
.showroom-sec .location .clm .img {width:38%;}
.showroom-sec .location .clm .txt {width:56%; font-size:2.2rem; font-weight:500;}
.showroom-sec .location .map {width:100%; height:300px; margin:30px 0 0 0; overflow:hidden;}
.showroom-sec .location .map iframe {width:100%; height:100%;}
.showroom-sec .parallax {opacity:0; transform:translate3d(0,15px,0);}
.showroom-sec .parallax.on {opacity:1; transform:translate3d(0,0,0); transition:opacity 0.6s 0.3s ease, transform 0.6s 0.3s ease;}
@media screen and (max-width:767px){
	.showroom-sec .clm1 > div {width:100%; padding-top:30px;}
	.showroom-sec .clm1 .img .cap {font-size:1.6rem;}
	.showroom-sec .clm1 .img .cf {font-size:1.2rem;}
	.showroom-sec .clm1 dt {font-size:1.6rem; margin:0.5em 0 0 0;}
	.showroom-sec .clm1 dd {font-size:1.4rem; margin:0.3em 0 0 0;}
	.showroom-sec .clm1 dd.link {margin:0;}
	.showroom-sec .clm1 dd.more a {font-size:1.6rem; padding:0 1.2em 0 0;}
	.showroom-sec .catch .txt dt {font-size:2.0rem;}
	.showroom-sec .catch .txt dd {font-size:1.6rem;}
	.showroom-sec .catch-mhb dl + dl dt {margin-top:2.0em;}
	.showroom-sec .catch-mhb dt {font-size:1.8rem;}
	.showroom-sec .catch-mhb dd {font-size:1.6rem; margin:1.0em 0 0 0;}
	.showroom-sec .catch-mhb .map {margin:30px 0 0 0;}
	.showroom-sec .pickup {margin:60px 0 0 0;}
	.showroom-sec .pickup .ttl {font-size:2.4rem;}
	.showroom-sec .reservation {margin:60px 0 0 0;}
	.showroom-sec .reservation .ttl {font-size:2.4rem;}
	.showroom-sec .reservation .ttl span {font-size:1.6rem;}
	.showroom-sec .reservation .txt {font-size:1.6rem; margin:30px 0 0 0;}
	.showroom-sec .reservation .btn {max-width:640px; margin:30px auto 0 auto;}
	.showroom-sec .reservation .btn a {height:40px; font-size:1.6rem;}
	.showroom-sec .mhb {margin:60px 0 0 0;}
	.showroom-sec .mhb .ttl {font-size:2.4rem;}
	.showroom-sec .location {margin:50px 0 0 0;}
	.showroom-sec .location .ttl {font-size:2.4rem;}
	.showroom-sec .location .clm {margin:15px 0 0 0; display:block;}
	.showroom-sec .location .clm .img {width:auto;}
	.showroom-sec .location .clm .txt {width:auto; font-size:1.6rem; margin:1.5em 0 0 0;}
	.showroom-sec .location .map {margin:15px 0 0 0;}
}

/* news */
.news-sec .clm {display:flex; justify-content:space-between;}
.news-sec .clm .main {padding:0 60px 0 0; box-sizing:border-box; flex:1; order:1;}
.news-sec .clm .side {width:220px; order:2;}
.news-sec .clm .side dl + dl {margin-top:120px;}
.news-sec .clm .side dt {font-size:2.8rem; border-bottom:solid 1px #000;}
.news-sec .clm .side dd {font-size:2.0rem; margin:0.8em 0 0 0;}
.news-sec .clm .list > div {margin:-1px 0 0 0; padding:1.2em 0; border-top:solid 1px #808080; border-bottom:solid 1px #808080;}
.news-sec .clm .box {text-decoration:none; display:flex; flex-wrap:wrap; align-items:center; transition:opacity 0.3s ease;}
.news-sec .clm .box:hover {opacity:0.7;}
.news-sec .clm .box .img {width:200px; height:140px; border:1px solid #808080; box-sizing:border-box; position:relative;}
.news-sec .clm .box .img.noimage::before {content:''; width:100%; height:100%; background:url(../img/logo.png) center center no-repeat; background-size:60% auto; display:block; position:absolute; top:0; left:0;}
.news-sec .clm .box .ctx {padding:0 0 0 50px; box-sizing:border-box; flex:1;}
.news-sec .clm .box .ctx dt {display:flex; flex-wrap:wrap; align-items:center;}
.news-sec .clm .box .ctx dt .date {font-size:2.0rem; display:block;}
.news-sec .clm .box .ctx dt .tag {font-size:2.0rem; line-height:1; color:#fff; margin:0 0 0 1.5em; padding:0.2em 0.5em; background-color:#000; display:block;}
.news-sec .clm .box .ctx dd {font-size:2.0rem; margin:0.2em 0 0 0;}
.news-sec .txt1 {font-size:2.0rem;}
.news-sec .txt2 {max-width:850px; margin:100px 0 0 0;}
.news-sec .txt2 dt {font-size:2.7rem;}
.news-sec .txt2 dd {font-size:1.8rem; font-weight:500; margin:0.5em 0 0 0;}
.news-sec .txt2 dd.img {margin:1.0em -3px 0 -3px; display:flex; position:relative;}
.news-sec .txt2 dd.img > div {width:50%; padding:0 3px; box-sizing:border-box;}
.news-sec .txt2 dd.img > div.logo {width:13%; padding:5px 0 0 0; position:absolute; top:100%; right:0;}
.news-sec .parallax {opacity:0; transform:translate3d(0,15px,0);}
.news-sec .parallax.on {opacity:1; transform:translate3d(0,0,0); transition:opacity 0.6s 0.3s ease, transform 0.6s 0.3s ease;}

@media screen and (max-width:767px){
	.news-sec .clm {display:block;}
	.news-sec .clm .main {margin:30px 0 0 0; padding:0;}
	.news-sec .clm .side {width:auto;}
	.news-sec .clm .side dl {margin:0 -5px; display:flex; flex-wrap:wrap;}
	.news-sec .clm .side dl + dl {margin-top:15px;}
	.news-sec .clm .side dt {width:100%; font-size:1.6rem; padding:0 5px; box-sizing:border-box;}
	.news-sec .clm .side dd {font-size:1.4rem; margin:0.2em 0 0 0; padding:0 5px; box-sizing:border-box;}
	.news-sec .clm .list > div {padding:0.6em 0;}
	.news-sec .clm .box .img {width:100px; height:70px;}
	.news-sec .clm .box .ctx {padding:0 0 0 10px;}
	.news-sec .clm .box .ctx dt .date {font-size:1.4rem;}
	.news-sec .clm .box .ctx dt .tag {font-size:1.2rem; margin:0 0 0 1.0em;}
	.news-sec .clm .box .ctx dd {font-size:1.6rem; margin:0.2em 0 0 0;}
	.news-sec .txt1 {font-size:1.6rem;}
	.news-sec .txt2 {margin:50px 0 0 0;}
	.news-sec .txt2 dt {font-size:1.8rem;}
	.news-sec .txt2 dd {font-size:1.2rem;}
	.news-sec .txt2 dd.img {margin:1.0em -2px 0 -2px;}
	.news-sec .txt2 dd.img > div {padding:0 2px;}
}

/* event */
.event-sec .list {margin:0 -20px; display:flex; flex-wrap:wrap;}
.event-sec .list > div {width:33.33%; padding:20px 20px 0 20px; box-sizing:border-box;}
.event-sec .list a {text-decoration:none; display:block; transition:opacity 0.3s ease;}
.event-sec .list a:hover {opacity:0.7;}
.event-sec .list .img {width:100%; padding:61% 0 0 0; background-color:#ccc; position:relative;}
.event-sec .list .img img {width:100%; height:100%; object-fit:cover; display:block; position:absolute; top:0; left:0;}
.event-sec .list .img.noimage::before {content:''; width:100%; height:100%; background:url(../img/logo.png) center center no-repeat; background-size:60% auto; display:block; position:absolute; top:0; left:0;}
.event-sec .list .date {font-size:1.6rem; font-weight:500; color:#fff; padding:0 0.5em; background-color:#000; box-sizing:border-box;}
.event-sec .list dl {margin:0.5em 0 0 0;}
.event-sec .list dt {font-size:1.8rem;}
.event-sec .list dd {font-size:1.6rem; color:#808080; display:flex; flex-wrap:wrap;}
.event-sec .list dd a {color:#808080; margin:0 1.0em 0 0; display:block;}

@media screen and (max-width:767px){
	.event-sec .list > div {width:100%;}
	.event-sec .list .date {font-size:1.4rem;}
	.event-sec .list dl {margin:0.2em 0 0 0;}
	.event-sec .list dt {font-size:1.6rem;}
	.event-sec .list dd {font-size:1.4rem;}
}

/* img-modal */
#img-modal {width:100%; height:100%; background-color:rgba(0,0,0,0.8); display:flex; align-items:center; position:fixed; top:0; left:0; z-index:400; overflow:hidden; opacity:0; pointer-events:none; transition:opacity 0.6s ease;}
#img-modal.on {opacity:1; pointer-events:auto;}
#img-modal > div {text-align:center; box-sizing:border-box; display:flex; align-items:center; position:relative;}
#img-modal > div > div {width:100vw; text-align:center; position:relative;}
#img-modal img {max-width:100vw; max-height:100vh; width:auto; height:auto; margin:0 auto; display:block; pointer-events:none; user-select:none;}
#img-modal div.ctx {max-width:660px; width:100%; text-align:center; color:#fff; margin:0.5em auto 0 auto; padding:0 15px; box-sizing:border-box;}
#img-modal div.ctx a {text-decoration:none; color:#fff;}
#img-modal div.ctx dt {font-size:1.6rem;}
#img-modal div.ctx dd {font-size:1.4rem; text-align:left; margin:0 auto; display:inline-block;}
#img-modal div.ctx dd.more {text-align:center; position:relative; z-index:100;}
#img-modal div.ctx dd.more a {text-decoration:none; color:#fff; margin:0 auto; padding:0 1.5em 0 0; display:inline-block; position:relative; transition:opacity 0.3s ease;}
#img-modal div.ctx dd.more a:hover {opacity:0.7;}
#img-modal div.ctx dd.more svg {width:10px; height:10px; margin:-5px 0 0 0; fill:#fff; display:block; position:absolute; top:50%; right:0;}
#img-modal .prev,
#img-modal .next {width:6.0vw; height:6.0vw; margin:-3.0vw 0 0 0; position:absolute; top:50%; opacity:0.7; transition:opacity 0.3s ease; cursor:pointer;}
#img-modal .prev {left:0; transform:rotate(-90deg);}
#img-modal .next {right:0; transform:rotate(90deg);}
#img-modal .prev.off,
#img-modal .next.off {opacity:0; cursor:default;}
#img-modal .close {width:6.0vw; height:6.0vw; position:absolute; top:2.0vw; right:2.0vw; opacity:0.7; cursor:pointer;}
#img-modal .close::before,
#img-modal .close::after {content:''; width:100%; height:4px; margin:-2px 0 0 0; background-color:#fff; border-radius:9999px; display:block; position:absolute; top:50%; left:0;}
#img-modal .close::before {transform:rotate(-45deg);}
#img-modal .close::after {transform:rotate(45deg);}
@media screen and (max-width:767px){
	#img-modal div.ctx dt {font-size:1.4rem;}
	#img-modal div.ctx dd {font-size:1.2rem;}
}

