@charset "UTF-8";
@keyframes shine {
  100% {
    left: 125%;
  }
}
#contents .sec_menu .wrapper .box.bg1{
  background: linear-gradient(to bottom,rgba(0,0,0,0.7),rgba(0,0,0,0.7)),url(../images/eight_menu01.jpg) center/100% no-repeat;
}
#contents .sec_menu .wrapper .box.bg2{
  background: linear-gradient(to bottom,rgba(0,0,0,0.7),rgba(0,0,0,0.7)),url(../images/eight_menu02.jpg) center/100% no-repeat;
}
#contents .sec_menu .wrapper .box.bg3{
  background: linear-gradient(to bottom,rgba(0,0,0,0.7),rgba(0,0,0,0.7)),url(../images/eight_menu03.jpg) center/100% no-repeat;
}
#contents .sec_menu .wrapper .box.bg4{
  background: linear-gradient(to bottom,rgba(0,0,0,0.7),rgba(0,0,0,0.7)),url(../images/eight_menu04.jpg) center/100% no-repeat;
}
#contents .sec_menu .wrapper .box.bg5{
  background: linear-gradient(to bottom,rgba(0,0,0,0.7),rgba(0,0,0,0.7)),url(../images/eight_menu05.jpg) center/100% no-repeat;
}
#contents .sec_menu .wrapper .box.bg6{
  background: linear-gradient(to bottom,rgba(0,0,0,0.7),rgba(0,0,0,0.7)),url(../images/eight_menu06.jpg) center/100% no-repeat;
}
#contents .sec_menu .wrapper .box.bg7{
  background: linear-gradient(to bottom,rgba(0,0,0,0.7),rgba(0,0,0,0.7)),url(../images/eight_menu07.jpg) center/100% no-repeat;
}
#contents .sec_menu .wrapper .box.bg8{
  background: linear-gradient(to bottom,rgba(0,0,0,0.7),rgba(0,0,0,0.7)),url(../images/eight_menu08.jpg) center/100% no-repeat;
}

#sec01 .contact_newbox{
  background: linear-gradient(to right,rgba(255,255,255,.9) 0%,rgba(255,255,255,.25) 100%),url(images/bg01.jpg) center left/100% no-repeat;
}
#sec02 .contact_newbox{
  background: linear-gradient(to right,rgba(255,255,255,.9) 0%,rgba(255,255,255,.25) 100%),url(images/bg02.jpg) center left/100% no-repeat;
}
#sec03 .contact_newbox{
  background: linear-gradient(to right,rgba(255,255,255,.9) 0%,rgba(255,255,255,.25) 100%),url(images/bg03.jpg) center left/100% no-repeat;
}
#sec04 .contact_newbox{
  background: linear-gradient(to right,rgba(255,255,255,.9) 0%,rgba(255,255,255,.25) 100%),url(images/bg04_02.jpg) center left/100% no-repeat;
}
#sec05 .contact_newbox{
  background: linear-gradient(to right,rgba(255,255,255,.9) 0%,rgba(255,255,255,.25) 100%),url(images/bg05.jpg) center left/100% no-repeat;
}
#sec06 .contact_newbox{
  background: linear-gradient(to right,rgba(255,255,255,.9) 0%,rgba(255,255,255,.25) 100%),url(images/bg06.jpg) center left/100% no-repeat;
}
#sec07 .contact_newbox{
  background: linear-gradient(to right,rgba(255,255,255,.9) 0%,rgba(255,255,255,.25) 100%),url(images/bg07.jpg) center left/100% no-repeat;
}
#sec08 .contact_newbox{
  background: linear-gradient(to right,rgba(255,255,255,.9) 0%,rgba(255,255,255,.25) 100%),url(images/bg08.jpg) center left/100% no-repeat;
}
/* ----------------------------------------------

PC設定

------------------------------------------------*/
@media all and (min-width: 769px) {

/* ----------------------------------------------
topImage
------------------------------------------------*/
#under_page #container #topImage {
  background: url(images/topImage.jpg) center 30%/cover no-repeat;
}
#under_page #container #topImage h1 .ja{
  text-align: center;
  display: block;
}
#under_page #container #topImage h1 .ja .under_bar{
  font-size: 48px;
  color: #fff;
  text-shadow: 3px 3px 3px #000;
  position: relative;
}
#under_page #container #topImage h1 .ja .gold{
  font-size: 120px;
  background: linear-gradient(to right, #e8e29d 0%, #885d1e 100%);
  background-clip: text;
  -webkit-background-clip: text;
  text-fill-color:transparent;
  -webkit-text-fill-color:transparent;
  vertical-align: -30px;
  position: relative;
  z-index: 1;
}
#under_page #container #topImage h1 .ja .gold::after{
  content: "8";
  display: inline-block;
  font-size: 120px;
  background: rgba(0,0,0,0.6);
  background-clip: text;
  -webkit-background-clip: text;
  text-fill-color:transparent;
  -webkit-text-fill-color:transparent;
  position: absolute; 
  top: 0px;
  left: 3px;
  z-index: -1;
}
#under_page #container #topImage h1 .en {
  text-align: center;
  display: block;
  font-size: 30px;
  color: #fff;
  text-shadow: 1px 1px 2px #000;
  position: relative;
  letter-spacing: 3px;
  margin: -2rem 0 2rem;
}
#under_page #container #topImage h1 .en .gold{
  font-size: 30px;
  background: linear-gradient(to right, #e8e29d 0%, #885d1e 100%);
  background-clip: text;
  -webkit-background-clip: text;
  text-fill-color:transparent;
  -webkit-text-fill-color:transparent;
  position: relative;
  z-index: 1;
  text-shadow: none; 
  padding-bottom: 3px;
}
#under_page #container #topImage h1 .en .gold::after{
  content: "eight";
  display: inline-block;
  font-size: 30px;
  background: rgba(0,0,0,0.6);
  background-clip: text;
  -webkit-background-clip: text;
  text-fill-color:transparent;
  -webkit-text-fill-color:transparent;
  position: absolute; 
  top: 0px;
  left: 3px;
  z-index: -1;
}

#container main{
  background:linear-gradient(to right,#fff 0%,#ccc 50%,#fff 100%) ;
}

