@charset "utf-8";
* {
  box-sizing:border-box;
}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,
pre,form,fieldset,input,textarea,p,blockquote,th,td {
  margin:0;
  padding:0;
}
html {
  overflow-y:scroll;
}
body {
  min-width:320px;
  margin:auto;
  word-break:break-word;
  line-break:strict;
  overflow-wrap:break-word;
  font-weight:normal;
}
section {
  position:relative;
}
h1,h2,h3,h4,h5,h6 {
  font-size:100%;
  font-weight:normal;
}
main p + *,main ul + *,main ol + * {
  margin-top:1em;
}
ol,ul{
  list-style:none;
}
fieldset,img {
  border:0;
}
img {
  max-width:100%;
  vertical-align:bottom;
}
img.-line {
	border: 1px solid var(--line);
	padding: .5em;
}
button {
  background-color:unset;
  border:none;
  padding:unset;
  -webkit-appearance:none;
}
table {
  border-collapse:collapse;
  border-spacing:0;
}
caption,th {
  text-align:left;
}
a {
  display:inline-block;
  text-decoration:none;
  color:inherit;
}
a:focus {
  outline:none;
}
a,button,input[type="submit"] {
  position:relative;
  transition:var(--transition);
}
a:hover,button:hover,input[type="submit"]:hover {
  cursor:pointer;
}
input,textarea,select {
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
  border:0;
}
.opa {
  transition:var(--transition);
  cursor:pointer;
}
.opa:hover {
  opacity:var(--opacity);
}

/* ==================================================
Break
================================================== */
.on1366,.on1280,.on1024,.on768,.on480,.on375 {
  display:none!important;
}
@media (min-width:1367px) {
  .off1366{
    display:none!important;
  }
  .on1366{
    display:block!important;
  }
}
@media (max-width:1280px) {
  .off1280{
    display:none!important;
  }
  .on1280{
    display:block!important;
  }
}
@media (max-width:1024px) {
  .off1024{
    display:none!important;
  }
  .on1024{
    display:block!important;
  }
}
@media (max-width:768px) {
  .off768{
    display:none!important;
  }
  .on768{
    display:block!important;
  }
}
@media (max-width:480px) {
  .off480{
    display:none!important;
  }
  .on480{
    display:block!important;
  }
}

/* ==================================================
width
================================================== */
.-w10 {
  width:10%;
}
.-w20 {
  width:20%;
}
.-w30 {
  width:30%;
}
.-w40 {
  width:40%;
}
.-w50 {
  width:50%;
}
.-w60 {
  width:60%;
}
.-w70 {
  width:70%;
}
.-w80 {
  width:80%;
}
.-w90 {
  width:90%;
}
.-w100 {
  width:100%;
}

/* ==================================================
text,font
================================================== */
.f12 {
  font-size:12px;
}
.f15 {
  font-size:15px;
}
.f18 {
  font-size:18px;
}
.f20 {
  font-size:20px;
}
.fs {
  font-size:max(.8em,12px);
}
.fl {
  font-weight:300;
}
.fm {
  font-weight:400;
}
.fb,em,strong {
  font-weight:600;
}
.fi {
  font-style:italic;
}
.tc {
  text-align:center!important;
}
.tr {
  text-align:right!important;
}
.tl {
  text-align:left!important;
}
.tj {
  text-align:justify!important;
}
.lhn {
  line-height:normal!important;
}
.ti1em {
  text-indent:1em;
}

