@charset "UTF-8";

/*#wrapper {
    background: #fff url("../img/common/mvBg.png") repeat-x center bottom / auto auto;
    background-attachment: fixed;
    animation: bg 100s infinite linear;
}
@keyframes bg { 
	0% {
		background-position: 0 0;
	}
	100% {
		background-position: -3000px 0;
	}
}*/
#wrapper { overflow-x: hidden; }
.contentWrapper { position: relative; z-index: 10; padding-top: 100vh; }
#mv { background: url("../img/common/mvBg.png") bottom left no-repeat; background-size: 50%;}
#mv .bg02 { position: absolute; top: 0; right:0; width: 25%; }
#content { 
	background-image: linear-gradient(-45deg, #fff 25%, #fffbe9 25%, #fffbe9 50%, #fff 50%, #fff 75%, #fffbe9 75%, #fffbe9);
	background-size: 4px 4px;
	box-shadow: 0px -5px 15px 0px rgba(0, 0, 0, 0.35);
}
#anch01 .in-flex-Img { background: url("../img/common/nagoya.jpg") center center no-repeat; background-position: center bottom; background-size: cover;  }
#anch02 .in-flex-Img-card { background: url("../img/common/sample.jpg") center center no-repeat; background-position: center bottom; background-size: cover; }

#anch02 .in-flex-Img-card-1 { background: url("../img/common/top-s01.jpg") center center no-repeat; background-position: center bottom; background-size: cover; }
#anch02 .in-flex-Img-card-2 { background: url("../img/common/top-s05.jpg") center center no-repeat; background-position: center bottom; background-size: cover; }
#anch02 .in-flex-Img-card-3 { background: url("../img/common/top-s02.jpg") center center no-repeat; background-position: center bottom; background-size: cover; }

#anch03 .in-flex-Img-card-1 { background: url("../img/common/top-s06.jpg") center center no-repeat; background-position: center bottom; background-size: cover; }
#anch03 .in-flex-Img-card-2 { background: url("../img/common/top-s03.jpg") center center no-repeat; background-position: center bottom; background-size: cover; }
#anch03 .in-flex-Img-card-3 { background: url("../img/common/top-s04.jpg") center center no-repeat; background-position: center bottom; background-size: cover; }