/* ----------------------------------------------
sec_menu
------------------------------------------------*/
#contents .sec_menu {
  position: relative;
  padding: 2rem 0;
  z-index: 1;
}
#contents .sec_menu .bg,#contents .sec_menu .bg::after{
  position: absolute;
  top: 0;
  right: 0;
  width: 35vw;
  max-width: 560px;
  height: 35vw;
  max-height: 560px;
  clip-path: polygon(0 0, 100% 100%, 100% 0);
  -webkit-clip-path: polygon(0 0, 100% 100%, 100% 0);
  background-color: rgba(166,144,40,0.4);
  z-index: -1;
}
#contents .sec_menu .bg::after{
  content: "";
  display: inline-block;
  width: 31.25vw;
  max-width: 500px;
  height: 31.25vw;
  max-height: 500px;
  background-color: rgba(166,144,40,0.6);
  z-index: -1;
}
#contents .sec_menu .wrapper{
  position: relative;
  padding: 2rem 0;
  flex-wrap: wrap;
  grid-gap: 1rem;
}
#contents .sec_menu .wrapper .box{
  width: calc(25% - .75rem);
}
#contents .sec_menu .wrapper .box .num{
  font-size: 32px;
  padding: 0 0.5em;
  display: inline-block;
  background-color: #a69028;
  color: #fff;
}
#contents .sec_menu .wrapper .box .text,#contents .sec_menu .wrapper .box .text .br{
  display: block;
  text-align: center;
  color: #fff;
  font-size: clamp(1.125rem, 0.893rem + 0.71vw, 1.75rem);/*18~28px(520~1920px)*/
  position: relative;
}
#contents .sec_menu .wrapper .box .text::after{
  content: ">";
  display: block;
  text-align: center;
  color: #fff;
  font-size: 20px;
  transform: rotate(90deg);
}

/* ----------------------------------------------
eight_sec
------------------------------------------------*/
#contents .eight_sec {
  position: relative;
  padding: 0 0 2rem;
}
#contents .eight_sec .titlebg{
  padding: 1.5rem 0 3rem;
}
#contents .eight_sec.right .titlebg{
  text-align: right;
}
#contents .eight_sec.sec1 .titlebg{
  background:url(images/bg01.jpg) center /cover no-repeat ;
}
#contents .eight_sec.sec2 .titlebg{
  background:url(images/bg02.jpg) center /cover no-repeat ;
}
#contents .eight_sec.sec3 .titlebg{
  background:url(images/bg03.jpg) center /cover no-repeat ;
}
#contents .eight_sec.sec4 .titlebg{
  background:url(images/bg04.jpg) center /cover no-repeat ;
}
#contents .eight_sec.sec5 .titlebg{
  background:url(images/bg05.jpg) center /cover no-repeat ;
}
#contents .eight_sec.sec6 .titlebg{
  background:url(images/bg06.jpg) center /cover no-repeat ;
}
#contents .eight_sec.sec7 .titlebg{
  background:url(images/bg07.jpg) center /cover no-repeat ;
}
#contents .eight_sec.sec8 .titlebg{
  background:url(images/bg08.jpg) center /cover no-repeat ;
}
#contents .eight_sec .titlebg h2{
  width: 50%;
  display: inline-block;
  background: url(images/title_bg.svg) center /100% 100% no-repeat;
  position: relative;
  padding: 2rem 0 4rem;
}
#contents .eight_sec .titlebg h2 .num{
  font-size:48px ;
  color: #fff;
  margin-bottom: 1rem;
  display: block;
  text-align: center;
}
#contents .eight_sec .titlebg h2 .text .br{
  font-size:36px ;
  color: #fff;
  display: block;
  text-align: center;
}
#contents .eight_sec .inner{
  padding: 1rem 0;
}
#contents .eight_sec .inner h3{
  text-align: center;
  position: relative;
  margin-bottom: 2rem;
}
#contents .eight_sec .inner h3::before{
  content: url(images/title_l.svg);
  display: inline-block;
  width: 40%;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
#contents .eight_sec .inner h3::after{
  content: url(images/title_r.svg);
  display: inline-block;
  width: 40%;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}
#contents .eight_sec .inner h3 span{
  font-size: 22px;
  display: inline-block;
  position: relative;
}
#contents .eight_sec .inner h3 span::after{
  content: url(../images/title_under.svg);
  display: inline-block;
  width: 80px;
  position: absolute;
  bottom: -1rem;
  left: 50%;
  transform: translateX(-50%);
}
#contents .eight_sec .inner .q_area{
  width: 90%;
  position: relative;
  padding:1rem 1rem 1rem 0;
  border: #000 1px solid;
  margin-bottom: 2rem;
  background-color: #fff;
  min-height: 190px;
}
#contents .eight_sec .inner .q_area .mark{
  position: absolute;
  top: 0;
  left: 0;
  border-bottom-right-radius: 10px;
  font-size: 42px;
  color: #fff;
  line-height: 1;
  background: linear-gradient(to left,#000,#333,#000);
  padding: 0.5rem 1rem 1.3rem;
}
#contents .eight_sec .inner .q_area .title{
  padding-left: 110px;
  margin-bottom: 1rem;
}
#contents .eight_sec .inner .q_area.notext{
  min-height: 110px;
}
#contents .eight_sec .inner .q_area.notext .title{
  padding-left: 200px;
}
#contents .eight_sec .inner .q_area .text{
  padding-left: 110px;
}
#contents .eight_sec .inner .q_area .title span{
  font-size: 24px;
  text-decoration: underline;
  display: block;
  font-weight: bold;
}
#contents .eight_sec .inner .q_area .title span{
  font-size: 24px;
  text-decoration: underline;
  display: block;
  font-weight: bold;
}
#contents .eight_sec .inner .q_area .title span:nth-of-type(2){
  padding-left: 4em;
}
#contents .eight_sec .inner .q_area .text span{
  font-size: 18px;
  display: block;
  font-weight: normal;
}
#contents .eight_sec .inner .q_area figure{
  width: 80px;
  position: absolute;
  bottom: 0;
  left: 0;
}
#contents .eight_sec .inner .q_area.notext figure{
  bottom: 0;
  left: 80px;
}
#contents .eight_sec .inner .a_area{
  width: 90%;
  position: relative;
  padding:1rem 2rem 2rem;
  margin-bottom: 2rem;
  margin-left: auto;
  z-index: 1;
  /* background:url(images/A_box.svg) center/100% 100% no-repeat; */
}
#contents .eight_sec .inner .a_area .A_bg{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
#contents .eight_sec .inner .a_area .mark{
  position: absolute;
  top: 0;
  left: 0;
  border-bottom-right-radius: 10px;
  font-size: 42px;
  color: #fff;
  line-height: 1;
  background: linear-gradient(to left,#e8e29d,#885d1e);
  padding: 0.5rem 1rem 1.3rem;
}
#contents .eight_sec .inner .a_area .title{
  padding-left: 70px;
  margin-bottom: 1rem;
  min-height: 72px;
}
#contents .eight_sec .inner .a_area .text{
  padding-right: 110px;
}
#contents .eight_sec .inner .a_area .title span{
  font-size: 24px;
  text-decoration: underline;
  display: block;
  font-weight: bold;
}
#contents .eight_sec .inner .a_area .title span{
  font-size: 24px;
  text-decoration: underline;
  display: block;
  font-weight: bold;
}
#contents .eight_sec .inner .a_area .title span:nth-of-type(2){
  padding-left: 4em;
}
#contents .eight_sec .inner .a_area .text span{
  font-size: 18px;
  display: block;
  font-weight: normal;
}
#contents .eight_sec .inner .a_area figure{
  width: 100px;
  position: absolute;
  bottom: 10px;
  right: 25px;
}

