@charset "utf-8";

/*----------------------------cmn--------------------------------*/
.w{
  width:100%;
  max-width:1500px;
  padding:0 50px;
  margin:0 auto;
}
@media screen and (max-width: 860px) {
  .w{
    padding:0 25px;
  }
}
@media screen and (max-width: 500px) {
  .w{
    padding:0 20px;
  }
}
/*----------------------------slider--------------------------------*/

.slider .slick-list{
	position: relative;
	display: block;
	overflow: hidden;

}
.slider{
	position: relative;
	cursor: pointer;
	width:calc(100% - 30px);
	margin:auto;
}
.slider .slick-track{
	position: relative;
	top: 0;
	left: 0;
	display:-webkit-box;/*--- Androidブラウザ用 ---*/
	display:-ms-flexbox;/*--- IE10 ---*/
	display: -webkit-flex;/*--- safari（PC）用 ---*/
	display: flex;
	justify-content: center;
	align-items:flex-start;
}
.slick-slider button{
  border: none;
}
.slider .slick-arrow{
	display: block;
	text-indent: -10000px;
	outline:none;
	line-height:1px;
	font-size:1px;
	height: 30px;
	width: 30px;
	cursor: pointer;
	position: absolute;
	top: calc(50% - 15px);
	left:-15px;
	z-index: 1;
	border: none;
}
.slider .slick-next{
	left: auto;
	right:-15px;
}
.slider .slick-arrow:before{
	content: "";
	display: block;
	width: 15px;
	height: 15px;
	position: absolute;
	top: calc(50% - 7px);
	border-top: 3px solid rgba(0,0,0,0.8);
	border-left: 3px solid rgba(0,0,0,0.8);
}
.slider .slick-prev:before{
	transform: rotate(-45deg);
	left: calc(50% - 4px);
}
.slider .slick-next:before{
	transform: rotate(135deg);
	left: calc(50% - 12px);
}

.slider .pointer{
	display: table;
	margin: 20px auto 0;
}
.slider .pointer li{
	display: table-cell;
	padding: 0 5px;
}
.slider .pointer li button{
	display: block;
	text-indent: -10000px;
	outline:none;
	line-height:1px;
	font-size:1px;
	background-color: #ccc;
	width: 5px;
	height: 5px;
	border-radius: 100%;
	border: none;
	cursor: pointer;
}
.slider .pointer .slick-active button{
	background-color: #3f3a39;
}

/* ----------------------------------------------------------------------
 header
---------------------------------------------------------------------- */

header{
  position: absolute;
  width:100%;
  top:0;
  left:0;
  padding: 30px 1rem 0;
  z-index:10;
}
header .pclogo{
  position: absolute;
	left: 30px;
	top: 30px;
	width: 227px;
	width: clamp(190px,14.9333vw,220px);
}
.home header .pclogo{
	width: 287px;
	width: clamp(220px,14.9333vw,287px);
}
header .pclogo img.pc{
  display:block;
  width: 100%;
}
header .pclogo img.sp{
  display:none;
  width: 100%;
}
header .navwrap{
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  align-items: flex-end;
  flex-direction: column;
}
header .navwrap .elm1{
  display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
  align-items: center;
  line-height: 1.2;
  margin-bottom: 20px;
}
header .navwrap .elm1 dt{
  display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
  align-items: center;
}
header .navwrap .elm1 dt svg{
  fill:#37b098;
  width:30px;
  height:auto;
  margin-right: 10px;
}
header .navwrap .elm1 dt span a{
  font-size: 30px;
  font-weight: 600;
  color:#37b098;
}
header .navwrap .elm1 dd{
  padding-left: 15px;
  font-size: 16px;
}

header .navwrap .elm2 .nav{
  display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
  align-items: center;
}
header .navwrap .elm2 .nav li{
  padding-right: 30px;
}
header .navwrap .elm2 .nav li:last-of-type{
  padding-right: 0px;
}
header .navwrap .elm2 .nav li a{
  position: relative;
  color: #433728;
  letter-spacing: 0.05rem;
  font-weight: 700;
  font-size: 20px;
  padding-left: 30px;
  transition: 0.3s ease-in-out;
}
header .navwrap .elm2 .nav li a:hover{
  color: #665747;
}
header .navwrap .elm2 .nav li:last-of-type a{
  padding-left: 0px;
}
header .navwrap .elm2 .nav li a::before{
  position: absolute;
  content:"";
  top:50%;
  left:0;
  width:18px;
  height:18px;
  background: rgba(0,0,0, 0.5);
  border-radius: 50px;
  transform: translateY(-50%) scale(1);
  transition: 0.3s ease-in-out;
}
header .navwrap .elm2 .nav li a::after{
  position: absolute;
  content:"";
  top:50%;
  left:4px;
  width:10px;
  height:10px;
  background: rgba(0,0,0, 1);
  border-radius: 50px;
  transform: translateY(-50%) scale(1);
  transition: 0.3s ease-in-out;
}
header .navwrap .elm2 .nav li.n5 a::before,
header .navwrap .elm2 .nav li.n5 a::after{
  display:none;
}
header .navwrap .elm2 .nav li.n1 a::before{
  background: rgba(239,85,85, 0.5);
}
header .navwrap .elm2 .nav li.n1 a::after{
  background: rgba(239,85,85, 1);
}
header .navwrap .elm2 .nav li.n2 a::before{
  background: rgba(9,185,164, 0.5);
}
header .navwrap .elm2 .nav li.n2 a::after{
  background: rgba(9,185,164, 1);
}
header .navwrap .elm2 .nav li.n3 a::before{
  background: rgba(126,216,46, 0.5);
}
header .navwrap .elm2 .nav li.n3 a::after{
  background: rgba(126,216,46, 1);
}
header .navwrap .elm2 .nav li.n4 a::before{
  background: rgba(239,211,56, 0.5);
}
header .navwrap .elm2 .nav li.n4 a::after{
  background: rgba(239,211,56, 1);
}
header .navwrap .elm2 .nav li a:hover::after{
  transform: translateY(-50%) scale(1.5);
}
header .navwrap .elm2 .nav li a:hover::before{
  top:50%;
  transform: translateY(-50%) scale(1);
  /*-webkit-animation: spin 1.5s linear infinite;
  animation: spin 1.5s linear infinite;*/
}
@-webkit-keyframes spin {
    0%   {
        -webkit-transform: translateY(-50%) scale(1);  /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateY(-50%) scale(1);  /* IE 9 */
        transform: translateY(-50%) scale(1));  /* Firefox 16+, IE 10+, Opera */
    }
    100% {
        -webkit-transform: translateY(-50%) scale(1.5);  /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateY(-50%) scale(1.5);  /* IE 9 */
        transform: translateY(-50%) scale(1.5);  /* Firefox 16+, IE 10+, Opera */
    }
}
@keyframes spin {
    0%   {
        -webkit-transform: translateY(-50%) scale(1);  /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateY(-50%) scale(1);  /* IE 9 */
        transform: translateY(-50%) scale(1);  /* Firefox 16+, IE 10+, Opera */
    }
    100% {
        -webkit-transform: translateY(-50%) scale(1.5);  /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateY(-50%) scale(1.5);  /* IE 9 */
        transform: translateY(-50%) scale(1.5);  /* Firefox 16+, IE 10+, Opera */
    }
}
header .navwrap .elm2 .nav li.n5 a{
  display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
  justify-content: center;
  align-items: center;
  background: url(/assets/images/cmn/btn_bg02.gif) 50% 0;
  border-radius: 50px;
  padding:12px 30px;
  line-height: 1.2;
  color:#fff;
  background-position: 100% 100%;
  transition: 0.3s ease-in-out;
}
header .navwrap .elm2 .nav li.n5 a svg{
  fill:#fff;
  width:24px;
  margin-right: 10px;
  margin-top: 2px;
}
header .navwrap .elm2 .nav li.n5 a:hover{
  filter: hue-rotate(12deg);
  box-shadow: 1px 1px 12px rgba(16,108,122,.5);
}
header .navwrap .elm1 dt span a[href^="tel:"]{
  pointer-events: none;
  cursor: default;
}
header .navwrap .sp_hadtel,
header .navwrap .sp_hadcontact{
  display:none;
}
@media screen and (max-width: 1300px) {
  header .navwrap .elm2 .nav li a{
    font-size: 18px;
  }
}
@media screen and (max-width: 1160px) {
  header .navwrap .elm2 .nav li a{
    font-size: 16px;
  }
}
@media screen and (max-width: 1080px) {
  header{
    padding: 20px 1rem 0;
  }
  header .pclogo{
  	top: 20px;
  }
  .home header .pclogo{
      width: 220px;
    	width: clamp(190px, 20.37vw, 220px);
    }
  header .navwrap{
    padding-right: 110px;
  }
  header .navwrap .elm1{
    margin-bottom: 10px;
  }
  header .navwrap .elm2 .nav li:nth-of-type(1),
  header .navwrap .elm2 .nav li:nth-of-type(2),
  header .navwrap .elm2 .nav li:nth-of-type(3),
  header .navwrap .elm2 .nav li:nth-of-type(4){
    display:none;
  }
  header .navwrap .elm1 dd{
    padding-left: 15px;
    font-size: 12px;
  }
}

