/*============================================================
    ESC　基本
  ============================================================ */
/*
toplayout.css
color:#4b4d4d
bgcolor:#f3f3f3
point color1:c
#52998f

/*----------------------------------------------
 RESPONSIVE
------------------------------------------------*/

/*   ------------------------------*/ 
@media screen and (max-width: 767px) {
.max767{
display:none;
}
}

/*   ------------------------------*/ 
@media (max-width: 601px){
.max601{
display:none;
}
}

/*   ------------------------------*/ 
@media (min-width: 602px) { 
.min602{
display:none;
}
}

/*   ------------------------------*/ 
@media (max-width: 991px){
.max991{
display:none;
}
}

/*   ------------------------------*/ 
@media (min-width: 992px) { 
.min992{
display:none;
}
}


@media screen and (max-width: 959px) {
.nav-max959{
display:none;
}
}	
		
@media screen and (min-width: 960px) {
.nav-min960{
display:none;
}
}	


img {
  max-width: 100%;
}


/*--------------------------------------------------
   TOP
 --------------------------------------------------*/  

/* BASIC
 --------------------------------------------------*/ 

/* ---　base  ------------*/
html {
scroll-behavior: smooth;
}

body{
margin:0;
padding :0;
color:#4b4d4d;
letter-spacing:0.08em;
}

/* ---　link  ---------*/ 
a { 
  text-decoration: none; 
  color:#4b4d4d; 
}

a :link{ 
  text-decoration: none; 
  color:#459f92;
}

a :visited { 
  color:#4b4d4d;
}

a :hover { 
  color:#459f92;
}

/* ---　link img  ---------*/ 
a:active img ,
a:hover img {
outline: 0;
opacity: 0.6;
}

/* ---　BUTTOM  ---------*/ 
.btn-w  {

}

@media screen and (max-width: 1100px) {
.btn-w  {
padding:1px !important; 
min-width: 170px !important;
text-align: center !important;
border-radius: 20px;
}
}

@media screen and (max-width: 601px) {
.btn-w  {
padding:2px !important; 
min-width: 170px !important;
text-align: center !important;
border-radius: 20px;
}
}

/* ---　HEADLINE  ---------*/ 
h1 {
	font-family: 'Roboto', sans-serif;
 position: relative;
	color: #459f92;
 font-size: 2.3rem;
	font-weight: 500;
 line-height: 110%;
 margin: 3.6rem 0 3.0rem 0;
	padding-top:95px;
}
@media only screen and (max-width: 596px) {
h1 {
 position: relative;
 font-size: 2.2rem;
 line-height: 110%;
 margin: 3.4rem 0 2.6rem 0;
}
}
h1.site-title{
  font-size: 1rem !important;
	 line-height: 110% !important;
  margin: 2.0rem 0 2.0rem 0 !important;
}

/*--- second pages ---*/	

/*--- second pages //---*/

h2 {
 position: relative;
 font-size: 2.2rem;
 line-height: 110%;
	color:#459F92;
 margin: 0.1rem 0 3rem 0;
 letter-spacing:0.08rem;
	font-weight: 600;
 text-align:left;
}
@media only screen and (max-width: 600px) {
h2 {
 position: relative;
 font-size: 2.0rem;
 line-height: 110%;
 margin: 0.1rem 0 2.8rem 0;
 letter-spacing:0.05rem;
}
}

h2.contactus {
font-size: 1.7rem !important;
line-height: 130%;
color: #ffffff !important;
margin: 1.7rem auto 0rem !important;
letter-spacing:0.06rem;
text-align:center;
}
@media (min-width: 768px)and (max-width: 992px) { 
h2.contactus {
font-size: 1.6rem !important;
}
}
@media only screen and (max-width: 600px) {
h2.contactus {
font-size: 1.5rem !important;
line-height: 180%;
margin: 2.5rem auto 0rem;
}
}