#contents .contact{
  align-items: stretch;
  justify-content: space-between;
  width: 80%;
  max-width: 700px;
  background:url(images/contact_bg.svg) center/auto;
  border: 1px solid #000;
  margin: 0 auto 1rem;
}
#contents .contact .textarea{
  width: calc(100% - 2rem - 150px);
  margin: 0 1rem;
}
#contents .contact .textarea .title{
  margin-bottom: 0.5rem;
}
#contents .contact .textarea .title .small{
  font-size: 16px;
  display: block;
}
#contents .contact .textarea .title .main{
  font-size: 20px;
  padding-left: 5rem;
  display: block;
}
#contents .contact .textarea .box{
  justify-content: space-between;
  align-items: center;
}
#contents .contact .textarea .box .tel{
  display: flex;
  align-items: center;
  font-size: 20px;
  border: 1px solid #e8e29d;
  border-image: linear-gradient(to left,#e8e29d,#885d1e);
  border-image-slice: 1;
  background-color: #fff;
  padding: 0.5rem 1.5rem;
}
#contents .contact .textarea .box .tel::before{
  content: url(images/tel.svg);
  width: 20px;
  display: inline-block;
  margin-right: 1rem;
}
#contents .contact .textarea .box .mail{
  border: 1px solid #000;
  background:linear-gradient(to left,#e8e29d,#885d1e) ;
  font-size: 18px;
  color: #fff;
  padding: 0.5rem 1.5rem;
}
#contents .contact .textarea .box .mail .small{
  font-size: 16px;
  color: #fff;
}
#contents .contact figure{
  max-width: 120px;
}


/* お問合せ（新しいパターン） */
#contents .contact_newbox {
  max-width: 1200px;
  margin: min(3vw,2rem) auto;
  padding: min(1.5vw,1rem);
  border: 1px solid;
  border-image: linear-gradient(140deg, #C8A343 0%, #E1C665 20%, #C59F40 38%, #EFF2CC 66%, #A47623 91%);
  border-image-slice: 1;
}
#contents .contact_newbox .text_area {
  width: 50%;
  padding: min(1.5vw,1rem);
  background-color: rgba(255, 255, 255, .5);
}
#contents .contact_newbox .text_area .tit {
  font-size: clamp(1.25rem, 0.955rem + 0.91vw, 1.75rem);/*20~28px(520~1400px)*/
  margin-bottom: .5em;
}
#contents .contact_newbox .text_area .text {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: flex-start;
  grid-gap: .25rem;
  margin-bottom: 1rem;
}
#contents .contact_newbox .text_area .text figure {
  max-width: 275px;
  padding: .5rem;
  background-color: #fff;
  border: 1px solid #000;
}
#contents .contact_newbox .text_area .text .txt {
  font-size: clamp(0.875rem, 0.727rem + 0.45vw, 1.125rem);/*14~16px(520~1400px)*/
}
#contents .contact_newbox .buttonarea>div {
  width: 100%;
}
#contents .contact_newbox .buttonarea>div a {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  grid-gap: .5rem;
}
#contents .contact_newbox .telarea{
  background: linear-gradient(140deg, #C8A343 0%, #E1C665 20%, #C59F40 38%, #EFF2CC 66%, #A47623 91%);
  box-shadow: 3px 3px 5px rgba(0, 0, 0, .35);
  margin-bottom: 1rem;
}
#contents .contact_newbox .telarea img{
  width: 18px;
}
#contents .contact_newbox .telarea a{
  pointer-events: none;
  padding: .5rem clamp(1rem, 0.409rem + 1.82vw, 2rem);/*16~32px(520~1400px)*/
}
#contents .contact_newbox .telarea .txt{
  font-size: clamp(1.25rem, 0.955rem + 0.91vw, 1.75rem);/*20~28px(520~1400px)*/
  color: #fff;
  line-height: 1;
}

#contents .contact_newbox .mailarea{
  background: #000;
  box-shadow: 3px 3px 5px rgba(0, 0, 0, .35);
}
#contents .contact_newbox .mailarea a{
  width: 100%;
  padding: 1rem clamp(1rem, 0.409rem + 1.82vw, 2rem);/*16~32px(520~1400px)*/
  position: relative;
}
#contents .contact_newbox .mailarea img{
  width: 28px;
}
#contents .contact_newbox .mailarea .txt{
  font-size: clamp(1rem, 0.778rem + 0.68vw, 1.375rem);/*16~22px(520~1400px)*/
  color: #fff;
  line-height: 1;
}
#contents .contact_newbox .mailarea a::before{
  content: '';
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .3) 100%);
  transform: skewX(-25deg);
}
#contents .contact_newbox .mailarea a:hover::before{
  animation: shine 1.2s;
}

