@charset "utf-8";
/****************
common
****************/
.aligncenter {margin: auto;}
.br { display: inline-block;}
.posi--ab { position: absolute;}
.posi--re { position: relative;}
.text--center, .center { text-align: center;}
.text--right { text-align: right;}
.flex { display: flex;}
.align--center { align-items: center;}
.align--end { align-items: flex-end;}
.j--around { justify-content: space-around;}
.j--center { justify-content: center;}
.j--between { justify-content: space-between;}
.j--end { justify-content: end;}
.wrap { flex-wrap: wrap;}
.f--column { flex-direction: column;}
.gap--l{ gap: 56px;}
.gap--m { gap: 32px;}
.gap--s{ gap: 16px;}
.gap--ss { gap: 8px;}
.text--underline { text-decoration: underline;}
/*font*/
.font_jaline {
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}
.fontw--b{ font-weight: 800;}
.fontw--mb{ font-weight: 600;}
.fontw--lb{ font-weight: 500;}
.fontsize--main{ font-size: 3.5rem;}
.fontsize--main_jp{ font-size: 3rem;}
.fontsize--l{ font-size: 2.4rem;}
.fontsize--llm{ font-size: 2rem;}
.fontsize--lm{ font-size: 1.6rem;}
.fontsize--ml{ font-size: 1.3rem;}
.fontsize--m{ font-size: 1.2rem;}
.fontsize--nomal{ font-size: 1rem;}
.fontsize--s{ font-size: 14px;}
.fontsize--ss { font-size: 0.9rem;}
.fontsize--pl{ font-size: 40px;}
.fontsize--pllm{ font-size: 32px;}
.letter-space--m { letter-spacing: .2rem;}
.line--m { line-height: 2;}
/*space*/
.mb--b{ margin-bottom: 190px;}
.mt--b{ margin-top: 190px;}
.pb--b{ padding-bottom: 190px;}
.pt--b{ padding-top: 190px;}

.mb--mb{ margin-bottom: 100px;}
.mt--mb{ margin-top: 100px;}
.pb--mb{ padding-bottom: 100px;}
.pt--mb{ padding-top: 100px;}

.mb--lll{ margin-bottom: 80px;}
.mt--lll{ margin-top: 80px;}
.pb--lll{ padding-bottom: 80px;}
.pt--lll{ padding-top: 80px;}

.mb--ll{ margin-bottom: 40px;}
.mt--ll{ margin-top: 40px;}
.pb--ll{ padding-bottom: 40px;}
.pt--ll{ padding-top: 40px;}

.mb--l{ margin-bottom: 32px;}
.mt--l{ margin-top: 32px;}
.pb--l{ padding-bottom: 32px;}
.pt--l{ padding-top: 32px;}

.mb--ml{ margin-bottom: 24px;}
.mt--ml{ margin-top: 24px;}
.pb--ml{ padding-bottom: 24px;}
.pt--ml{ padding-top: 24px;}

.mb--m{ margin-bottom: 16px;}
.mt--m{ margin-top: 16px;}
.pb--m{ padding-bottom:16px;}
.pt--m{ padding-top: 16px;}

.mb--s{ margin-bottom: 8px;}
.mt--s{ margin-top: 8px;}
.pt--s{ padding-top: 8px;}
.pb--s{ padding-bottom: 8px;}

.mb--ss{ margin-bottom: 4px;}
.mt--ss{ margin-top: 4px;}
.pt--ss{ padding-top: 4px;}
.pb--ss{ padding-bottom: 4px;}

.m_all--m{ margin: 3%;}
.p_all--m{ padding: 3%;}
.m_all--s{ margin: 2%;}
.p_all--s{ padding: 2%;}
.mr--auto { margin-right: auto;}
.ml--auto { margin-left: auto;}
.mt--auto{ margin-top:auto;}
.mlr--auto{
  margin-left: auto;
  margin-right: auto;
}
.mr--s { margin-right: 8px;}
.ml--s { margin-left: 8px;}
.mr--ss { margin-right: 4px;}
.ml--ss { margin-left: 4px;}


/*color*/
.bg--b { background: #141414;}
.bg--red { background: #bb0000;}
.color--w { color: #fff;}
.color--b { color: #141414;}
.color--red { color: #bb0000;}

:where(a) {
  color: #141414;
}
:where(a):active {
  color: #bb0000;
}
:where(a):hover {
    text-decoration: underline;
    color: #bb0000;
}
:where(a):hover .color--red {
  color: #bb0000;
}
a img {
  cursor: pointer;
}
/** btn / link **/
.arrow_circle, .arrow_line {
	position: relative;
}
.arrow_circle:before,
.arrow_circle:after {
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.arrow_circle:before {
	box-sizing: border-box;
	width: 18px;
	height: 18px;
	border: 1px solid;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	right: 0;
}
.arrow_circle:after {
	right: 8px;
	width: 4px;
	height: 4px;
	border-top: 1px solid;
	border-right: 1px solid;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
a.color--w:hover {
    color: #ffd04a;
}
.arrow_line:after {
    position: absolute;
    top: 0;
    bottom: 2px;
    margin: auto;
    content: "";
    right: 20px;
    width: 10px;
    height: 10px;
    border-top: 2px solid;
    border-right: 2px solid;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    transition: .5s;
}
.arrow_line:hover:after {
  right: 11px;
  transition: .5s;
}