/*--- second pages ---*/
h2.matter-title{
	 font-weight: 400;
  padding: 0rem 0 0 0;
	 margin: 0 0 1.5rem;
  font-size: 1.6rem;
}
@media only screen and (max-width: 600px) {
h2.matter-title{
  padding: 0.9rem 0 0 0;
}
}

h2.offices{
padding:24px 0 10px 12px;
height: 10px;
font-size: 1.3rem;
display:flex; 
line-height: 1.1;
letter-spacing:0.05rem;
align-items:center;
font-weight: 500;
text-align:left;
}
h2.offices::before {
	content:"";
	display:inline-block;
	width: 2px;
	height: 30px;
	background-color: #459F92; 
	position: absolute;
	top: 60%;
	transform: translateY(-50%);
	left: 0px;
}
@media only screen and (max-width: 992px) {
h2.offices{
margin:30px 0 20px 10px !important;
}
}		
@media only screen and (max-width: 600px) {
h2.offices{
 margin:40px 0 0 0 !important;
 padding:0 0 20px 0px;
}
h2.offices::before {
 content:"";
 display:none;
	top: 20% !important;
}
h2.offices:after {
	margin-left:7px; 
	border-top:1px solid #459F92; 
	content:""; 
	flex-grow:1;
}
}
	
h2.offices-none{
margin-top:-7px;
padding-bottom: 20px;
height: 30px;
font-size: 1.4rem;
display:flex; 
line-height: 1.1;
align-items:center;
font-weight: 400;
text-align:left;
}
@media only screen and (max-width: 600px) {
h2.offices-none{
height: 0px;
margin-top:0;
padding: 0px !important;
}
}

h2.plivacy-title{
font-family: 'Roboto', sans-serif;
font-size: 1.5rem;
margin: 45px 0 0;
line-height: 1.1;
font-weight: 500;
text-align:left;
}

/*--- second pages //---*/

h3 {
 font-family: 'Inter', sans-serif;
 font-size: 1.6rem;
 line-height: 110%;
	font-weight: 400;
 margin: 0.8rem 0 2.4rem 0;
 letter-spacing:0.06rem;
}

/*--- second pages ---*/
h3.ser-title{
	 font-family: 'Roboto', sans-serif;
	 color:#459f92;
  left: 0;
	 font-weight: 400;
  padding: 1.5rem 0 0.5rem 0;
	 margin-bottom: 0rem;
  font-size: 1.5rem;
}

h3.office-title{
	 position: relative;
 font-size: 1.4rem !important;
 line-height: 110%;
	color:#459F92;
	 font-family: 'Roboto', sans-serif;
	 font-weight: 400;
  padding: 0.8rem 0 0 0;
	 margin: 0 0 1.5rem;
	text-align: left;
}
/*--- second pages // ---*/
	
h4 {
 font-size: 1.62rem;
 line-height: 110%;
 margin: 1.52rem 0 0.912rem 0;
}

h5 {
 font-size: 1.16rem;
 line-height: 110%;
 margin: 1.0933333333rem 0 0.656rem 0;
}


/* ALL CONTENS
 ------------------------------------------------------*/

#all{
width: 100%;
text-align:center;
margin-left: auto;
margin-right:auto;  
position: relative;
background: #f3f3f3;
}


/* MAIN IMG
--------------------------------------------------------*/
.main-img{
position: relative;
top:50px;
margin-top: -10px;
	}
.swiper-text{
max-width: 600px;
	}

.swiper-text p{
  position: absolute;
	 color:#fff;
	 top:28%;
	 left:8%;
	 right:57%;
	 text-align: left;
		line-height: 160%;
	 font-weight: 500;
	 font-size: 25px;
	 z-index: 200;
	}
@media screen and (max-width: 1280px) {
.swiper-text p{
  position: absolute;
	 color:#fff;
　top:25%;
	 left:8%;
	 right:48%;
	 text-align: left;
	 line-height: 160%;
	 font-weight: 500;
	 font-size: 25px;
	 z-index: 200;
	}
	}