@media screen and (max-width: 980px) {
  header .navwrap{
    flex-direction: row;
    justify-content: flex-end;
    gap: 1.5rem;
  }
  header .navwrap .elm1,
  header .navwrap .elm2{
    display:none;
  }
  header .navwrap .sp_hadtel{
    display:block;
  	width:60px;
    height:60px;
  }
  header .navwrap .sp_hadtel a{
    display: -webkit-box;
  	display: -webkit-flex;
  	display: -ms-flexbox;
  	display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width:60px;
    height:60px;
    border-radius: 100px;
    background: #37b098;
    transition: all 0.3s ease;
  }
  header .navwrap .sp_hadtel a svg{
    fill:#fff;
    width:28px;
    margin:0 auto 3px;
  }
  header .navwrap .sp_hadtel a span{
    text-align: center;
    color:#fff;
    font-size: 10px;
    line-height: 1.0;
  }
  header .navwrap .sp_hadcontact{
    display:block;
  	width:60px;
    height:60px;
  }
  header .navwrap .sp_hadcontact a{
    display: -webkit-box;
  	display: -webkit-flex;
  	display: -ms-flexbox;
  	display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width:60px;
    height:60px;
    border-radius: 100px;
    background: #37b098;
    transition: all 0.3s ease;
  }
  header .navwrap .sp_hadcontact a svg{
    fill:#fff;
    width:24px;
    margin:0 auto 3px;
  }
  header .navwrap .sp_hadcontact a span{
    text-align: center;
    color:#fff;
    font-size: 10px;
    line-height: 1.0;
  }
  header .navwrap .sp_hadtel a:hover,
  header .navwrap .sp_hadcontact a:hover{
    background: #1f8873;
  }
}
@media screen and (max-width: 760px) {
  header .pclogo{
    position: absolute;
  	left: 15px;
  	top: 20px;
  	width: 287px;
  	width: clamp(220px, 37.37vw, 287px);
  }
  header .pclogo img.pc{
    display:none;
  }
  header .pclogo img.sp{
    display:block;
    width: 100%;
  }
}
@media screen and (max-width: 550px) {
  header .pclogo{
  	top: 15px;
  	width: 287px;
  	width: clamp(220px, 37.37vw, 287px);
  }
  header{
    padding: 15px 1rem 0;
  }
  header .navwrap{
    padding-right: 5px;
  }
}
@media screen and (max-width: 380px) {
  header .pclogo{
  	width: 180px;
  }
  header .navwrap{
    padding-right: 0px;
  }
  header .navwrap{
    gap: 1rem;
  }
  header .navwrap .sp_hadtel,
  header .navwrap .sp_hadtel a,
  header .navwrap .sp_hadcontact,
  header .navwrap .sp_hadcontact a{
    width:50px;
    height:50px;
  }
  header .navwrap .sp_hadtel a svg{
    width:24px;
  }
  header .navwrap .sp_hadcontact a svg{
    width:20px;
  }
}
/* メニュートリガーボタン */
.menu-trigger {
  display:none;
  position: fixed;
  top: 2rem;
  right: 2rem;
  z-index: 50;
}