@media all and (min-width: 769px) and (max-width: 1000px) {
#contents .sec_menu .wrapper .box{
  width: calc(calc(100% / 3) - calc(2rem / 3));
}
#contents .sec_menu .wrapper .box .num{
font-size: 28px;
}
#contents .eight_sec .titlebg,#contents .eight_sec.right .titlebg{
  text-align: center;
}
#contents .eight_sec .titlebg h2{
  width: 80%;
}
#contents .eight_sec .inner .q_area,#contents .eight_sec .inner .a_area{
  width: 100%;
}
#contents .eight_sec .inner .q_area .title{
  padding-left: 80px;
}
#contents .eight_sec .inner .a_area .title{
  padding-left: 50px;
}
#contents .eight_sec .inner .q_area .title span:nth-of-type(2){
  padding-left: 1em;
}
#contents .eight_sec .inner h3::before{
  content: url(images/title_l_sp.svg);
  width: 35%;
}
#contents .eight_sec .inner h3::after{
  content: url(images/title_r_sp.svg);
  width: 35%;
}

  #contents .contact .textarea .box{
    flex-direction: column;
  }
  #contents .contact .textarea .box>p{
    margin-bottom: 1rem;
  }
  #contents .contact figure{
    max-width: 165px;
  }
}
}

/* ----------------------------------------------

pad設定

------------------------------------------------*/
@media all and (min-width: 520px) and (max-width: 769px) {

  /* ----------------------------------------------
topImage
------------------------------------------------*/
#under_page #container #topImage {
  background: url(images/topImage.jpg) center 30%/cover no-repeat;
}
#under_page #container #topImage h1 .ja{
  text-align: center;
  display: block;
}
#under_page #container #topImage h1 .ja .under_bar{
  font-size: 48px;
  color: #fff;
  text-shadow: 3px 3px 3px #000;
  position: relative;
}
#under_page #container #topImage h1 .ja .gold{
  font-size: 120px;
  background: linear-gradient(to right, #e8e29d 0%, #885d1e 100%);
  background-clip: text;
  -webkit-background-clip: text;
  text-fill-color:transparent;
  -webkit-text-fill-color:transparent;
  vertical-align: -30px;
  position: relative;
  z-index: 1;
}
#under_page #container #topImage h1 .ja .gold::after{
  content: "8";
  display: inline-block;
  font-size: 120px;
  background: rgba(0,0,0,0.6);
  background-clip: text;
  -webkit-background-clip: text;
  text-fill-color:transparent;
  -webkit-text-fill-color:transparent;
  position: absolute; 
  top: 0px;
  left: 3px;
  z-index: -1;
}
#under_page #container #topImage h1 .en {
  text-align: center;
  display: block;
  font-size: 30px;
  color: #fff;
  text-shadow: 1px 1px 2px #000;
  position: relative;
  letter-spacing: 3px;
  margin: -2rem 0 2rem;
}
#under_page #container #topImage h1 .en .gold{
  font-size: 30px;
  background: linear-gradient(to right, #e8e29d 0%, #885d1e 100%);
  background-clip: text;
  -webkit-background-clip: text;
  text-fill-color:transparent;
  -webkit-text-fill-color:transparent;
  position: relative;
  z-index: 1;
  text-shadow: none; 
  padding-bottom: 3px;
}
#under_page #container #topImage h1 .en .gold::after{
  content: "eight";
  display: inline-block;
  font-size: 30px;
  background: rgba(0,0,0,0.6);
  background-clip: text;
  -webkit-background-clip: text;
  text-fill-color:transparent;
  -webkit-text-fill-color:transparent;
  position: absolute; 
  top: 0px;
  left: 3px;
  z-index: -1;
}

#container main{
  background:linear-gradient(to right,#fff 0%,#ccc 50%,#fff 100%) ;
}

/* ----------------------------------------------
sec_menu
------------------------------------------------*/
#contents .sec_menu {
  position: relative;
  padding: 2rem 0;
  z-index: 1;
}
#contents .sec_menu .bg,#contents .sec_menu .bg::after{
  position: absolute;
  top: 0;
  right: 0;
  width: 35vw;
  max-width: 560px;
  height: 35vw;
  max-height: 560px;
  clip-path: polygon(0 0, 100% 100%, 100% 0);
  -webkit-clip-path: polygon(0 0, 100% 100%, 100% 0);
  background-color: rgba(166,144,40,0.4);
  z-index: -1;
}
#contents .sec_menu .bg::after{
  content: "";
  display: inline-block;
  width: 31.25vw;
  max-width: 500px;
  height: 31.25vw;
  max-height: 500px;
  background-color: rgba(166,144,40,0.6);
  z-index: -1;
}
#contents .sec_menu .wrapper{
  position: relative;
  padding: 2rem 0;
  flex-wrap: wrap;
  grid-gap: 1rem;
}
#contents .sec_menu .wrapper .box{
  width: calc(calc(100% / 3) - calc(2rem / 3));
}
#contents .sec_menu .wrapper .box .num{
  font-size: 28px;
  padding: 0 0.5em;
  display: inline-block;
  background-color: #a69028;
  color: #fff;
}
#contents .sec_menu .wrapper .box .text,#contents .sec_menu .wrapper .box .text .br{
  display: block;
  text-align: center;
  color: #fff;
  font-size: clamp(1.125rem, 0.893rem + 0.71vw, 1.75rem);/*18~28px(520~1920px)*/
  position: relative;
}
#contents .sec_menu .wrapper .box .text::after{
  content: ">";
  display: block;
  text-align: center;
  color: #fff;
  font-size: 20px;
  transform: rotate(90deg);
}