@media screen and (max-width: 992px) {
.swiper-text p{
  position: absolute;
	 color:#fff;
　top:25%;
	 left:8%;
	 right:42%;
	 text-align: left;
	 line-height: 160%;
	 font-weight: 500;
	 font-size: 24px;
	 z-index: 200;
	}
	}
@media screen and (max-width: 600px){
.swiper-text p{
  position: absolute;
	 color:#fff;
		top:30%;
	 bottom:20%;
	 left:10%;
	 right:10%;
	 text-align: left;
	 line-height: 150%;
	 font-weight: 500;
	 font-size: 23px !important;
	 z-index: 200;
	}
	}
@media screen and (max-width: 380px){
.swiper-text p{
  position: absolute;
	 color:#fff;
		top:18%;
	 bottom:30%;
	 left:10%;
	 right:10%;
	 text-align: left;
	 line-height: 150%;
	 font-weight: 600;
	 font-size: 16px !important;
	 z-index: 200;
	}
	}
/* SLIDER
--------------------------------------------------------*/
@-webkit-keyframes zoomUp {
  0% {
      -webkit-transform: scale(1);
      transform: scale(1);
  }
  100% {
      -webkit-transform: scale(1.10);
      transform: scale(1.10);
  }
}

@keyframes zoomUp { /* 1.10倍指定 */
  0% {
      -webkit-transform: scale(1);
      transform: scale(1);
  }
  100% {
      -webkit-transform: scale(1.10);
      transform: scale(1.10);
  }
}
swiper-container{
  position: relative;
}
.swiper-slide {
  overflow: hidden;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.swiper-slide-active .swiper-img,
.swiper-slide-duplicate-active .swiper-img,
.swiper-slide-prev .swiper-img { /* ８秒かけて拡大させる */
    -webkit-animation: zoomUp 8s linear 0s;
    animation: zoomUp 8s linear 0s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.swiper-img {
    background-size: cover; 
    background-position: center center; /* center基準 */
    min-height:100vh; /* 高さ表示 */
}


/* FOOTER
------------------------------------------------------*/
/*top-footer*/
footer{
width:100%;
height:auto;
color:#fff;
margin: 35px 0 0;
padding: 35px 0 0 0px;
background-color:#459f92;
vertical-align: bottom;
z-index: 200;
}

.co-name{
font-size:1.02rem;
margin:0 0 0;
letter-spacing: 0.08em;
line-height: 1.4;
text-align: left;
font-weight: 600;
vertical-align: bottom;
}
.offices{
font-size:0.8rem;
margin:5px 0 0;
letter-spacing: 0.06em;
line-height: 1.3;
text-align:left;
vertical-align: bottom;
}
.privacy {
font-size:0.9rem;
margin:0 0 -20px;
letter-spacing: 0.08em;
line-height: 1.4;
text-align:right;
vertical-align: bottom;
}
.privacy a:link {
color: #ffffff;
}
.privacy a:visited {
	color: #ffffff;
}
.privacy a:hover {
	color: #315b55;
}

footer .copyright{
width: 100%;
background: #3e8f83;
font-size:0.7rem;
line-height: 1.0;
margin:50px auto 0;
padding-top:1.5em;
padding-bottom: 1.5em;
letter-spacing: 0.1em;
text-align:center;
vertical-align: bottom;
}

/*---- MOBILE ------*/
@media screen and (max-width: 767px) {
footer{
height:auto;
padding:30px 0 0;
text-align:center;
}	
.co-name{
font-size:1.0rem;
text-align:left;
margin-bottom: 5px;
}
.offices{
font-size:0.8rem;
margin:5px 0 0;
letter-spacing: 0.06em;
line-height: 1.3;
text-align:left;
vertical-align: bottom;
}
.privacy{
font-size:0.86rem;
margin:15px 0 -3px;
letter-spacing: 0.08em;
text-align:right;
vertical-align: bottom;
}

footer .copyright{
font-size:0.7rem;
margin:40px auto 0 !important;
letter-spacing: 0.08em;
text-align:center;
}
}