.menu-button {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  padding: 1rem;
  background: linear-gradient(135deg, #06beb6, #48b1bf);
  border: none;
  width:80px;
  height:80px;
  border-radius: 100px;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  cursor: pointer;
  transition: all 0.3s ease;
}

.menu-button:hover {
  background: linear-gradient(135deg, #00a8a1, #288d9b);
  transform: scale(1.05);
}

/* ハンバーガーアイコン */
.hamburger-icon {
  position: relative;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.line {
  width: 24px;
  height: 2px;
  background: white;
  transition: all 0.3s ease;
  position: relative;
}

.line::before,
.line::after {
  content: "";
  position: absolute;
  width: 24px;
  height: 2px;
  background: white;
  transition: all 0.3s ease;
}

.line::before {
  top: -8px;
  left:0;
}

.line::after {
  top: 8px;
  left:0;
}

/* 展開時のアイコン変形 */
.menu-open .line {
  background: none;
}

.menu-open .line::before {
  opacity: 1;
  top: 0;
  transform: rotate(45deg);
}

.menu-open .line::after {
  opacity: 1;
  top: 0;
  transform: rotate(-45deg);
}

.menu-text {
  color: #fff;
  font-size: 1.0rem;
  font-weight: 500;
}

.circle-background {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 64px;
  height: 64px;
  background: #f4f2eb;
  border-radius: 50%;
  transform: scale(0);
  transition: all 1s ease-out;
  z-index: 20;
  opacity: 0;
  pointer-events: none;
}

.menu-open .circle-background {
  width: 400vw;
  height: 400vw;
  bottom: -125vw;
  left: -125vw;
  transform: scale(1);
  opacity: 1;
}

/* メニューコンテンツ */
.menu-content {
  position: fixed;
  inset: 0;
  z-index: 40;
  display: flex;
  opacity: 0;
  pointer-events: none;
  transition: all 0.5s ease;
}

.menu-open .menu-content {
  opacity: 1;
  pointer-events: auto;
  transition-delay: 0.3s;
}

.menu-content .menu-container {
  width: 100%;
  overflow: scroll;
}
.menu-content .menu-wrap{
  width: 100%;
  padding: 50px 50px;
}
.menu-content .menu-header{
  width:100%;
  margin-bottom: 4rem;
  transform: translateY(4rem);
  opacity: 0;
  transition-delay: 1.0s;
  transition: all 0.3s ease;
}
.menu-content .menu-header img{
  display:block;
  width:100%;
  max-width:200px;
  margin:0 auto;
}
.menu-open .menu-content .menu-header{
  transform: translateY(0rem);
  opacity: 1;
}

.menu-content .menu-list{
  display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	width:100%;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 6rem;
}
.menu-content .menu-list li{
  width:48%;
  border-bottom: 1px solid #433728;
  transform: translateX(2rem);
  opacity: 0;
  transition-delay: 1.0s;
  transition: all 0.3s ease;
}
.menu-content .menu-list li a{
  display:block;
  color: #433728;
  letter-spacing: 0.05rem;
  font-weight: 700;
  font-size: 2.0rem;
  padding:20px 15px;
  transition: all 0.3s ease;
}
.menu-content .menu-list li a:hover{
  color: #665747;
}
.menu-open .menu-content .menu-list li{
  transform: translateX(0);
  opacity: 1;
}

.menu-open .menu-content .menu-list li:nth-child(1) {
  transition-delay: 0.4s;
}
.menu-open .menu-content .menu-list li:nth-child(2) {
  transition-delay: 0.5s;
}
.menu-open .menu-content .menu-list li:nth-child(3) {
  transition-delay: 0.6s;
}
.menu-open .menu-content .menu-list li:nth-child(4) {
  transition-delay: 0.7s;
}
.menu-open .menu-content .menu-list li:nth-child(5) {
  transition-delay: 0.8s;
}
.menu-open .menu-content .menu-list li:nth-child(6) {
  transition-delay: 0.9s;
}
.menu-open .menu-content .menu-list li:nth-child(7) {
  transition-delay: 1.0s;
}

.menu-content .menu-info{
  width:100%;
  background: #fff;
  border-radius: 5rem;
  padding:3rem 3rem 5rem;
  margin-bottom: 4rem;
  transform: translateY(4rem);
  opacity: 0;
  transition-delay: 1.0s;
  transition: all 0.3s ease;
}
.menu-open .menu-content .menu-info{
  transform: translateY(0rem);
  opacity: 1;
}

.menu-content .menu-info .p1{
  text-align: center;
  margin-bottom: 3rem;
  font-size: 2.0rem;
}
.menu-content .menu-info .mg,
.menu-content .menu-info .mg2{
  display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	width:100%;
  justify-content: center;
  align-items: center;
  background: #f4f2eb;
  border-radius: 10px;
  padding:12px 5px;
  margin-bottom: 2rem;
  color:#433728;
  font-weight: bold;
  font-size: 2.0rem;
}
.menu-content .menu-info .mg svg,
.menu-content .menu-info .mg2 svg{
  fill:#433728;
  width:30px;
  margin-right: 10px;
}
.menu-content .menu-info .menu-tel{
  display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	width:100%;
  justify-content: center;
  align-items: center;
  text-align: center;
  margin-bottom: 1rem;
  font-weight: 600;
  font-size: 2.6rem;
  line-height: 1.4;
}
.menu-content .menu-info .menu-tel .t2{
  padding-left: 6px;
}
.menu-content .menu-info .menu-tel a{
  font-weight: bold;
  color:#37b098;
  font-size: 4.0rem;
}
.menu-content .menu-info .menu-tel a[href^="tel:"]{
  pointer-events: none;
  cursor: default;
}
.menu-content .menu-info .menu-tel2{
  font-size: 1.6rem;
  text-align: center;
  margin-bottom: 5rem;
}
.menu-content .menu-info .menu-mail{
  padding-top: 12px;
}
.menu-content .menu-info .menu-mail a{
  display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
  justify-content: center;
  align-items: center;
  background: url(/assets/images/cmn/btn_bg02.gif) 50% 0;
  border-radius: 50px;
  width:100%;
  max-width:400px;
  margin:0 auto;
  padding:28px 15px;
  font-size: 2.0rem;
  line-height: 1.2;
  font-weight: bold;
  color:#fff;
  background-position: 100% 100%;
  transition: 0.3s ease-in-out;
}
.menu-content .menu-info .menu-mail a:hover{
  filter: hue-rotate(12deg);
  box-shadow: 1px 1px 12px rgba(16,108,122,.5);
}

.menu-footer {
  margin-top: 2rem;
  text-align: center;
}
.menu-footer button{
  border: none;
  width:100%;
  max-width:250px;
  margin:0 auto;
  padding:15px 15px;
  text-align: center;
  font-size: 1.2rem;
  color:#fff;
  letter-spacing: 0.1rem;
  background: #433728;
  border-radius: 5px;
  cursor: pointer;
  transition: all 0.3s ease;
}
.menu-footer button:hover{
  background: #665747;
}
@media screen and (max-width: 1080px) {
  .menu-trigger {
    display:block;
  }
}
@media screen and (max-width: 860px) {
  .menu-content .menu-info .menu-tel a[href^="tel:"]{
    pointer-events: auto;
    cursor: pointer;
  }
}
@media screen and (max-width: 760px) {
  .menu-content .menu-list li a{
    font-size: 1.8rem;
    padding:16px 15px;
  }
}
@media screen and (max-width: 550px) {
  .menu-trigger {
    top: auto;
    bottom:90px;
    right: auto;
    left:1rem;
  }
  .menu-button {
    gap: 0rem;
    width:55px;
    height:55px;
  }
  .menu-text {
    font-size: 0.8rem;
  }
  .menu-open .circle-background {
    width: 400vw;
    height: 400vw;
  }
  .menu-content .menu-list li{
    width:100%;
  }
  .menu-content .menu-info .p1{
    font-size: 1.8rem;
  }
}
@media screen and (max-width: 430px) {
  .menu-trigger {
    bottom:80px;
  }
  .menu-content .menu-wrap{
    padding: 25px 25px 50px;
  }
  .menu-content .menu-header{
    margin-bottom: 3rem;
  }
  .menu-content .menu-header img{
    max-width:140px;
  }
  .menu-content .menu-list{
    margin-bottom: 4rem;
  }
  .menu-content .menu-list li a{
    font-size: 1.6rem;
  }
  .menu-content .menu-info{
    border-radius: 2rem;
    padding:2rem 2rem 4rem;
    margin-bottom: 4rem;
  }
  .menu-content .menu-info .p1{
    margin-bottom: 2rem;
    font-size: 1.4rem;
  }
  .menu-content .menu-info .mg,
  .menu-content .menu-info .mg2{
    font-size: 1.6rem;
  }
  .menu-content .menu-info .mg svg,
  .menu-content .menu-info .mg2 svg{
    width:24px;
  }
  .menu-content .menu-info .menu-tel{
    font-size: 1.8rem;
  }
  .menu-content .menu-info .menu-tel a{
    font-size: 2.6rem;
  }
  .menu-content .menu-info .menu-tel2{
    font-size: 1.2rem;
    margin-bottom: 4rem;
  }
  .menu-content .menu-info .menu-mail a{
    font-size: 1.8rem;
    padding:20px 15px;
  }
}
@media screen and (max-width: 380px) {
  .menu-trigger {
    left:1rem;
  }
}

/* ----------------------------------------------------------------------
 pan
---------------------------------------------------------------------- */
#pan {
  position: absolute;
  font-size: 1.6rem;
  z-index: 3;
  right:100px;
  top:16rem;
}
#pan ul{
	display: flex;
	align-items: stretch;
	justify-content: flex-end;
}
#pan ul li{
	display: block;
	position: relative;
	overflow: hidden;
	padding: 5px 5px;
}
#pan ul li:nth-last-of-type(n+2){
	padding-right: 30px;
}
#pan ul li:nth-last-of-type(n+2):before{
	content: "";
	display: block;
	height: 6px;
	width: 6px;
	border-bottom: 1px solid #433728;
	border-right: 1px solid #433728;
	transform: rotate(-45deg);
	position: absolute;
	top: calc(50% - 3px);
	right: 13px;
}
#pan ul li a{
	display: block;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	color: #433728;
  transition: 0.3s ease-in-out;
}
#pan ul li a:hover{
	color: #433728;
  font-weight: bold;
}
@media screen and (max-width: 1280px) {
  #pan {
    font-size: 1.6rem;
    right:2rem;
    top:16rem;
  }
}
@media screen and (max-width: 1080px) {
  #pan {
    font-size: 1.6rem;
    right:2rem;
    top:13rem;
  }
}
@media screen and (max-width: 860px){
  #pan_wrap{
    min-width: auto;
  }
	#pan ul li:last-child{
    max-width:17em; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;
  }
}
@media screen and (max-width: 500px) {
  #pan {
    font-size: 1.4rem;
    left:1rem;
    right:auto;
    top:8rem;
  }
}
@media screen and (max-width: 400px){
	#pan {
      font-size: 1.2rem;
      padding:6px 0;
  }
}
/* ----------------------------------------------------------------------
 mmv
---------------------------------------------------------------------- */
#mmv{
  position: relative;
  width:100%;
  height: 600px;
  overflow: hidden;
}
#mmv::after {
  position: absolute;
  content:"";
  width:1420px;
  height:1620px;
  width: clamp(1100px, 71.00vw, 1420px);
  top:0;
  right:0;
  background: url(/assets/images/index/kv_c.svg) 100% 0 no-repeat;
  z-index:0;
}
#mmv .b{
  position: absolute;
  width:100%;
  height:100%;
  bottom:-100px;
  left:0;
  background: url(/assets/images/index/kv_bbg.png) 50% 100% no-repeat;
  background-size: 2200px auto;
  z-index:1;
}
#mmv .mmv-title{
  position: relative;
  display:block;
  text-align: center;
  z-index:3;
  margin-top: 30rem;
}
#mmv .mmv-title h1{
  display:inline-block;
  font-size: 4.0rem;
  background: #fff;
  padding: 0.8rem 3rem;
  border-radius: 1rem;
  line-height: 1.4;
  margin-top: -10px;
}
#mmv .mmv-title .sub{
  position: relative;
  font-size: 2.6rem;
  font-weight: bold;
  line-height: 1.2;
  text-shadow:3px 3px 0 #FFF, -3px -3px 0 #FFF,
              -3px 3px 0 #FFF, 3px -3px 0 #FFF,
              0px 3px 0 #FFF,  0 -3px 0 #FFF,
              -3px 0 0 #FFF, 3px 0 0 #FFF;
  z-index:4;
}
.about #mmv .mmv-title .sub,
.admission #mmv .mmv-title .sub,
.daily #mmv .mmv-title .sub{
  color:#ef5555;
}
.extra #mmv .mmv-title .sub{
  color:#09b9a4;
}
.news #mmv .mmv-title .sub{
  color:#7ed82e;
}
.faq #mmv .mmv-title .sub{
  color:#efd338;
}
.contact #mmv .mmv-title .sub{
  color:#1c9ffa;
}
.policy #mmv .mmv-title .sub{
  color:#e89c59;
}
#mmv .mobj{
  position: absolute;
  pointer-events: none;
  z-index:2;
}
#mmv .mobj.obj1{
  bottom:60px;
  right:17vw;
  width:61px;
  width: clamp(50px, 3.05vw, 61px);
  animation: mmv1hopAndShakePause 2.6s ease-in-out infinite;
  transform-origin: center bottom;
}
#mmv .mobj.obj2{
  bottom:60px;
  left:7.5vw;
  width:61px;
  width: clamp(51px, 17.90vw, 61px);
  animation: mmv1hopAndShakePause 3.6s ease-in-out infinite;
  transform-origin: center bottom;
}
#mmv .mobj.obj3{
  bottom:60px;
  right:28vw;
  width:75px;
  width: clamp(65px, 17.90vw, 75px);
  animation: hopAndShakePause2 3s ease-in-out infinite;
  transform-origin: center bottom;
}
#mmv .mobj.obj4{
  bottom:60px;
  left:18.5vw;
  width:75px;
  width: clamp(65px, 17.90vw, 75px);
  animation: hopAndShakePause2 4s ease-in-out infinite;
  transform-origin: center bottom;
}
#mmv .mobj.obj12{
  bottom:60px;
  right:8vw;
  width:80px;
  width: clamp(70px, 17.90vw, 80px);
  animation: hopAndShakePause2 5s ease-in-out infinite;
  transform-origin: center bottom;
}
#mmv .mobj.obj5{
  top:11.2vw;
  right:31.5vw;
  width:102px;
  width: clamp(90px, 17.90vw, 102px);
  z-index: 1;
  animation: cloudanime 2.2s ease-in-out infinite alternate-reverse;
}
#mmv .mobj.obj6{
  top:14.2vw;
  right:15.5vw;
  width:52px;
  width: clamp(42px, 17.90vw, 52px);
  z-index: 1;
  animation: cloudanime 1.4s ease-in-out infinite alternate-reverse;
}