/* ----------------------------------------------
eight_sec
------------------------------------------------*/
#contents .eight_sec {
  position: relative;
  padding: 0 0 2rem;
}
#contents .eight_sec .titlebg{
  padding: 1.5rem 0 3rem;
  text-align: center;
}
#contents .eight_sec.sec1 .titlebg{
  background:url(images/bg01.jpg) center /cover no-repeat ;
}
#contents .eight_sec.sec2 .titlebg{
  background:url(images/bg02.jpg) center /cover no-repeat ;
}
#contents .eight_sec.sec3 .titlebg{
  background:url(images/bg03.jpg) center /cover no-repeat ;
}
#contents .eight_sec.sec4 .titlebg{
  background:url(images/bg04.jpg) center /cover no-repeat ;
}
#contents .eight_sec.sec5 .titlebg{
  background:url(images/bg05.jpg) center /cover no-repeat ;
}
#contents .eight_sec.sec6 .titlebg{
  background:url(images/bg06.jpg) center /cover no-repeat ;
}
#contents .eight_sec.sec7 .titlebg{
  background:url(images/bg07.jpg) center /cover no-repeat ;
}
#contents .eight_sec.sec8 .titlebg{
  background:url(images/bg08.jpg) center /cover no-repeat ;
}
#contents .eight_sec .titlebg h2{
  width: 80%;
  display: inline-block;
  background: url(images/title_bg.svg) center /100% 100% no-repeat;
  position: relative;
  padding: 2rem 0 4rem;
}
#contents .eight_sec .titlebg h2 .num{
  font-size:48px ;
  color: #fff;
  margin-bottom: 1rem;
  display: block;
  text-align: center;
}
#contents .eight_sec .titlebg h2 .text .br{
  font-size:36px ;
  color: #fff;
  display: block;
  text-align: center;
}
#contents .eight_sec .inner{
  padding: 1rem 0;
}
#contents .eight_sec .inner h3{
  text-align: center;
  position: relative;
  margin-bottom: 2rem;
}
#contents .eight_sec .inner h3::before{
  content: url(images/title_l_sp.svg);
  display: inline-block;
  width: 35%;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
#contents .eight_sec .inner h3::after{
  content: url(images/title_r_sp.svg);
  display: inline-block;
  width: 35%;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}
#contents .eight_sec .inner h3 span{
  font-size: 22px;
  display: inline-block;
  position: relative;
}
#contents .eight_sec .inner h3 span::after{
  content: url(../images/title_under.svg);
  display: inline-block;
  width: 80px;
  position: absolute;
  bottom: -1rem;
  left: 50%;
  transform: translateX(-50%);
}
#contents .eight_sec .inner .q_area{
  width: 100%;
  position: relative;
  padding:1rem 1rem 1rem 0;
  border: #000 1px solid;
  margin-bottom: 2rem;
  background-color: #fff;
  min-height: 190px;
}
#contents .eight_sec .inner .q_area .mark{
  position: absolute;
  top: 0;
  left: 0;
  border-bottom-right-radius: 10px;
  font-size: 42px;
  color: #fff;
  line-height: 1;
  background: linear-gradient(to left,#000,#333,#000);
  padding: 0.5rem 1rem 1.3rem;
}
#contents .eight_sec .inner .q_area .title{
  padding-left: 80px;
  margin-bottom: 1rem;
}
#contents .eight_sec .inner .q_area.notext{
  min-height: 110px;
}
#contents .eight_sec .inner .q_area.notext .title{
  padding-left: 200px;
}
#contents .eight_sec .inner .q_area .text{
  padding-left: 110px;
}
#contents .eight_sec .inner .q_area .title span{
  font-size: 22px;
  text-decoration: underline;
  display: inline;
  font-weight: bold;
}
/* #contents .eight_sec .inner .q_area .title span:nth-of-type(2){
  padding-left: 1em;
} */
#contents .eight_sec .inner .q_area .text span{
  font-size: 18px;
  display: block;
  font-weight: normal;
}
#contents .eight_sec .inner .q_area figure{
  width: 80px;
  position: absolute;
  bottom: 0;
  left: 0;
}
#contents .eight_sec .inner .q_area.notext figure{
  bottom: 0;
  left: 80px;
}
#contents .eight_sec .inner .a_area{
  width: 100%;
  position: relative;
  padding:1rem 2rem 2rem;
  margin-bottom: 2rem;
  margin-left: auto;
  z-index: 1;
  /* background:url(images/A_box.svg) center/100% 100% no-repeat; */
}
#contents .eight_sec .inner .a_area .A_bg{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
#contents .eight_sec .inner .a_area .mark{
  position: absolute;
  top: 0;
  left: 0;
  border-bottom-right-radius: 10px;
  font-size: 42px;
  color: #fff;
  line-height: 1;
  background: linear-gradient(to left,#e8e29d,#885d1e);
  padding: 0.5rem 1rem 1.3rem;
}
#contents .eight_sec .inner .a_area .title{
  padding-left: 50px;
  margin-bottom: 1rem;
  min-height: 72px;
}
#contents .eight_sec .inner .a_area .text{
  padding-right: 110px;
}
#contents .eight_sec .inner .a_area .title span{
  font-size: 22px;
  text-decoration: underline;
  display: inline;
  font-weight: bold;
}
/* #contents .eight_sec .inner .a_area .title span:nth-of-type(2){
  padding-left: 1em;
} */
#contents .eight_sec .inner .a_area .text span{
  font-size: 18px;
  display: block;
  font-weight: normal;
}
#contents .eight_sec .inner .a_area figure{
  width: 100px;
  position: absolute;
  bottom: 10px;
  right: 25px;
}

#contents .contact{
  align-items: stretch;
  justify-content: space-between;
  width: 80%;
  max-width: 700px;
  background:url(images/contact_bg.svg) center/auto;
  border: 1px solid #000;
  margin: 0 auto 1rem;
}
#contents .contact .textarea{
  width: calc(100% - 2rem - 150px);
  margin: 0 1rem;
}
#contents .contact .textarea .title{
  margin-bottom: 0.5rem;
}
#contents .contact .textarea .title .small{
  font-size: 16px;
  display: block;
}
#contents .contact .textarea .title .main{
  font-size: 20px;
  padding-left: 5rem;
  display: block;
}
#contents .contact .textarea .box{
  justify-content: space-between;
  align-items: center;
  flex-direction: column;
}
#contents .contact .textarea .box>p{
  margin-bottom: 1rem;
}
#contents .contact .textarea .box .tel{
  display: flex;
  align-items: center;
  font-size: 20px;
  border: 1px solid #e8e29d;
  border-image: linear-gradient(to left,#e8e29d,#885d1e);
  border-image-slice: 1;
  background-color: #fff;
  padding: 0.5rem 1.5rem;
}
#contents .contact .textarea .box .tel::before{
  content: url(images/tel.svg);
  width: 20px;
  display: inline-block;
  margin-right: 1rem;
}
#contents .contact .textarea .box .mail{
  border: 1px solid #000;
  background:linear-gradient(to left,#e8e29d,#885d1e) ;
  font-size: 18px;
  color: #fff;
  padding: 0.5rem 1.5rem;
}
#contents .contact .textarea .box .mail .small{
  font-size: 16px;
  color: #fff;
}
#contents .contact figure{
  max-width: 165px;
}