/* ==================================================
margin
================================================== */
.mts {
  margin-top:.5em!important;
}
.mt1em {
  margin-top:1em!important;
}
.mt10 {
  margin-top:10px!important;
}
.mt15 {
  margin-top:15px!important;
}
.mt20 {
  margin-top:20px!important;
}
.mt30 {
  margin-top:30px!important;
}
.mt45 {
  margin-top:45px!important;
}
.mt50 {
  margin-top:50px!important;
}
.mb0 {
  margin-bottom:0!important;
}
.mbs {
  margin-bottom:.5em!important;
}
.mb1em {
  margin-bottom:1em!important;
}
.mb10 {
  margin-bottom:10px!important;
}
.mb15 {
  margin-bottom:15px!important;
}
.mb20 {
  margin-bottom:20px!important;
}
.mb30 {
  margin-bottom:30px!important;
}
.mb45 {
  margin-bottom:45px!important;
}
.mb50 {
  margin-bottom:50px!important;
}
@media (max-width:768px){
  .mt45,.mt50 {
    margin-top:30px!important;
  }
  .mb45,.mb50 {
    margin-bottom:30px!important;
  }
}

/* ==================================================
Flex
================================================== */
.flex {
  display:flex;
  flex-wrap:wrap;
}
.jc_between {
  justify-content:space-between;
}
.jc_center {
  justify-content:center;
}
.ai_start {
  align-items:flex-start;
}
.ai_center {
  align-items:center;
}
.flex_rev {
  flex-direction:row-reverse;
}
.flex_set {
  display:flex;
  align-items:flex-start;
  flex-wrap:wrap;
  gap:30px 5%;
}
.flex_set > .img_con {
  flex:0 0 30%;
}
.flex_set > .text_con {
  flex:0 0 65%;
}
.flex_set > .img_con img {
  width:100%;
  display:block;
}
@media (max-width:768px) {
  .flex_set{
    flex-direction:column;
  }
	.flex > *,
  .flex_set > .img_con,
  .flex_set > .text_con {
    flex:0 0 100%;
  }
  .flex_set > .img_con img{
    width:90%;
    margin:auto;
  }
}

/* ==================================================
Column
================================================== */
.col_2,.col_3,.col_4 {
  display:grid;
  gap:1em;
}
.col_2 {
  grid-template-columns:repeat(2,1fr);
}
.col_3{
  grid-template-columns:repeat(3,1fr);
}
.col_4{
  grid-template-columns:repeat(4,1fr);
}
@media (max-width:768px ){
  .col_2,.col_3,.col_4 {
    grid-template-columns:repeat(1,1fr);
  }
  .col_2.-all,.col_4.-all {
    grid-template-columns:repeat(2,1fr);
  }
  .col_3.-all{
    grid-template-columns:repeat(3,1fr);
  }
}

/* ==================================================
fade
================================================== */
.inview {
  opacity:0;
  transition:all 1s;
}
.inview.is-show {
  opacity:1;
}
.inview.early {
  transition:all 0.5s;
}
.inview.slow {
  transition:all 1.5s;
}
.fadein_up {
  transform:translateY(30px);
  visibility:hidden;
}
.fadein_up.is-show {
  visibility:visible;
  transform:translateY(0px);
}
.fadein_l {
  transform:translateX(80px);
  visibility:hidden;
}
.fadein_l.is-show {
  visibility:visible;
  transform:translateX(0px);
}
.fadein_r {
  transform:translateX(-80px);
  visibility:hidden;
}
.fadein_r.is-show {
  visibility:visible;
  transform:translateX(0px);
}


/* ==================================================
breadcrumb-list
================================================== */
.breadcrumb-nav {
  margin:20px auto;
  padding:0;
  background:transparent;
}
.breadcrumb-list {
  display:flex;
  flex-wrap:wrap;
  list-style:none;
  margin:0;
  padding:0;
  font-size:12px;
  line-height:1.5;
}
.breadcrumb-item {
  display:flex;
  align-items:center;
  color:var(--primary);
}
.breadcrumb-item+.breadcrumb-item::before {
  content:">\0000a0";
  margin:0 10px;
  color:var(--primary);
  font-size:10px;
}
.breadcrumb-item a {
  color:var(--primary);
  text-decoration:none;
  transition:all 0.2s;
}
.breadcrumb-item a:hover {
  text-decoration:underline;
}
.breadcrumb-item.active {
  color:var(--black);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:300px;
}