@keyframes mmv1hopAndShakePause {
  0% {
    transform: translateY(0) rotateZ(0deg);
  }
  10% {
    transform: translateY(-8px) rotateZ(5deg);
  }
  20% {
    transform: translateY(0) rotateZ(0deg);
  }
  30% {
    transform: translateY(-8px) rotateZ(-5deg);
  }
  40% {
    transform: translateY(0) rotateZ(0deg);
  }
  100% {
    transform: translateY(0) rotateZ(0deg); /* 静止状態キープ */
  }
}
@keyframes hopAndShakePause2 {
  0% {
    transform: translateY(0);
  }
  10% {
    transform: translateY(-8px);
  }
  20% {
    transform: translateY(0);
  }
  30% {
    transform: translateY(-8px);
  }
  40% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(0) /* 静止状態キープ */
  }
}
@keyframes cloudanime {
    0% {
        transform: translateX(-10%);
    }
    100% {
        transform: translateX(10%);
    }
}
@media screen and (max-width: 1800px) {
  #mmv{
    height: 510px;
  }
  #mmv .b{
    bottom:-80px;
    background: url(/assets/images/index/kv_bbg.png) 0% 100% no-repeat;
    background-size: 100% auto;
  }
  #mmv .mmv-title{
    margin-top: 25rem;
  }
}
@media screen and (max-width: 1650px) {
  #mmv .b{
    bottom:-80px;
    background: url(/assets/images/index/kv_bbg.png) 0% 100% no-repeat;
    background-size: 1650px auto;
  }
}
@media screen and (max-width: 1480px) {
  #mmv .mmv-title h1{
    font-size: 3.4rem;
  }
  #mmv .mmv-title .sub{
    font-size: 2.0rem;
  }
  #mmv .mobj.obj5{
    top:14.2vw;
  }
  #mmv .mobj.obj6{
    top:19.2vw;
  }
}
@media screen and (max-width: 1300px) {
  #mmv .mobj.obj5{
    top:210px;
    width: clamp(70px, 6.15vw, 80px);
  }
  #mmv .mobj.obj6{
    top:280px;
    width: clamp(32px, 6.15vw, 42px);
  }
}
@media screen and (max-width: 1280px) {
  #mmv .mobj.obj5{
    top:210px;
    right:21.5vw;
    width: clamp(70px, 6.15vw, 80px);
  }
  #mmv .mobj.obj6{
    top:280px;
    right:5.5vw;
    width: clamp(32px, 6.15vw, 42px);
  }
}
@media screen and (max-width: 1080px) {
  #mmv{
    height: 410px;
  }
  #mmv::after {
    width: clamp(600px, 64.81vw, 700px);
  }
  #mmv .b{
    bottom:-80px;
    background: url(/assets/images/index/kv_bbg.png) 0% 100% no-repeat;
    background-size: 1380px auto;
  }
  #mmv .mmv-title{
    margin-top: 20rem;
  }
  #mmv .mmv-title h1{
    font-size: 3.0rem;
  }
  #mmv .mmv-title .sub{
    font-size: 2.0rem;
  }
  #mmv .mobj.obj1{
    right:17vw;
    width: clamp(30px, 3.70vw, 40px);
  }
  #mmv .mobj.obj2{
    left:7.5vw;
    width: clamp(30px, 3.70vw, 40px);
  }
  #mmv .mobj.obj3{
    right:28vw;
    width: clamp(45px, 3.70vw, 55px);
  }
  #mmv .mobj.obj4{
    left:18.5vw;
    width: clamp(45px, 3.70vw, 55px);
  }
  #mmv .mobj.obj12{
    right:3vw;
    width: clamp(50px, 3.70vw, 60px);
  }
  #mmv .mobj.obj5{
    top:200px;
    right:21.5vw;
    width: clamp(70px, 6.15vw, 80px);
  }
  #mmv .mobj.obj6{
    top:240px;
    right:5.5vw;
    width: clamp(32px, 6.15vw, 42px);
  }
}
@media screen and (max-width: 500px) {
  #mmv{
    height: 350px;
  }
  #mmv::after {
    width: clamp(380px, 60.00vw, 460px);
  }
  #mmv .mmv-title{
    margin-top: 14rem;
  }
  #mmv .mmv-title h1{
    font-size: 2.4rem;
  }
  #mmv .mmv-title .sub{
    font-size: 2.0rem;
  }
  #mmv .mobj.obj5{
    top:120px;
    right:21.5vw;
    width: clamp(30px, 60.00vw, 40px);
  }
  #mmv .mobj.obj6{
    top:140px;
    right:5.5vw;
    width: clamp(22px, 60.00vw, 32px);
  }
}
@media screen and (max-width: 375px) {
  #mmv .mmv-title h1{
    font-size: 2.0rem;
  }
  #mmv .mmv-title .sub{
    font-size: 1.6rem;
  }
}
/* ----------------------------------------------------------------------
 main
---------------------------------------------------------------------- */
main{
  position: relative;
  z-index:3;
  background: #fff;
  padding:6rem 0;
  border-radius: 3rem 3rem 0 0;
  margin-top: -60px;
}
/* ----------------------------------------------------------------------
 btn
---------------------------------------------------------------------- */
.cbtn a{
  position: relative;
  display:block;
  background: url(/assets/images/cmn/btn_bg.gif) 50% 0;
  border-radius: 100px;
  width:100%;
  max-width:520px;
  padding:52px 40px;
  font-size: 2.4rem;
  line-height: 1.2;
  font-weight: bold;
  color:#fff;
  background-position: 100% 100%;
  transition: 0.3s ease-in-out;
}
.cbtn a::before{
  position: absolute;
  content:"";
  background: url(/assets/images/cmn/arrow.svg) 50% 0;
  top:50%;
  transform: translateY(-50%);
  right:40px;
  width:24px;
  height:21px;
  background-size: cover;
  transition: 0.3s ease-in-out;
}
.cbtn a:hover{
  filter: hue-rotate(12deg);
  box-shadow: 1px 1px 12px rgba(16,108,122,.5);
}
.cbtn a:hover::before{
  right:30px;
}
@media screen and (max-width: 980px) {
  .cbtn a{
    max-width:520px;
    padding:40px 40px;
    font-size: 2.0rem;
  }
}
@media screen and (max-width: 500px) {
  .cbtn a{
    padding:30px 30px;
    font-size: 1.8rem;
  }
  .cbtn a::before{
    right:30px;
    width:19px;
    height:16px;
  }
  .cbtn a:hover::before{
    right:20px;
  }
}