/* お問合せ（新しいパターン） */
#contents .contact_newbox {
  margin: min(3vw,2rem) auto;
  padding: min(1.5vw,1rem);
  border: 1px solid;
  border-image: linear-gradient(140deg, #C8A343 0%, #E1C665 20%, #C59F40 38%, #EFF2CC 66%, #A47623 91%);
  border-image-slice: 1;
}
#contents .contact_newbox .text_area {
  width: 100%;
  padding: min(1.5vw,1rem);
  background-color: rgba(255, 255, 255, .5);
}
#contents .contact_newbox .text_area .tit {
  font-size: clamp(1.25rem, 0.955rem + 0.91vw, 1.75rem);/*20~28px(520~1400px)*/
  margin-bottom: .5em;
  text-align: center;
}
#contents .contact_newbox .text_area .text {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: center;
  grid-gap: .25rem;
  margin-bottom: 1rem;
}
#contents .contact_newbox .text_area .text figure {
  max-width: 275px;
  padding: .5rem;
  background-color: #fff;
  border: 1px solid #000;
}
#contents .contact_newbox .text_area .text .txt {
  font-size: clamp(0.875rem, 0.727rem + 0.45vw, 1.125rem);/*14~16px(520~1400px)*/
}
#contents .contact_newbox .buttonarea>div {
  width: 100%;
}
#contents .contact_newbox .buttonarea>div a {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  grid-gap: .5rem;
}
#contents .contact_newbox .telarea{
  background: linear-gradient(140deg, #C8A343 0%, #E1C665 20%, #C59F40 38%, #EFF2CC 66%, #A47623 91%);
  box-shadow: 3px 3px 5px rgba(0, 0, 0, .35);
  margin-bottom: 1rem;
}
#contents .contact_newbox .telarea img{
  width: 18px;
}
#contents .contact_newbox .telarea a{
  pointer-events: none;
  padding: .5rem clamp(1rem, 0.409rem + 1.82vw, 2rem);/*16~32px(520~1400px)*/
}
#contents .contact_newbox .telarea .txt{
  font-size: clamp(1.25rem, 0.955rem + 0.91vw, 1.75rem);/*20~28px(520~1400px)*/
  color: #fff;
  line-height: 1;
}

#contents .contact_newbox .mailarea{
  background: #000;
  box-shadow: 3px 3px 5px rgba(0, 0, 0, .35);
}
#contents .contact_newbox .mailarea a{
  width: 100%;
  padding: 1rem clamp(1rem, 0.409rem + 1.82vw, 2rem);/*16~32px(520~1400px)*/
  position: relative;
}
#contents .contact_newbox .mailarea img{
  width: 28px;
}
#contents .contact_newbox .mailarea .txt{
  font-size: clamp(1rem, 0.778rem + 0.68vw, 1.375rem);/*16~22px(520~1400px)*/
  color: #fff;
  line-height: 1;
}

}

/* ----------------------------------------------

sp設定

------------------------------------------------*/
@media all and (max-width: 520px) {

  #sec01 .contact_newbox{
    background: linear-gradient(to right,rgba(255,255,255,.9) 0%,rgba(255,255,255,.25) 100%),url(images/bg01.jpg) center left/auto 100% no-repeat;
  }
  #sec02 .contact_newbox{
    background: linear-gradient(to right,rgba(255,255,255,.9) 0%,rgba(255,255,255,.25) 100%),url(images/bg02.jpg) center left/auto 100% no-repeat;
  }
  #sec03 .contact_newbox{
    background: linear-gradient(to right,rgba(255,255,255,.9) 0%,rgba(255,255,255,.25) 100%),url(images/bg03.jpg) center left/auto 100% no-repeat;
  }
  #sec04 .contact_newbox{
    background: linear-gradient(to right,rgba(255,255,255,.9) 0%,rgba(255,255,255,.25) 100%),url(images/bg04_02.jpg) center left/auto 100% no-repeat;
  }
  #sec05 .contact_newbox{
    background: linear-gradient(to right,rgba(255,255,255,.9) 0%,rgba(255,255,255,.25) 100%),url(images/bg05.jpg) center left/auto 100% no-repeat;
  }
  #sec06 .contact_newbox{
    background: linear-gradient(to right,rgba(255,255,255,.9) 0%,rgba(255,255,255,.25) 100%),url(images/bg06.jpg) center left/auto 100% no-repeat;
  }
  #sec07 .contact_newbox{
    background: linear-gradient(to right,rgba(255,255,255,.9) 0%,rgba(255,255,255,.25) 100%),url(images/bg07.jpg) center left/auto 100% no-repeat;
  }
  #sec08 .contact_newbox{
    background: linear-gradient(to right,rgba(255,255,255,.9) 0%,rgba(255,255,255,.25) 100%),url(images/bg08.jpg) center left/auto 100% no-repeat;
  }

/* ----------------------------------------------
topImage
------------------------------------------------*/
#under_page #container #topImage {
  background: url(images/topImage.jpg) center 30%/cover no-repeat;
}
#under_page #container #topImage h1 .ja{
  text-align: center;
  display: block;
}
#under_page #container #topImage h1 .ja .under_bar{
  font-size: 22px;
  color: #fff;
  text-shadow: 3px 3px 3px #000;
  position: relative;
}
#under_page #container #topImage h1 .ja .gold{
  font-size: 50px;
  background: linear-gradient(to right, #e8e29d 0%, #885d1e 100%);
  background-clip: text;
  -webkit-background-clip: text;
  text-fill-color:transparent;
  -webkit-text-fill-color:transparent;
  vertical-align: -12px;
  position: relative;
  z-index: 1;
}
#under_page #container #topImage h1 .ja .gold::after{
  content: "8";
  display: inline-block;
  font-size: 50px;
  background: rgba(0,0,0,0.6);
  background-clip: text;
  -webkit-background-clip: text;
  text-fill-color:transparent;
  -webkit-text-fill-color:transparent;
  position: absolute; 
  top: 0px;
  left: 3px;
  z-index: -1;
}
#under_page #container #topImage h1 .en {
  text-align: center;
  display: block;
  font-size: 14px;
  color: #fff;
  text-shadow: 1px 1px 2px #000;
  position: relative;
  letter-spacing: 3px;
  margin: -.5rem 0 2rem;
}
#under_page #container #topImage h1 .en .gold{
  font-size: 14px;
  background: linear-gradient(to right, #e8e29d 0%, #885d1e 100%);
  background-clip: text;
  -webkit-background-clip: text;
  text-fill-color:transparent;
  -webkit-text-fill-color:transparent;
  position: relative;
  z-index: 1;
  text-shadow: none; 
  padding-bottom: 3px;
}
#under_page #container #topImage h1 .en .gold::after{
  content: "eight";
  display: inline-block;
  font-size: 14px;
  background: rgba(0,0,0,0.6);
  background-clip: text;
  -webkit-background-clip: text;
  text-fill-color:transparent;
  -webkit-text-fill-color:transparent;
  position: absolute; 
  top: 0px;
  left: 3px;
  z-index: -1;
}

