@charset "utf-8";
/* TOP
------------------------------------------------------------ */
.contents-frame .inner .contents-area .artcls #teru-series [class^=c-photo] {
    margin-bottom: 24px;
    width: 32%;
}
#teru-series .ttl-t{
display: flex;
align-items: center;
padding-left: 1em;
}
#teru-series .yellow{
border-bottom: 2px solid #fac102;
}
#teru-series .red{
border-bottom: 2px solid #f60107;
}
#teru-series .ttl02{
  margin-right: 5%;
  font-size: 2.5em;
  text-shadow: 3px 2px 0px #9d9d9d;
}
#teru-series .ttl-t rt{
text-shadow: none;
font-size: 0.8rem;
margin-bottom: 0.3rem;
color: #000;
letter-spacing: 0.2em;
text-align: center;
}

#teru-series .yellow .ttl02{
  color: #fac102;
}
#teru-series .red .ttl02{
  color: #f60107;
}
#teru-series .ttl-t .ttl-catch{
font-size: 0.9rem;
line-height: 1.5rem;
}
#teru-series .catch{padding: 1em 0 1em 1em;}

#teru-series .flex-wrap_prnt {
    width: 97%;
    margin: auto;
}
#teru-series .cf-cap{ margin-bottom: 1rem;}
#teru-series .teru02 .cf-cap{margin-bottom: 4.7rem;}
#teru-series .mtb-1{margin: 1rem auto;}
#teru-series .flex-right img:first-child{margin-bottom: 1rem;}
#teru-series .small-txt{ font-size: 0.9rem;}
#teru-series .topic-txt{
  text-align: center;
  font-size: 1.2rem;
  font-weight: bold;
}
#teru-series .conversionbox{
  width: 97%;
  margin: auto;
  padding: 2%;
  background: #f3f3f3;
}
#teru-series .conversionbox .txt{
  text-align: center;
  font-weight: bold;
}
#teru-series .conversionbox .tellbox{
  width: 40%;
  margin: 0 auto 0.5rem;
  text-align: center;
}
#teru-series .conversionbox .tellbox a{
  position: relative;
  background: #e80f0f;
  color: #fff;
  padding: 0.5rem 0;
  font-weight: bold;
  font-size: 1.5rem;
  border: 1px solid #e80f0f;
  transition: all 0.5s;
}
#teru-series .conversionbox .tellbox a:hover{
  background: #fff;
  color: #e80f0f;
}
#teru-series .conversionbox .tellbox a::before{
  content: "";
  position: absolute;
  background: url(../image/pages/service/t_icon_off.png) 0 100% no-repeat;
  background-size: cover;
  top: 30%;
  left: 5%;
  width: 26px;
  height: 26px;
  transition: all 0.5s;
}
#teru-series .conversionbox .tellbox a:hover:before{
  content: "";
  position: absolute;
  background: url(../image/pages/service/t_icon_on.png) 0 100% no-repeat;
  background-size: cover;
  top: 30%;
  left: 5%;
  width: 26px;
  height: 26px;
}
#teru-series .mb2{margin-bottom: 2rem;}
#teru-series .flex-conv{
  display: flex;
  justify-content: center;
}
#teru-series .txt.flex-conv a{
position: relative;
color: #e80e0f;
}
#teru-series .txt.flex-conv a::after{
content: "";
position: absolute;
display: block;
height: 1px;
width: 0;
background-color: #e80e0f;
bottom: -3px;
left: 0;
transition: all 0.5s;
}
#teru-series .txt.flex-conv a:hover::after {
    width: 100%;
    transition: all 0.5s;
}


@media screen and (min-width:521px) and ( max-width:1024px) {}
@media screen and (max-width: 520px) {
  .contents-frame .inner .contents-area .artcls #teru-series [class^=c-photo] {
    width: 65%;
}
#teru-series .ttl-t {flex-wrap: wrap;}
#teru-series .ttl02 {
    margin-right: 0;
    font-size: 2em;
    width: 47%;
}
#teru-series .ttl-t .ttl-catch {
    font-size: 0.7rem;
    line-height: 1.5rem;
    width: 53%;
}
#teru-series .catch { padding: 1em 0 1em 0em;}
#teru-series .flex-wrap_prnt {width: 100%;}
#teru-series .topic-txt {font-size: 1rem;}
#teru-series .conversionbox {
    width: 97%;
    padding: 5% 2%;
}
#teru-series .conversionbox .tellbox {width: 92%;}
#teru-series .conversionbox .tellbox a {
    padding: 0.5rem 0;
    font-size: 1.2rem;
  }
  #teru-series .conversionbox .txt {font-size: 0.9rem;}

}