/* ----------------------------------------------------------------------
 article_list
---------------------------------------------------------------------- */
.article_list1{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2.5rem;
  margin-bottom: 5rem;
}
.article_list1 article{
  position: relative;
  margin-bottom: 4rem;
}
.article_list1 article a{
  display:block;
  background: #fff;
  border: 1px solid #d5d5d5;
  height:100%;
  overflow: hidden;
  padding: 3.5rem 2.5rem 7rem;
  border-radius: 3rem 0 3rem 0;
}
.article_list1 article .label{
  position: absolute;
  width:100%;
  top:-1.8rem;
  left:0;
  padding-left: 2.5rem;
}
.article_list1 article .label span{
  display:inline-block;
  border-radius: 50px;
  padding:0.8rem 3rem;
  font-size: 1.8rem;
  font-weight: bold;
  background: #d1d1d1;
  line-height: 1.2;
  border: 1px solid #d1d1d1;
  transition: 0.3s ease-in-out;
}

.article_list1 article a .img{
	width: 100%;
  height: auto;
  aspect-ratio: 399 / 234;
  display: block;
  margin-bottom: 1.5rem;
}
.article_list1 article a .img span{
	width: 100%;
	height: 100%;
	overflow: hidden;
  backface-visibility: hidden;
  position: relative;
  z-index: 2;
  display: block;
  border-radius: 2rem 0 2rem 0;
  border: 1px solid #ece8e8;
}
.article_list1 article a .img span img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
  position: absolute;
  top: 0;
  left: 0;
	transform: scale(1);
  transition: transform 0.5s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
	transition: 0.5s ease-out;
}
.article_list1 article a:hover .img span img{
	transform: scale(1.07);
}
.article_list1 article a .data{
  font-size: 1.8rem;
  margin-bottom: 1rem;
  text-align: right;
  color: #433728;
}
.article_list1 article a .title{
  font-size: 2.0rem;
  font-weight: bold;
  color: #433728;
  line-height: 1.8;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.article_list1 article a:hover .title{
  filter:alpha(opacity=80);-moz-opacity: 0.8;opacity: 0.8;
}
.article_list1 article a .more{
  position: absolute;
  width:100%;
  right:1px;
  bottom:1px;
}
.article_list1 article a .more span{
  position: relative;
  display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
  align-items: center;
  color:#fff;
  width:190px;
  height:45px;
  font-weight: 700;
  font-size: 1.6rem;
  background: #584a37;
  padding-left:25px;
  line-height: 1.2;
  margin-left: auto;
  border-radius: 1rem 0 3rem 0;
}
.article_list1 article a .more span::after{
  position: absolute;
  content:"";
  background: url(/assets/images/cmn/arrow.svg) 50% 0;
  top:50%;
  transform: translateY(-50%);
  right:20px;
  width:15px;
  height:13px;
  background-size: cover;
  transition: 0.3s ease-in-out;
}
.article_list1 article a:hover .more span::after{
  right:15px;
}
.article_list1 article .label.label_info span{
  background: #dbf068;
  border: 1px solid #bed82e;
}
.article_list1 article .label.label_extra span{
  background: #9ae5cd;
  border: 1px solid #52c6a1;
}

.article_list1 article:hover .label.label_info span{
  background: #bed82e;
}
.article_list1 article:hover .label.label_extra span{
  background: #52c6a1;
}


/* ----------------------------------------------------------------------
 footer
---------------------------------------------------------------------- */
footer{
  width:100%;
}
footer .f1{
  width:100%;
  padding:130px 0;
  background: #f4f2eb;
}
footer .f1 .w{
  display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: wrap;
}
footer .f1 .w .elmL{
  width:435px;
}
footer .f1 .w .elmR{
  width:calc(100% - 435px);
}
footer .f1 .w .elmL h5{
  font-size: 3.2rem;
  font-weight: 500;
}
footer .f1 .w .elmL .sub{
  color:#37b098;
  margin-bottom: 4rem;
}
footer .f1 .w .elmL .desc{
  font-size: 1.8rem;
}
footer .f1 .w .meta_box{
  display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: wrap;
  width:100%;
  background: #fff;
  border-radius: 2rem;
  padding:3rem 0rem;
}
footer .f1 .w .meta_box li{
  width: 100%;
  padding:3rem 5rem;
}
footer .f1 .w .meta_box:has(li:nth-child(2)) li {
  width: 50%;
}
footer .f1 .w .meta_box li:nth-of-type(2){
  border-left: 1px solid #d3d3d3;
}
footer .f1 .w .meta_box li .mg,
footer .f1 .w .meta_box li .mg2{
  display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	width:100%;
  justify-content: center;
  align-items: center;
  margin-bottom: 1rem;
  color:#433728;
  font-size: 1.8rem;
}
footer .f1 .w .meta_box li .mg svg{
  fill:#37b098;
  width:30px;
  margin-right: 10px;
}
footer .f1 .w .meta_box li .mg2 svg{
  fill:#37b098;
  width:26px;
  margin-right: 10px;
}
footer .f1 .w .meta_box li .f-tel{
  display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	width:100%;
  justify-content: center;
  align-items: center;
  text-align: center;
  margin-bottom: 1rem;
  font-weight: 600;
  font-size: 2.0rem;
  line-height: 1.4;
}
footer .f1 .w .meta_box li .f-tel .t2{
  padding-left: 6px;
}
footer .f1 .w .meta_box li .f-tel a{
  font-weight: 600;
  color:#37b098;
  font-size: 3.6rem;
}
footer .f1 .w .meta_box li .f-tel a[href^="tel:"]{
  pointer-events: none;
  cursor: default;
}
footer .f1 .w .meta_box li .f-tel2{
  font-size: 1.4rem;
  text-align: center;
}
footer .f1 .w .meta_box li .f-mail{
  padding-top: 6px;
}
footer .f1 .w .meta_box li .f-mail a{
  display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
  justify-content: center;
  align-items: center;
  background: url(/assets/images/cmn/btn_bg02.gif) 50% 0;
  border-radius: 50px;
  width:100%;
  max-width:300px;
  margin:0 auto;
  padding:28px 15px;
  font-size: 2.0rem;
  line-height: 1.2;
  font-weight: bold;
  color:#fff;
  background-position: 100% 100%;
  transition: 0.3s ease-in-out;
}
footer .f1 .w .meta_box li .f-mail a:hover{
  filter: hue-rotate(12deg);
  box-shadow: 1px 1px 12px rgba(16,108,122,.5);
}

footer .f2{
  position: relative;
  padding:150px 0 150px;
}
footer .f2 .w{
  position: relative;
  display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: wrap;
  z-index:2;
}
footer .f2 .w .elmL{
  width:350px;
}
footer .f2 .w .elmR{
  width:calc(100% - 350px);
}
footer .f2 .w .elmL img{
  display:block;
  width:100%;
  max-width:270px;
  margin:0 auto 30px;
}
footer .f2 .w .elmL p{
  text-align: center;
  font-size: 1.8rem;
}
footer .f2 .w .elmR .f_listbox{
  position: relative;
  display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: wrap;
  justify-content: center;
  width:100%;
  padding-left:5rem;
}
footer .f2 .w .elmR .f_listbox article:nth-of-type(1){
  padding-right: 9rem;
}
footer .f2 .w .elmR .f_listbox article:nth-of-type(2){
  padding-left: 9rem;
}
footer .f2 .w .elmR .f_listbox article h6 {
  padding: 1rem 0;
}
footer .f2 .w .elmR .f_listbox article h6 a{
  position: relative;
  color: #433728;
  font-size: 1.8rem;
  font-weight: 500;
  padding-left: 30px;
  transition: 0.3s ease-in-out;
}
footer .f2 .w .elmR .f_listbox article h6 a::before{
  position: absolute;
  content:"";
  width:10px;
  height:10px;
  background:#433728;
  border-radius: 50px;
  top:50%;
  transform: translateY(-50%);
  left:0;
}
footer .f2 .w .elmR .f_listbox article ul {
  margin-left: 30px;
  margin-bottom: 1rem;
}
footer .f2 .w .elmR .f_listbox article ul li{
  margin-bottom: 1rem;
}
footer .f2 .w .elmR .f_listbox article ul li a{
  position: relative;
  color: #433728;
  font-size: 1.8rem;
  font-weight: 500;
  padding-left: 20px;
  transition: 0.3s ease-in-out;
}
footer .f2 .w .elmR .f_listbox article ul li a::before{
  position: absolute;
  content:"";
  width:10px;
  height:1px;
  background:#433728;
  border-radius: 50px;
  top:50%;
  transform: translateY(-50%);
  left:0;
}
footer .f2 .w .elmR .f_listbox article h6 a:hover,
footer .f2 .w .elmR .f_listbox article ul li a:hover{
  filter:alpha(opacity=70);-moz-opacity: 0.7;opacity: 0.7;
}
footer .f2 .pagetop{
  position: absolute;
  top:-38px;
  left:0;
  right:100%;
  width:100%;
  margin: 0 auto;
}
footer .f2 .pagetop a{
  position: relative;
  display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
  width:100%;
  max-width:365px;
  justify-content: center;
  align-items: center;
  height:75px;
  margin:0 auto;
  background:#433728;
  color:#fff;
  font-size: 1.8rem;
  font-weight: bold;
  transition: 0.3s ease-in-out;
  border: 3px solid #fff;
}
footer .f2 .pagetop a:hover{
  background:#564c40;
}
footer .f2 .pagetop a::after{
  content:"";
  position: absolute;
  top:50%;
  transform: translateY(-50%);
  right:25px;
  width:8px;
  height:8px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(315deg);
}
footer .copy{
  position: relative;
  display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
  width:100%;
  justify-content: center;
  align-items: flex-end;
  height:175px;
  padding:0 15px 15px;
}
footer .copy::before{
  position: absolute;
  content:"";
  width:100%;
  height:175px;
  bottom:0;
  left:0;
  background: url(/assets/images/cmn/fbg.svg) 50% 100% no-repeat;
  background-size: auto 175px;
  z-index:1;
}
footer .copy p{
  text-align: center;
  position: relative;
  z-index:2;
  font-size: 1.4rem;
}
@media screen and (max-width: 1855px) {
  footer .copy::before{
    height:145px;
    background: url(/assets/images/cmn/fbg.svg) 50% 100% no-repeat;
    background-size: auto 145px;
  }
}

@media screen and (max-width: 1400px) {
  footer .f1 .w .meta_box li{
    padding:3rem 2rem;
  }
  footer .copy{
    height:125px;
    padding:0 15px 15px;
  }
  footer .copy::before{
    height:125px;
    background: url(/assets/images/cmn/fbg.svg) 50% 100% no-repeat;
    background-size: auto 125px;
  }
}
@media screen and (max-width: 1230px) {
  footer .f1 .w .meta_box li{
    padding:3rem 2rem;
  }
  footer .f1 .w .elmL{
    width:375px;
  }
  footer .f1 .w .elmR{
    width:calc(100% - 375px);
  }
}
@media screen and (max-width: 1160px) {
  footer .f1{
    padding:80px 0 120px;
  }
  footer .f1 .w .elmL h5{
    font-size: 2.8rem;
  }
  footer .f1 .w .elmL .sub{
    margin-bottom: 2rem;
  }
  footer .f1 .w .elmL .desc{
    font-size: 1.8rem;
    margin-bottom: 3rem;
  }
  footer .f1 .w .elmL .desc br{
    display:none;
  }
  footer .f1 .w .elmL{
    width:100%;
    text-align: center;
  }
  footer .f1 .w .elmR{
    width:100%;
  }
  footer .f2 .w .elmL{
    width:260px;
  }
  footer .f2 .w .elmR{
    width:calc(100% - 260px);
  }
  footer .f2 .w .elmL img{
    max-width:220px;
    margin:0 auto 30px;
  }
  footer .f2 .w .elmL p{
    text-align: center;
    font-size: 1.4rem;
  }
  footer .f2 .w .elmR .f_listbox article:nth-of-type(1){
    padding-right: 4rem;
  }
  footer .f2 .w .elmR .f_listbox article:nth-of-type(2){
    padding-left: 4rem;
  }
}
@media screen and (max-width: 960px) {
  footer .f2 .w .elmL p{
    font-size: 1.8rem;
  }
  footer .f2 .w .elmR .f_listbox{
    padding-left:0rem;
  }
  footer .f2 .w .elmL{
    width:100%;
    margin-bottom: 5rem;
  }
  footer .f2 .w .elmR{
    width:100%;
  }
}
@media screen and (max-width: 860px) {
  footer .f1 .w .meta_box li .f-tel a[href^="tel:"]{
    pointer-events: auto;
    cursor: pointer;
  }
}
@media screen and (max-width: 680px) {
  footer .f1{
    padding:60px 0 100px;
  }
  footer .f1 .w .elmL .desc br{
    display:block;
  }
  footer .f1 .w .meta_box li{
    padding:0rem 2rem;
  }
  footer .f1 .w .meta_box:has(li:nth-child(2)) li {
    width: 100%;
  }
  footer .f1 .w .meta_box li:nth-of-type(2){
    margin-top: 3rem;
    padding-top: 3rem;
    border-left: none;
    border-top: 1px solid #d3d3d3;
  }
  footer .f2{
    position: relative;
    padding:80px 0 30px;
  }
  footer .f2 .w .elmL{
    width:100%;
    margin-bottom: 0rem;
  }
  footer .f2 .w .elmR{
    display:none;
  }
  footer .copy{
    height:65px;
    padding:0 5px 15px;
  }
  footer .copy::before{
    height:65px;
    background: url(/assets/images/cmn/fbg.svg) 50% 100% no-repeat;
    background-size: auto 65px;
  }
}
@media screen and (max-width: 500px) {
  footer .f1 .w .elmL h5{
    font-size: 2.2rem;
  }
  footer .f1 .w .elmL .sub{
    margin-bottom: 1.6rem;
  }
  footer .f1 .w .elmL .desc{
    font-size: 1.6rem;
    margin-bottom: 3rem;
  }
  footer .f1 .w .meta_box li .mg,
  footer .f1 .w .meta_box li .mg2{
    font-size: 1.6rem;
  }
  footer .f1 .w .meta_box li .f-tel{
    font-size: 1.6rem;
  }
  footer .f1 .w .meta_box li .f-tel a{
    font-size: 3.0rem;
  }
}
@media screen and (max-width: 320px) {
  footer .f1 .w .elmL .desc{
    font-size: 1.4rem;
    margin-bottom: 2rem;
  }
}
/*----------------------------side_cta-----------------------------------*/
#side_cta{
  position: fixed;
  width:80px;
  height: 600px;
  top:calc(50% - 300px);
  right: 1rem;
  z-index:10;
}
#side_cta ul{
  position: relative;
  display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
  flex-direction: column;
  width:80px;
  height:600px;
  border-radius:
}
#side_cta ul::before,
#side_cta ul::after{
  content: "";
  position: absolute;
  right: -0.1rem;
  width: 1.7rem;
  height: 1.7rem;
  background-color: #fff;
}
#side_cta ul::before{
  top: -1.6rem;
  bottom: auto;
  mask-image: radial-gradient(circle at 0% 0%, transparent 1.6rem, #fff 1.61rem);
  -webkit-mask-image: radial-gradient(circle at 0% 0%, transparent 1.6rem, #fff 1.61rem);
}
#side_cta ul::after{
  top: auto;
  bottom: -1.6rem;
  mask-image: radial-gradient(circle at 0% 100%, transparent 1.6rem, #fff 1.61rem);
  -webkit-mask-image: radial-gradient(circle at 0% 100%, transparent 1.6rem, #fff 1.61rem);
}
#side_cta ul li{
  height:300px;
}
#side_cta ul li a{
  position: relative;
  display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: left;
  background: #fff;
  line-height: 1.4;
  font-size: 1.8rem;
  height:300px;
  color: #433728;
  font-weight: 600;
  transition: 0.3s ease-in-out;
}
#side_cta ul li:nth-of-type(1) a{
  border-radius: 2rem 0 0 0;
}
#side_cta ul li:nth-of-type(2) a{
  border-radius: 0 0 0 2rem;
}
#side_cta ul li:nth-of-type(1) a::after{
  content:"";
  position: absolute;
  bottom:0;
  left:calc(50% - 20px);
  width:40px;
  height:1px;
  background: #beb9b3;
}
#side_cta ul li a .i img{
  display:block;
  width:100%;
  max-width:40px;
  margin:0 auto;
}
#side_cta ul li a .t{
  margin-top: .9rem;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}