#container main{
  background:linear-gradient(to right,#fff 0%,#ccc 50%,#fff 100%) ;
}

/* ----------------------------------------------
sec_menu
------------------------------------------------*/
#contents .sec_menu {
  position: relative;
  padding: 2rem 0;
  z-index: 1;
}
#contents .sec_menu .bg,#contents .sec_menu .bg::after{
  position: absolute;
  top: 0;
  right: 0;
  width: 35vw;
  max-width: 560px;
  height: 35vw;
  max-height: 560px;
  clip-path: polygon(0 0, 100% 100%, 100% 0);
  -webkit-clip-path: polygon(0 0, 100% 100%, 100% 0);
  background-color: rgba(166,144,40,0.4);
  z-index: -1;
}
#contents .sec_menu .bg::after{
  content: "";
  display: inline-block;
  width: 31.25vw;
  max-width: 500px;
  height: 31.25vw;
  max-height: 500px;
  background-color: rgba(166,144,40,0.6);
  z-index: -1;
}
#contents .sec_menu .wrapper{
  position: relative;
  padding: 2rem 0;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: stretch;
}
#contents .sec_menu .wrapper .box{
  margin-bottom: 1.5rem;
  width: calc(50% - .5rem);
}
#contents .sec_menu .wrapper .box .num{
  font-size: 20px;
  padding: 0 0.5em;
  display: inline-block;
  background-color: #a69028;
  color: #fff;
}
#contents .sec_menu .wrapper .box .text,#contents .sec_menu .wrapper .box .text .br{
  display: block;
  text-align: center;
  color: #fff;
  font-size: 16px;
  position: relative;
}
#contents .sec_menu .wrapper .box .text::after{
  content: ">";
  display: block;
  text-align: center;
  color: #fff;
  font-size: 18px;
  transform: rotate(90deg);
}


/* ----------------------------------------------
eight_sec
------------------------------------------------*/
#contents .eight_sec {
  position: relative;
  padding: 0 0 2rem;
}
#contents .eight_sec .titlebg{
  padding: 1.5rem 0 3rem;
}
#contents .eight_sec.right .titlebg{
  text-align: right;
}
#contents .eight_sec.sec1 .titlebg{
  background:url(images/bg01.jpg) center /cover no-repeat ;
}
#contents .eight_sec.sec2 .titlebg{
  background:url(images/bg02.jpg) center /cover no-repeat ;
}
#contents .eight_sec.sec3 .titlebg{
  background:url(images/bg03.jpg) center /cover no-repeat ;
}
#contents .eight_sec.sec4 .titlebg{
  background:url(images/bg04.jpg) center /cover no-repeat ;
}
#contents .eight_sec.sec5 .titlebg{
  background:url(images/bg05.jpg) center /cover no-repeat ;
}
#contents .eight_sec.sec6 .titlebg{
  background:url(images/bg06.jpg) center /cover no-repeat ;
}
#contents .eight_sec.sec7 .titlebg{
  background:url(images/bg07.jpg) center /cover no-repeat ;
}
#contents .eight_sec.sec8 .titlebg{
  background:url(images/bg08.jpg) center /cover no-repeat ;
}
#contents .eight_sec .titlebg h2{
  width: 100%;
  display: inline-block;
  background: url(images/title_bg.svg) center /100% 100% no-repeat;
  position: relative;
  padding:1rem 0 2rem;
}
#contents .eight_sec .titlebg h2 .num{
  font-size:32px ;
  color: #fff;
  margin-bottom: 1rem;
  display: block;
  text-align: center;
}
#contents .eight_sec .titlebg h2 .text .br{
  font-size:24px ;
  color: #fff;
  display: block;
  text-align: center;
}
#contents .eight_sec .inner{
  padding: 1rem 0;
}
#contents .eight_sec .inner h3{
  text-align: center;
  position: relative;
  margin-bottom: 2rem;
}
#contents .eight_sec .inner h3::before{
  content: url(images/title_l.svg);
  display: inline-block;
  width: 30%;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
#contents .eight_sec .inner h3::after{
  content: url(images/title_r.svg);
  display: inline-block;
  width: 30%;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}