@media screen and (max-width: 899px) {
	.in-flex { display: flex; flex-direction: column; padding: 0 4%; }
	.in-flex-Img { min-height: 150px; order: 1; width: 100%; margin: 0 auto 20px;}
	.in-flex-Text { order: 2; }
	.in-flex-Text h2 { font-size: 1.2rem; color:var(--base-color); letter-spacing: 0.01em; display: flex; align-items: center; margin-bottom: 20px; }
	.in-flex-Text h3 { font-size: 1.0rem; color:#000; letter-spacing: 0.1em; display: flex; align-items: center; margin-bottom: 10px; }
	.in-flex-Text p { font-size: 0.9rem; margin-bottom: 0px; color: #000; }
		
	.newsFlex { width: 96%; margin: 0 auto; }
	.newsFlexL {  }
	.newsFlexR {  }
	.newsFlex h2 { font-size: 1.5rem; color:var(--base-color); letter-spacing: 0.1em; margin-bottom: 20px; }
	.newsFlex h6 { font-family:'Roboto Condensed', sans-serif; font-weight:bold; color: #dedede; line-height: 1.0; font-size: 1.2rem; }
	
	#mv { background: url("../img/common/mvBg.png") bottom left no-repeat; background-size: 75%;}
	#mv .bg02 { display: none; }
	
	#content #anch01 .in { width: auto; }
	#anch01 .in-flex-Img { position: relative; min-height: 200px; }
	#anch01 .in-flex-Img .map { position: absolute; bottom: 0px; left: 0px; width: 150px; }
	
	#anch04 { position: relative; background: #fbf6e2; margin-top: 5vh; }
	
	#content #anch05 .in { width: auto; }
	#anch05 { background: #fff; }
	#anch05 .in-flex { }
	.ttlFlex div { width: 30%; margin: 0 auto 20px; }
	.ttlFlex h2 { color: #000; font-weight: 900; font-size: 1.2rem; }
	
	#content #anch01 { padding: 0px; }
	#content #anch01 .in-flex { padding: 0px; }
	#content #anch01 .in-flex .in-flex-Text { padding: 6%; }
	#content #anch01 .in-flex-Img { min-height: 250px; }
	
	#content #anch02 { padding: 0px; }
	#content #anch02 .in-flex { padding: 0px; }
	#content #anch02 .in-flex .in-flex-Text { padding: 6%; }
	#content #anch02 .in-flex-Img { min-height: 250px; }
	
	#content #anch03 { padding: 0px; }
	#content #anch03 .in-flex { padding: 0px; }
	#content #anch03 .in-flex .in-flex-Text { padding: 6%; }
	#content #anch03 .in-flex-Img { min-height: 250px; }
}
@media screen and (min-width: 600px) and (max-width: 899px)  {
	.in-flex-Img { min-height: 240px; order: 1; margin-bottom: 0px; width: 100%; margin: 0 auto 0px;}

	.newsFlex h6 { font-size: 0.75rem; }
	
	.flexFifth { display: flex; justify-content: center; align-items: center; margin: 0 auto; }
	.flexFifth li { width: 18.4%; margin-right: 2%; }
	.flexFifth li:last-child { margin-right: 0px; }
	.flexFifth li p { text-align: center; }
	.flexFifth li div { text-align: center; max-width: 150px; width: 100%; margin: 0 auto 10px;}
	
	#anch01 .in-flex-Img .map { position: absolute; bottom: 0px; left: 0px; width: 250px; }
	
	#anch04:before { content: ""; background-image: url("../img/common/bg.png"); position: absolute; left: 0; top: 0; width: 40%; height: 100%; background-size: cover; opacity: 0.5; transform: rotate(-180deg);}
	#anch04:after { content: ""; background-image: url("../img/common/bg.png"); position: absolute; right: 0; top: 0; width: 40%; height: 100%; background-size: cover; opacity: 0.5;}
	
	#content #anch01 { padding: 0px; }
	#content #anch01 .in-flex { padding: 0px; margin: 0; }
	#content #anch01 .in-flex .in-flex-Text { padding: 6%; }
	#content #anch01 .in-flex-Img { min-height: 450px; }
	
	#content #anch02 { padding: 0px; }
	#content #anch02 .in-flex { padding: 0px; }
	#content #anch02 .in-flex .in-flex-Text { padding: 6%; }
	#content #anch02 .in-flex-Img { min-height: 450px; }
	
	#content #anch03 { padding: 0px; }
	#content #anch03 .in-flex { padding: 0px; }
	#content #anch03 .in-flex .in-flex-Text { padding: 6%; }
	#content #anch03 .in-flex-Img { min-height: 450px; }
}
@media screen and (max-width: 599px) {
	.flexFifth { display: flex; justify-content: center; align-items: center; flex-wrap: wrap;margin: 0 auto; }
	.flexFifth li { width: 32%; margin-right: 2%; }
	.flexFifth li:last-child { margin-right: 0px; }
	.flexFifth li p { text-align: center; font-size: 0.9rem; }
	.flexFifth li div { text-align: center; max-width: 150px; width: 100%; margin: 0 auto 10px;}	
}
@media screen and (min-width: 900px) {
	.in-flex { display: flex; justify-content: space-between; }
	.in-flex-Img { width: 46%; min-height: 300px; height: 100%; border-radius: 8px; }
	.in-flex-Text { padding: 4% 4%; width: 50%; position: relative; }
	
	.in-flex-Img-card { width: 42%; min-height: 300px; height: 100%; border-radius: 8px; }
	.in-flex-Text-card { padding: 4% 4%; width: 54%; position: relative; }

	.in-flex-Text h2 { font-size: 2.4rem; color:var(--base-color); letter-spacing: 0.02em; display: flex; align-items: center; margin-bottom: 20px; }
	.in-flex-Text h3 { font-size: 1.2rem; color:#000; letter-spacing: 0.1em; display: flex; align-items: center; }
	.in-flex-Text p { font-size: 0.9rem; margin-bottom: 0px; color: #000; }
	.in-flex-Text p.grd-btn { margin-bottom: 20px; }
	
	.newsFlex { max-width: 1200px; width: 96%; margin: 0 auto; display: flex; justify-content: space-between; position: relative; }
	.newsFlexL { width: 30%; }
	.newsFlexR { width: 66%; }
	.newsFlex h2 { font-size: 2.4rem; color:var(--base-color); letter-spacing: 0.1em; margin-bottom: 0px; }
	.newsFlex h6 { font-family:'Roboto Condensed', sans-serif; font-weight:bold; color: #dedede; line-height: 1.0; margin-bottom: 40px; }
	
	.flexFifth { display: flex; justify-content: center; align-items: center; max-width: 1000px; width: 100%; margin: 0 auto; }
	.flexFifth li { width: 18.4%; margin-right: 2%; }
	.flexFifth li:last-child { margin-right: 0px; }
	.flexFifth li p { text-align: center; }
	.flexFifth li div { text-align: center; max-width: 150px; width: 100%; margin: 0 auto 10px;}
	
	#anch01 .in-flex-Img { position: relative; } 
	#anch01 .in-flex-Img .map { position: absolute; bottom: 0px; left: 0px; width: 300px; }
	#anch01 .in-flex-Text { padding: 2% 4%;}
	#anch04 { position: relative; background: #fbf6e2; margin-top: 5vh; }
	#anch04:before { content: ""; background-image: url("../img/common/bg.png"); position: absolute; left: 0; top: 0; width: 25%; height: 100%; background-size: cover; opacity: 0.5; transform: rotate(-180deg);}
	#anch04:after { content: ""; background-image: url("../img/common/bg.png"); position: absolute; right: 0; top: 0; width: 25%; height: 100%; background-size: cover; opacity: 0.5;}
	
	#anch05 { background: #fff; padding: 5vh 0; }
	#anch05 .in-flex { align-items: center; }
	.ttlFlex h2 { color: #000; font-weight: 900; }
}

@media screen and (min-width: 900px) and (max-width: 1079px)  {
	.in-flex-Text h6 { font-size: 3.2rem; }
	.newsFlex h6 { font-size: 0.8rem; }
	in-flex-Text h2 { font-size: 2.0rem; }
	#mv { background: url("../img/common/mvBg.png") bottom left no-repeat; background-size: 75%;}
	#mv .bg02 { display: none; }
	
	.ttlFlex div { width: 20%; margin-bottom: 10px }
	.ttlFlex h2 { font-size: 1.6rem; }
}
@media screen and (min-width: 1080px) and (max-width: 1179px)  {
	.in-flex-Text h6 { font-size: 3.4rem; }
	.newsFlex h6 { font-size: 0.85rem; }
	in-flex-Text h2 { font-size: 2.1rem; }
	#mv { background: url("../img/common/mvBg.png") bottom left no-repeat; background-size: 70%;}
	
	.ttlFlex div { width: 25%; margin-bottom: 20px }
	.ttlFlex h2 { font-size: 1.7rem; }
}
@media screen and (min-width: 1180px) and (max-width: 1289px)  {
	.in-flex-Text h6 { font-size: 3.6rem; }
	.newsFlex h6 { font-size: 0.9rem; }
	in-flex-Text h2 { font-size: 2.2rem; }
	#mv { background: url("../img/common/mvBg.png") bottom left no-repeat; background-size: 65%;}
	
	.ttlFlex div { width: 30%; margin-bottom: 20px }
	.ttlFlex h2 { font-size: 1.8rem; }
}
@media screen and (min-width: 1290px) and (max-width: 1389px)  {
	.in-flex-Text h6 { font-size: 3.8rem; }
	.newsFlex h6 { font-size: 0.95rem; }
	.in-flex-Text h2 { font-size: 2.3rem; }
	#mv { background: url("../img/common/mvBg.png") bottom left no-repeat; background-size: 60%;}
	
	.ttlFlex div { width: 25%; margin-bottom: 20px; }
	.ttlFlex h2 { font-size: 1.9rem; }
}
@media screen and (min-width: 1390px) and (max-width: 1489px)  {
	.in-flex-Text h2 { font-size: 2.3rem; }
	.in-flex-Text h6 { font-size: 4.0rem; }
	.newsFlex h6 { font-size: 1.0rem; }
	
	.ttlFlex { display: flex; justify-content: flex-start; align-items: center; margin-bottom: 40px; }
	.ttlFlex div { width: 20%; margin-right: 4%; }
	.ttlFlex h2 { color: #000; font-weight: 900; font-size: 2.0rem; line-height: 1.4; }
}
@media screen and (min-width: 1490px) {
	.in-flex-Text h6 { font-size: 4.0rem; }
	.newsFlex h6 { font-size: 1.0rem; }
	
	.ttlFlex { display: flex; justify-content: flex-start; align-items: center; margin-bottom: 40px; }
	.ttlFlex div { width: 20%; margin-right: 4%; }
	.ttlFlex h2 { color: #000; font-weight: 900; font-size: 2.0rem; line-height: 1.4; }
}

.barList li p a         { resize: none; position: relative;}
.barList li p a:link    { color:#000; text-decoration: none; }
.barList li p a:visited { color:#000; text-decoration: none; }
.barList li p a:hover   { color:var(--base-color); text-decoration: none; }
.barList li p a:active  { color:#000; text-decoration: none; }

.barList li p a::after {
	position: absolute;
	bottom: -10px;
	left: 0%;
	content: '';
	width: 90%;
	height: 1px;
	background: var(--base-color);
	transform: scale(0, 1);
	transform-origin: left top;
	transition: transform .3s;
	z-index: 1;
}
.barList li p a:hover::after {
	transform: scale(1, 1);
}

.serviceList li a         { resize: none; position: relative;}
.serviceList li a:link    { color:#000; text-decoration: none; }
.serviceList li a:visited { color:#000; text-decoration: none; }
.serviceList li a:hover   { color:var(--base-color); text-decoration: none; }
.serviceList li a:active  { color:#000; text-decoration: none; }
.serviceList li a::after {
	position: absolute;
	bottom: -5px;
	left: 0%;
	content: '';
	width: 90%;
	height: 1px;
	background: var(--base-color);
	transform: scale(0, 1);
	transform-origin: left top;
	transition: transform .3s;
	z-index: 1;
}
.serviceList li a:hover::after {
	transform: scale(1, 1);
}

#anch01 {
  /*background: linear-gradient(-45deg, #f9c2eb, #d1e8ff, #e4fffb, #ffeccc) fixed;
  background-size: 800% 800%;
  animation: GradietionAnimation 15s ease infinite;*/
}

@keyframes GradietionAnimation { 
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}

/*-- ニュース -------------------------------------------------------------*/
@media screen and (max-width: 1079px) {			
	.tabs { border-bottom: 1px solid #000; display: flex; justify-content: center; margin: 40px auto; max-width: 960px; width: 100%; }
	.tabs li { height: 35px; line-height: 35px; width: 100px; text-align: center; border-top: 1px solid #000; border-right: 1px solid #000; border-left: 1px solid #000; margin: 0 5px; font-size: 0.7rem; position: relative;}
	.tabs li.selected { background: #000; }
	.tabs li.selected:after { position: absolute; bottom: -1px; left: 0; content: ""; width: 100px; height: 1px; background: #000; z-index: 1; }
	.tabs li a { display: block; }
	.tabs li a:link    { color:#000; text-decoration: none; }
	.tabs li a:visited { color:#000; text-decoration: none; }
	.tabs li a:hover   { color:#fff; text-decoration: none; background: #000; }
	.tabs li a:active  { color:#000; text-decoration: none; }
	
	.tabs li.selected a:link    { color:#fff; text-decoration: none; }
	.tabs li.selected a:visited { color:#fff; text-decoration: none; }
	.tabs li.selected a:hover   { color:#fff; text-decoration: none; opacity: 0.7; }
	.tabs li.selected a:active  { color:#fff; text-decoration: none; }
	
	.newsList { max-width: 1020px; width: 100%; margin: 0 auto 40px; }
	.newsList li { display: flex; justify-content: flex-start; align-items: center; }
	.newsList li .newsDl { margin-right: 10px; }
}
@media screen and (max-width: 5999px) {				
	.newsList { margin: 0 auto 20px; }
	.newsList li { display: block; }
	.newsList li .newsDl { margin-right: 0px; margin-bottom: 5px; }
}
@media screen and (min-width: 1080px) {		
	.tabs { border-bottom: 1px solid #000; display: flex; justify-content: center; margin: 40px auto; max-width: 960px; width: 100%; }
	.tabs li { height: 35px; line-height: 35px; width: 100px; text-align: center; border-top: 1px solid #000; border-right: 1px solid #000; border-left: 1px solid #000; margin: 0 5px; font-size: 0.8rem; position: relative;}
	.tabs li.selected { background: #fff; }
	.tabs li.selected:after { position: absolute; bottom: -1px; left: 0; content: ""; width: 100px; height: 1px; background: #fff; z-index: 1; }
	.tabs li a { display: block; }
	.tabs li a:link    { color:#000; text-decoration: none; }
	.tabs li a:visited { color:#000; text-decoration: none; }
	.tabs li a:hover   { color:#fff; text-decoration: none; background: #000; }
	.tabs li a:active  { color:#000; text-decoration: none; }
	
	.tabs li.selected a:link    { color:#000; text-decoration: none; }
	.tabs li.selected a:visited { color:#000; text-decoration: none; }
	.tabs li.selected a:hover   { color:#fff; text-decoration: none; background: #000; }
	.tabs li.selected a:active  { color:#000; text-decoration: none; }
	
	.newsList { margin: 0 auto; }
	.newsList li { display: flex; justify-content: flex-start; align-items: center; }
	.newsList li .newsDl { margin-right: 10px; }
}

/*-- ニュース -------------------------------------------------------------*/
@media screen and (max-width: 599px) {			
	.accessFlex li { display: flex; justify-content: center; background: #fff; }
	.accessFlex li .accessBg { width: 40%; }
	.accessFlex li .in-access { padding: 4%; width: 62%; border-top: 3px solid #dedede; border-bottom: 3px solid #dedede; }
	.accessFlex li:nth-child(1) .in-access { border-right: 3px solid #dedede; }
	
	.accessFlex li:nth-child(1) .accessBg { background: url("../img/common/slide02_pc.jpeg") 0 0 no-repeat; background-size: cover; }
	.accessFlex li:nth-child(2) .accessBg { background: url("../img/common/slide01_pc.jpg") 0 0 no-repeat; background-size: cover; }
	
	.accessFlex li h3 { font-size: 1.1rem; font-weight: bold; }
	.accessFlex li h6 { opacity: 0.25; font-size: 0.8rem; }
	.accessFlex li p { font-size: 0.7rem; }
	.accessFlex li p.map { font-size: 1.2rem; margin-bottom: 0px; color: #30AFA5; }
	
	.accessFlex li:nth-child(2) h3 { text-align: right; }
	.accessFlex li:nth-child(2) h6 { text-align: right; }
	.accessFlex li:nth-child(2) p { text-align: right; }
}
@media screen and (min-width: 600px) {		
	.accessFlex { display: flex; justify-content: center; align-items: center; }
	.accessFlex li { width: 50%; display: flex; justify-content: center; background: #fff; }
	.accessFlex li .accessBg { width: 30%; }
	.accessFlex li .in-access { padding: 4%; width: 62%; border-top: 3px solid #dedede; border-bottom: 3px solid #dedede; }
	.accessFlex li:nth-child(1) .in-access { border-right: 3px solid #dedede; }
	
	.accessFlex li:nth-child(1) .accessBg { background: url("../img/common/slide02_pc.jpeg") 0 0 no-repeat; background-size: cover; }
	.accessFlex li:nth-child(2) .accessBg { background: url("../img/common/slide01_pc.jpg") 0 0 no-repeat; background-size: cover; }
	
	.accessFlex li h3 { font-size: 1.2rem; font-weight: bold; }
	.accessFlex li h6 { opacity: 0.25; font-size: 0.8rem; }
	.accessFlex li p { font-size: 0.9rem; }
	.accessFlex li p.map { font-size: 1.8rem; margin-bottom: 0px; color: #30AFA5; }
	
	.accessFlex li:nth-child(2) h3 { text-align: right; }
	.accessFlex li:nth-child(2) h6 { text-align: right; }
	.accessFlex li:nth-child(2) p { text-align: right; }
}

/*-- sns -------------------------------------------------------------*/
@media screen and (max-width: 599px) {			
	.snsList { display: flex; justify-content: center; align-items: center; width: 200px; margin: 0 auto; }
	.snsList li { width: 35px; margin: 0 6%; }
}
@media screen and (min-width: 600px) {		
	.snsList { display: flex; justify-content: center; align-items: center; width: 200px; margin: 0 auto; }
	.snsList li { width: 35px; margin: 0 6%; }
}

/*-- サイドフィックス -------------------------------------------------------------*/
@media screen and (max-width: 899px) {			
}
@media screen and (min-width: 900px) {		
	.sideFix { position: absolute; right: 2%; bottom: 4%; z-index: 2; }
	.sideFix li { width: 80px; margin: 0 0 1px; }
}
@media screen and (min-width: 900px) and (min-width: 1079px) {		
	.sideFix { position: absolute; right: 2%; bottom: 4%; z-index: 2; }
	.sideFix li { width: 50px; margin: 0 0 1px; }
}
@media screen and (min-width: 1080px) and (min-width: 1179px) {		
	.sideFix { position: absolute; right: 2%; bottom: 4%; z-index: 2; }
	.sideFix li { width: 50px; margin: 0 0 1px; }
}
@media screen and (min-width: 1180px) and (min-width: 1279px) {		
	.sideFix { position: absolute; right: 2%; bottom: 4%; z-index: 2; }
	.sideFix li { width: 60px; margin: 0 0 1px; }
}
@media screen and (min-width: 1280px) and (min-width: 1379px) {		
	.sideFix { position: absolute; right: 2%; bottom: 4%; z-index: 2; }
	.sideFix li { width: 70px; margin: 0 0 1px; }
}