#side_cta ul li a .ico_circle-right {
  margin-top: .9rem;
  width: 2.4rem;
  height: 2.4rem
}
#side_cta ul li a .ico_circle-right .svg-path {
  fill: #433728;
}

#side_cta ul li:nth-of-type(1) a:hover{
  color:#ef5555;
}
#side_cta ul li:nth-of-type(2) a:hover{
  color:#09b9a4;
}
#side_cta ul li:nth-of-type(1) a:hover .ico_circle-right .svg-circle {
  fill: #ef5555;
}
#side_cta ul li:nth-of-type(2) a:hover .ico_circle-right .svg-circle {
  fill: #09b9a4;
}
#side_cta ul li a:hover .ico_circle-right .svg-path {
  fill: #fff
}
@media screen and (max-width: 1280px) {
  #side_cta{
    position: fixed;
    width:600px;
    height: 80px;
    top:auto;
    bottom:0;
    right: 1rem;
  }
  #side_cta ul{
    flex-direction: row;
    width:600px;
    height:80px;
  }
  #side_cta ul::before,
  #side_cta ul::after{
    content: "";
    position: absolute;
    right: -0.1rem;
    width: 1.7rem;
    height: 1.7rem;
    background-color: #fff;
  }
  #side_cta ul::before{
    top: auto;
    right:auto;
    bottom: 0;
    left: -1.6rem;
    mask-image: radial-gradient(circle at 0% 0%, transparent 1.6rem, #fff 1.61rem);
    -webkit-mask-image: radial-gradient(circle at 0% 0%, transparent 1.6rem, #fff 1.61rem);
  }
  #side_cta ul::after{
    display:none;
  }
  #side_cta ul li{
    height:80px;
  }
  #side_cta ul li a{
    flex-direction: row;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
    height:80px;
    width:300px;
  }
  #side_cta ul li:nth-of-type(2) a{
    border-radius: 0 0 0 0rem;
  }
  #side_cta ul li:nth-of-type(1) a::after{
    bottom:calc(50% - 20px);
    left:auto;
    right:0;
    width:1px;
    height:40px;
  }
  #side_cta ul li a .t{
    margin-top: 0rem;
    margin-left: .9rem;
    -webkit-writing-mode: initial;
    -ms-writing-mode: initial;
    writing-mode: initial;
  }
  #side_cta ul li a .ico_circle-right {
    margin-top: 0rem;
    margin-left: .9rem;
  }
}
@media screen and (max-width: 760px) {
  #side_cta{
    right: 0rem;
  }
}
@media screen and (max-width: 680px) {
  #side_cta{
    width:100%;
    height: 80px;
  }
  #side_cta ul{
    flex-direction: row;
    width:100%;
    height:80px;
    border-radius: 2rem 2rem 0 0;
    box-shadow: 0px -2px 15px -5px #777777;
    border-radius: 10px;
  }
  #side_cta ul::before,
  #side_cta ul::after{
    display:none;
  }
  #side_cta ul li{
    width:50%;
    height:80px;
  }
  #side_cta ul li a{
    font-size: 1.8rem;
    height:80px;
    width:100%;
  }
  #side_cta ul li:nth-of-type(2) a{
    border-radius: 0 2rem 0 0rem;
  }
}
@media screen and (max-width: 500px) {
  #side_cta ul li a{
    font-size: 1.6rem;
    height:80px;
  }
  #side_cta ul li a .i img{
    max-width:30px;
  }
}
@media screen and (max-width: 430px) {
  #side_cta{
    height: 70px;
  }
  #side_cta ul{
    height:70px;
  }
  #side_cta ul li{
    width:50%;
    height:70px;
  }
  #side_cta ul li a{
    font-size: 1.4rem;
    height:70px;
  }
  #side_cta ul li a .i img{
    max-width:20px;
  }
}
@media screen and (max-width: 320px) {
  #side_cta ul li a{
    font-size: 1.2rem;
  }
}
/*----------------------------load-----------------------------------*/