#contents .eight_sec .inner h3 span{
  font-size: 18px;
  display: inline-block;
  position: relative;
}
#contents .eight_sec .inner h3 span::after{
  content: url(../images/title_under.svg);
  display: inline-block;
  width: 40%;
  position: absolute;
  bottom: -1rem;
  left: 50%;
  transform: translateX(-50%);
}
#contents .eight_sec .inner .q_area{
  width: 100%;
  position: relative;
  padding:1rem 1rem 1rem 0;
  border: #000 1px solid;
  margin-bottom: 2rem;
  background-color: #fff;
  min-height: 190px;
}
#contents .eight_sec .inner .q_area .mark{
  position: absolute;
  top: 0;
  left: 0;
  border-bottom-right-radius: 10px;
  font-size: 24px;
  color: #fff;
  line-height: 1;
  background: linear-gradient(to left,#000,#333,#000);
  padding: 0.1rem 0.5rem 0.7rem;
}
#contents .eight_sec .inner .q_area .title{
  padding-left: 50px;
  margin-bottom: 1rem;
}
#contents .eight_sec .inner .q_area.notext{
  min-height: 110px;
}
/* #contents .eight_sec .inner .q_area.notext .title{
  padding-left: 200px;
} */
#contents .eight_sec .inner .q_area .text{
  padding:0 1rem;
}
#contents .eight_sec .inner .q_area .title span{
  font-size: 20px;
  text-decoration: underline;
  display: block;
  font-weight: bold;
}
#contents .eight_sec .inner .q_area .text span{
  font-size: 18px;
  display: block;
  font-weight: normal;
}
#contents .eight_sec .inner .q_area figure{
  width: 80px;
  position: absolute;
  bottom: 0;
  left: 0;
  opacity: .3;
}
/* #contents .eight_sec .inner .q_area.notext figure{
  bottom: 0;
  left: 80px;
} */
#contents .eight_sec .inner .a_area{
  width: 100%;
  position: relative;
  padding:1rem 1.5rem 2rem;
  margin-bottom: 2rem;
  margin-left: auto;
  z-index: 1;
  /* background:url(images/A_box.svg) center/100% 100% no-repeat; */
}
#contents .eight_sec .inner .a_area .A_bg{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
#contents .eight_sec .inner .a_area .mark{
  position: absolute;
  top: 0;
  left: 0;
  border-bottom-right-radius: 10px;
  font-size: 24px;
  color: #fff;
  line-height: 1;
  background: linear-gradient(to left,#e8e29d,#885d1e);
  padding: 0.5rem 1rem 1.3rem;
}
#contents .eight_sec .inner .a_area .title{
  padding-top: 40px;
  margin-bottom: 1rem;
  min-height: 72px;
}
#contents .eight_sec .inner .a_area .text{
}
#contents .eight_sec .inner .a_area .title span{
  font-size: 20px;
  text-decoration: underline;
  display: inline;
  font-weight: bold;
}
#contents .eight_sec .inner .a_area .text span{
  font-size: 16px;
  display: block;
  font-weight: normal;
}
#contents .eight_sec .inner .a_area figure{
  width: 100px;
  position: absolute;
  bottom: 10px;
  right: 25px;
  opacity: .3;
}

#contents .contact{
  align-items: stretch;
  justify-content: space-between;
  width: calc(100% - 4%);
  background:url(images/contact_bg.svg) center/auto;
  border: 1px solid #000;
  padding: 1em 0;
  margin: 0 2% 3rem;
}
#contents .contact .textarea{
  width: 100%;
  margin: 0 1rem;
}
#contents .contact .textarea .title{
  margin-bottom: 0.5rem;
  text-align: center;
}
#contents .contact .textarea .title .small{
  font-size: 14px;
  display: inline;
  text-align: center;
}
#contents .contact .textarea .title .main{
  font-size: 18px;
  display: inline;
  text-align: center;
}
#contents .contact .textarea .box{
  justify-content: stretch;
  align-items: center;
  flex-direction: column;
}
#contents .contact .textarea .box .tel{
  display: flex;
  align-items: center;
  font-size: 18px;
  border: 1px solid #e8e29d;
  border-image: linear-gradient(to left,#e8e29d,#885d1e);
  border-image-slice: 1;
  background-color: #fff;
  padding: 0.5rem 1.5rem;
  margin-bottom: 1rem;
}
#contents .contact .textarea .box .tel::before{
  content: url(images/tel.svg);
  width: 20px;
  display: inline-block;
  margin-right: 1rem;
}
#contents .contact .textarea .box .mail{
  border: 1px solid #000;
  background:linear-gradient(to left,#e8e29d,#885d1e) ;
  font-size: 16px;
  color: #fff;
  padding: 0.5rem 1.5rem;
}
#contents .contact .textarea .box .mail .small{
  font-size: 14px;
  color: #fff;
}


/* お問合せ（新しいパターン） */
#contents .contact_newbox {
  margin: min(3vw,2rem) auto;
  padding: min(1.5vw,1rem);
  border: 1px solid;
  border-image: linear-gradient(140deg, #C8A343 0%, #E1C665 20%, #C59F40 38%, #EFF2CC 66%, #A47623 91%);
  border-image-slice: 1;
}
#contents .contact_newbox .text_area {
  width: 100%;
  padding: min(1.5vw,1rem);
  background-color: rgba(255, 255, 255, .5);
}
#contents .contact_newbox .text_area .tit {
  font-size: clamp(1.25rem, 0.955rem + 0.91vw, 1.75rem);/*20~28px(520~1400px)*/
  margin-bottom: .5em;
  text-align: center;
}
#contents .contact_newbox .text_area .text {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: center;
  grid-gap: .25rem;
  margin-bottom: 1rem;
}
#contents .contact_newbox .text_area .text figure {
  max-width: 275px;
  padding: .5rem;
  background-color: #fff;
  border: 1px solid #000;
}
#contents .contact_newbox .text_area .text .txt {
  font-size: clamp(0.875rem, 0.727rem + 0.45vw, 1.125rem);/*14~16px(520~1400px)*/
}
#contents .contact_newbox .buttonarea>div {
  width: 100%;
}
#contents .contact_newbox .buttonarea>div a {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  grid-gap: .5rem;
}
#contents .contact_newbox .telarea{
  background: linear-gradient(140deg, #C8A343 0%, #E1C665 20%, #C59F40 38%, #EFF2CC 66%, #A47623 91%);
  box-shadow: 3px 3px 5px rgba(0, 0, 0, .35);
  margin-bottom: 1rem;
}
#contents .contact_newbox .telarea img{
  width: 18px;
}
#contents .contact_newbox .telarea a{
  padding: .5rem clamp(1rem, 0.409rem + 1.82vw, 2rem);/*16~32px(520~1400px)*/
}
#contents .contact_newbox .telarea .txt{
  font-size: clamp(1.25rem, 0.955rem + 0.91vw, 1.75rem);/*20~28px(520~1400px)*/
  color: #fff;
  line-height: 1;
}

#contents .contact_newbox .mailarea{
  background: #000;
  box-shadow: 3px 3px 5px rgba(0, 0, 0, .35);
}
#contents .contact_newbox .mailarea a{
  width: 100%;
  padding: 1rem clamp(1rem, 0.409rem + 1.82vw, 2rem);/*16~32px(520~1400px)*/
  position: relative;
}
#contents .contact_newbox .mailarea img{
  width: 24px;
}
#contents .contact_newbox .mailarea .txt{
  font-size: clamp(1rem, 0.778rem + 0.68vw, 1.375rem);/*16~22px(520~1400px)*/
  color: #fff;
  line-height: 1;
}
}