#load{
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 100;
}
#load div:nth-of-type(1),
#load div:nth-of-type(2){
	height: 50%;
	width: 100%;
	background: #fff;
	position: absolute;
	left: 0;
	-webkit-transition: 0.8s ease-in-out;
	-moz-transition: 0.8s ease-in-out;
	-o-transition: 0.8s ease-in-out;
	transition: 0.8s ease-in-out;
}
#load div:nth-of-type(1){
	top: 0;
}
#load div:nth-of-type(2){
	top: 50%;
}
#load .loader {
	position: relative;
	display: inline-block;
	width: 50px;
	height: 50px;
	border: 2px solid #37b098;
	border-radius: 50%;
	animation: spin 0.75s infinite linear;
	position: absolute;
	top: calc(50% - 25px);
	left: calc(50% - 25px);
	display: block;
}
#load .loader::before,
#load .loader::after {
	left: -2px;
	top: -2px;
	display: none;
	position: absolute;
	content: '';
	width: inherit;
	height: inherit;
	border: inherit;
	border-radius: inherit;
}
#load .loader-5,
#load .loader-5::before {
	display: inline-block;
	border-color: transparent;
	border-top-color: #37b098;
}
#load .loader-5::before {
	animation: spin 1.5s infinite ease;
}
@keyframes spin {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}
