@charset "UTF-8";
:root {
  /*color*/
  --main--color  : #000000;
  --bg--color    : #F0F0F0;
  --sub--color   : #FFFFFF;
  --hover--color : #c9c9c9;

  /*margin*/
  --space--xs : 30px;
  --space--s  : 50px;
  --space--m  : 100px;
  --space--l  : 150px;
  --space--xl : 200px;
  --space--side : 110px;
  --space--side2 : 99px;

  /*box*/
  --box--size : 54px;

  /*font*/
  font-size : 62.5%;
}

@media (max-width: 1160px ){
  :root {
    /*margin*/
    --space--side2 : 20px;
  }
}

@media (max-width: 820px ){
  :root {
    /*margin*/
    --space--s  : 30px;
    --space--m  : 54px;
    --space--xl : 100px;
    --space--side  : 20px;

  }
}

@media (max-width: 540px ){
  :root {
    /*margin*/
    --space--m  : 36px;
  }
}

html, body {
  font-family: 'Open Sans','Zen Kaku Gothic New', sans-serif;;
  font-weight: 400;
  font-size: 2rem;
  line-height:calc(40 / 20);
  color: var(--main--color);
}
a:hover {
  -webkit-transition: all 0.2s ease 0s;
  transition: all 0.2s ease 0s;
  cursor: pointer;
  color: var(--hover--color);
}
h1{
  font-weight: bold;
  font-size: 3rem;
  line-height: calc(80 / 48);
}
h2{
  font-weight: bold;
  font-size: 1.8rem;
  line-height: calc(32 / 18);
  letter-spacing: 1.08px;
  margin-bottom:72px;
  margin-top: -4px;
}
#toppage h2 {
  margin-top: initial;
  display: flex;
  align-items: center;
}
h3{
  font-weight: bold;
  font-size: 2.2rem;
}

img{
  width:100%;
}
.wp-block-image img{
  width:initial;
}
main{
  padding-top: 106px;
  min-height: 80vh;
}
/*sub-heading*/
.sub-heading{
  display:flex;
}
.sub-heading-text{
  font-size: 1.8rem;
  font-weight: bold;
  letter-spacing: 2.64px;
  display:flex;
  width: 207px;
  height: var(--box--size);
  color: var(--sub--color);
  background: var(--main--color);
  justify-content:center;
  align-items:center;
}

.sub-heading-box{
  width: var(--box--size);
  height: var(--box--size);
  border: 2px solid var(--main--color);
  background: var(--sub--color);
}

/*text*/
.text-small{
  font-size: 1.6rem;
  line-height: calc(30 / 16);
}
.text-xsmall{
  font-size: 1.3rem;
  line-height: calc(30 / 16);
}
@media (max-width: 1160px ){
  main{
    padding-top: initial;
  }
  main#toppage{
    padding-top: 60px;
  }
  #toppage h2 {
    display: block;
  }
}

@media (max-width: 820px ){
  html, body {
    font-size: 1.8rem;
    line-height: calc(33 / 18);
  }
  h1{
    font-size: 2.4rem;
    line-height: calc(40 / 24);
  }
  h2{
    font-size: 2rem;
    margin-bottom:var(--space--m);
    line-height: calc(35 / 20);

  }
  .sub-heading-text{
    font-size: 2rem;
    letter-spacing: 2.4px;
    width: 148px;
  }
}

@media (max-width: 540px){
  h1{
    font-size: 1.8rem;
    line-height: calc( 26 /18 );
  }
  h2{
    font-size: 1.6rem;
    line-height: calc( 28 /16 );
    letter-spacing: 0.96px;
  }
  .sub-heading-text {
    font-size: 1.8rem;
    letter-spacing: 2.4px;
    width: 148px;
  }
}

@media (max-width: 374px){
  h1{
    font-size: 1.4rem;
    line-height: calc( 26 /18 );
  }
  h2{
    font-size: 1.4rem;
    line-height: calc( 28 /16 );
    letter-spacing: 0.96px;
  }
  .text-small {
    font-size: 1.4rem;
  }
  .text-xsmall{
    font-size: 1.1rem;
  }
}


@media (max-width: 280px){
  h1{
    font-size: 1.3rem;
  }
  h2{
    font-size: 1.3rem;
  }
  .text-small {
    font-size: 1.3rem;
  }
  .text-xsmall{
    font-size: 1.1rem;
  }
}

/*=================================================
common
===================================*/
.container {
  width: 100%;
}
.contents section{
  padding: 54px 0px;
}
#case,#archives{
  padding-top :108px;
}
#information{
  padding-top: 54px;
}
@media (max-width: 540px){
  #case,#archives{
    padding-top :54px;
  }
}

.contents{
  width:100%;
}
.contents-item{
  display:flex;
}
.contents-item-full{
  margin-bottom: var(--space--m);
  width: 100vw;
}
#news.contents-item,#topics.contents-item{
  padding-bottom: var(--space--m);
}

.contents-image{
  width: 33.333333%;
}
#overview.contents-item{
  padding-top: var(--space--m);
}
.section-info{
  margin-bottom: 10px;
}

/*inner*/
.inner{
  padding-left: 54px;
  width:100%;
}
.inner-item{
  width: 100%;
  padding-right:var(--space--side2);
}
.inner-over {
	width: calc(100vw - 428px);
  margin-bottom: var(--space--s);
}
.inner-over:last-child{
  margin-bottom: var(--space--m);
}
.item-list{
  margin-top: var(--space--s);
}
.image-box{
  display: flex;
  gap: 3px;
}
.image-item{
  width: 33.3333333%;
}
.image-credit{
  font-size: 1.4rem;
  text-align: right;
  margin: 5px 15px;
}
.right{
  text-align:right;
}
#works .inner-item:not(:last-child),#archives .inner-item:not(:last-child),#overview .inner-item:not(:last-child){
  padding-bottom: var(--space--m);
}
@media (max-width: 1920px ){
  .inner-item{
    max-width: calc( 1026px + var(--space--side2 ));
    width: 100%;
  }
}

@media (max-width: 1160px ){
  #news.contents-item{
    padding-bottom: var(--space--xl);
  }
  .inner{
    padding-top: var(--space--s);
    padding-left: var(--space--s);
    padding: 50px 20px 0px 20px;
  }
  .inner-item{
    padding-right: initial;
    max-width: 100%;
  }
  .contents-item{
    flex-direction: column;
  }
  .inner-over {
    margin: 0 calc(50% - 50vw);
    width: 100vw;
  }
  .inner-over-item{
    margin-bottom: 40px;
  }
  .image-item{
    width: 100%;
  }
}
@media (max-width: 540px ){
  .inner{
    padding: 36px 20px 0px 20px;
  }
}

/*wrap*/
.sp-wrap {
  display: none;
}
.md-wrap {
  display: none;
}
.pc-wrap {
  display: block;
}
.md2-wrap {
  display: block;
}

@media (max-width: 1240px) {
  .pc-wrap {
    display: none;
  }
  .md-wrap {
    display: block;
  }
}

@media (max-width: 820px) {
  .md2-wrap {
  display: none;
  }
}

@media (max-width: 414px) {
  .sp-wrap {
    display: block;
  }
}

/*非表示用*/
.hidden{
  display:none;
}

/*=================================================
header
===================================*/
.breaking-news {
  background: #F0F0F0;
  padding: 24px 20px;
  text-align: center;
  width: 100vw;
  margin: 0 calc(50% - 50vw);
  border-bottom: 2px solid;
  font-size: 1.6rem;
  font-weight: bold;
}

#header {
  width: 100%;
  position: fixed;
  z-index: 999;
  padding: 0px 40px;
  background: #ffffff;
  top: 0;
  transition: all 0.3s ease-out;
}

.header-item{
  display:flex;
  position:relative;
  justify-content: center;
  align-items: center;
  margin-top: 20px;
  margin-bottom: 20px;
}
#header-logo{
  width: 293px;
}
#nav-logo{
  display: none;
}
#header-logo img{
  width: 293px;
}
#g-nav{
  margin-left:120px;
}
#g-nav ul{
  display: flex;
  justify-content: space-between;
  width: 100%;
}
#g-nav ul li{
  text-align:center;
  margin-top: 7px;
  margin-right:78px;
}
#g-nav ul li a{
  letter-spacing: 2.04px;
  font-size:1.7rem;
  font-weight: 600;
  margin-top: 5px;
}
#g-nav ul li a:before{
  content: "";
  width: 15px;
  height: 2px;
  display: block;
  margin: auto;
  text-align: center;
  background: var(--main--color);
  transition : all 0.2s ease 0s;
  opacity: 0;
  margin-top: -4px;
}
#g-nav ul li a:hover{
  color: var(--main--color);
}
#g-nav ul li a:hover:before{
  transition : all 0.2s ease 0s;
  opacity: 1;
}
#g-nav ul li a.is-active:before{
  transition : all 0.2s ease 0s;
  opacity: 1;
}
.menu-description{
  display: block;
  font-size: 1.2rem;
  font-weight: 400;
  letter-spacing: 1.08px;
  line-height: 1.75rem;
}
@media (max-width: 1920px) {
  #g-nav{
    width: 80%;
  }
  #g-nav ul{
    justify-content: flex-start;
  }
  #g-nav ul li:last-child{
    margin-right: initial;
  }
  .header-item{
    justify-content: flex-start;
  }
}
@media (max-width: 1335px) {
  #g-nav {
    margin-left: 50px;
  }
}
@media (max-width: 1240px) {
  #header {
    width: 100%;
    position: fixed;
    z-index: 999;
    padding: 0px 20px;
  }
  #header.is-show{
    display: block;
  }
  
  .header-item {
    display: flex;
    align-items:center;
    justify-content:space-between;
    margin-top: 10px;
    margin-bottom: 10px;
  }
  #header-logo img{
    width: 210px;
  }
  
  #nav-logo{
    display: block;
    text-align:left;
  }

  #nav-logo img{
    width: 210px;
  }

  #g-nav.panelactive {
    right: 0;
    border-left: 2px solid var(--main--color);
  }
  #g-nav {
    background: var(--sub--color);
    position: fixed;
    right: -120%;
    left: initial;
    top: 0;
    width: 40vw;
    height: 100%;
    padding: 10px 20px;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center;
    justify-content:center;
  }
  #g-nav ul{
    flex-flow: column;
    justify-content: space-around;
  }
  #g-nav ul li{
    margin-bottom: initial;
    margin-right: initial;
  }

  /*menu*/
  #menu {
    vertical-align: middle;
    font-weight: bold;
    font-size: 2.2rem;
    letter-spacing: 2.64px;
    width:100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: calc(100% - 40px);
  }
  #menu ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center;
  }
  
  #menu li {
    margin-bottom: var(--space--s);
    padding-left: initial;
    text-align: center;
  }
  
  #menu li a:hover{
    color: var(--hover--color);
  }
}

@media (max-width: 820px ){
  #header-logo{
    width: 210px;
  }
  #header-logo img{
    width: 210px;
  }
  #g-nav{
    width: 50vw;
  }
  .breaking-news {
    font-weight: 400;
    text-align:left;
    font-size: 1.4rem;
    letter-spacing: 0.74px;
    line-height: calc(25 /14);
  }
}

@media (max-width:540px) {
  #g-nav {
    width: 100vw;
  }
  #g-nav.panelactive {
    border-left: none;
  }
}

@media (max-width: 374px){
  #header-logo img {
      width: 180px;
  }
}
/*=================================================
sidebar
===================================*/
#page-title-box{
  display: none;
}
#sidebar{
  padding: 70px 30px;
  margin-top: 100px;
  float: left;
  width: 300px;
  height: 100vh;
  position: fixed;
  font-size: 1.3rem;
}
#sidebar ul{
  margin-top: 4px;
}
#sidebar ul li{
  margin-bottom: 20px;
}
#sidebar ul li a{
  display: flex;
  align-items: center;
  font-size: 1.4rem;
  font-weight: 500;
  letter-spacing:0.84px;
}
#sidebar ul li a:before{
  content: "";
  border: 1px solid;
  display: block;
  width: 15px;
  opacity: 0;
  display: inline-block;
  margin-right: 10px;
}
#sidebar ul li a.is-active:before{
  opacity: 1;
}

@media (max-width: 1160px ){
  #sidebar{
    padding: 0 20px;
    margin-top: 100px;
    float: initial;
    width: 100%;
    height: initial;
    position: initial;
    font-size: 1.3rem;
  }
  #sidebar ul li {
    margin-bottom: initial;
    padding: 17px;
    border-bottom: 1px solid #C9C9C9;
  }
  #sidebar ul li a {
    justify-content: center;
    margin-right: 15px;
  }
  #page-title-box{
    display: block;
    margin-bottom:11px;
  }
  #page-title-box .page-title{
    font-size: 1.7rem;
    letter-spacing: 2.04px;
    margin-right:18px;
    font-weight: 500;
  }
  #page-title-box .page-current{
    margin-bottom: inherit;
  }
  #page-title-box .page-sub-title{
    font-size: 1.2rem;
    letter-spacing: 1.08px;
    font-weight: 400;
  }
  .menu-border{
      border: 0.05rem solid currentColor;
      width: 100vw;
      margin: 0 calc(50% - 50vw);
  }
}
/*=================================================
loading
===================================*/
/* ローディング画面 */
#loading {
  width: 100vw;
  height: 100vh;
  transition: all 1s;
  background-color: #ffffff;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 999;
  position: absolute;
}

#loading.loaded {
  display:none;
  visibility: hidden;
}

.loader,
.loader:after {
  border-radius: 50%;
  width: 50px;
  height: 50px;
}

.loader {
  margin: 60px auto;
  font-size: 0.5rem;
  position: relative;
  text-indent: -9999em;
  border-top: 3px solid rgba(0, 0, 0, 0.7);
  border-right: 3px solid rgba(0, 0, 0, 0.7);
  border-bottom: 3px solid rgba(0, 0, 0, 0.7);
  border-left: 3px solid #ffffff;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: load8 1.1s infinite linear;
  animation: load8 1.1s infinite linear;
}
@-webkit-keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

/*=================================================
mainvisual
===================================*/
#mainvisual {
  width:100%; 
}
.sp-mainvisual{
  display:none;
}

@media (max-width: 820px ){
  .pc-mainvisual{
    display:none;
  }
  .sp-mainvisual{
    display:block;
  }
}

#mainvisual-image{
  width:100%; 
  height:100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}
#mainvisual-image img{
  max-width: 1040px;
  width: 100%;
  padding:20px;
}
.image-common{
  border: 2px solid;
}
#mainvisual-box__first{
  display:flex;
  justify-content:center;
}
#mainvisual-1{
  margin-top:98px;
  margin-left:45px;
  margin-bottom: 50px;
}
#mainvisual-1 img{
  max-width:750px;
  width:100%;
}
#mainvisual-2{
  margin-top: 48px;
  margin-right:30px;
  margin-left:90px;
}
#mainvisual-2 img{
  max-width:525px;
  width:100%;
}

#mainvisual-box__second{
  display:flex;
  justify-content:center;
}
.second-box1{

}
.second-box2{
  display: flex;
  flex-direction: column;
}
#mainvisual-3{
  margin-top:200px;
  margin-bottom:180px;
  margin-right: 50px;
  margin-left:155px;
}
#mainvisual-4{
  margin-bottom:85px;
  margin-right:185px;
}
#mainvisual-5{
  margin-left:125px;
  margin-right:60px;
  margin-bottom: 50px;
}
#mainvisual-3 img,
#mainvisual-4 img,
#mainvisual-5 img
{
  max-width:525px;
  width:100%;
}

@media (max-width: 820px ){
  #mainvisual-1 {
    margin-top: 30px;
    margin-left: initial;
    margin-bottom: 40px;
    margin-right: 20px;
  }
  #mainvisual-2{
    margin-top: 48px;
    margin-right: inherit;
    margin-left: 75px;
    text-align: right;
  }
  #mainvisual-3 {
    margin-top: initial;
    margin-bottom: 40px;
    margin-right: 56px;
    margin-left: 20px;
  }
  #mainvisual-4 {
    margin-bottom: 55px;
    text-align: center;
    margin-right: 37px;
    margin-left: 38px;
  }
  #mainvisual-5 {
    margin-left: 55px;
    margin-right: 20px;
    margin-bottom: 72px;
    text-align: right;
  }
  #mainvisual-1 img,
  #mainvisual-2 img,
  #mainvisual-3 img,
  #mainvisual-4 img,
  #mainvisual-5 img{
    max-width: initial;
  }

}

#mainvisual-desktop{
  display:block;
  width:100%;
}
#mainvisual-mobile{
  display:none;
  height:100vh;
}
.title-box{
  display:flex;
  border-left:initial;
  width:fit-content;
}
#maintext {
  padding: 30px 99px 30px 90px;
  max-width: 639px;
  width: 100%;
  border-top: 2px solid;
  border-bottom: 2px solid;
}
.maintext-box{
  width:160px;
  border: 2px solid;
}

.fadeIn{
  opacity : 0;
  transform : translate(0, 200px);
  transition : all 1.5s;
}
.fadeIn2{
  opacity : 0;
  transform : translate(0, 150px);
  transition : all 1.8s;
}

.fadeInSoon1{
  opacity : 0;
  transform : translate(0, 300px);
  transition : all 1.2s;
}

.fadeInSoon2{
  opacity : 0;
  transform : translate(0, 300px);
  transition : all 1.8s;
}

.fadeInSoon3{
  opacity : 0;
  transform : translate(0, 300px);
  transition : all 2.0s;
}

.fadeIn.active,.fadeIn2.active,.fadeInSoon1.active,.fadeInSoon2.active,.fadeInSoon3.active{
  opacity : 1;
  transform : translate(0, 0);
}

@keyframes fadeUpAnime{
  from {
    opacity: 0;
    transform: translateY(100px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}  

@media (max-width:820px){
  #maintext {
    padding: 0px 20px;
    max-width: 639px;
    width: fit-content;
    align-items: center;
    display: flex;
    height: 120px;
  }
  .maintext-box {
    margin-right: 12px;
    width: 120px;
  }
  .title-box{
    margin-right: 20px;
    width: 100%;
  }
  #mainvisual-image img{
    width:100%;
  }
}

@media (max-width:540px) {
  .maintext-box{
    max-width:80px;
    width: 100%;
  }
  #mainvisual-desktop{
    display:none;
  }
  #mainvisual-mobile{
    display:block;
    width: 100%;
  }
  #maintext {
    padding: initial;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: initial;
    max-width: 300px;
    width: 100%;
  }
}

@media (max-width: 374px) {
  .maintext-box {
    max-width: 60px;
  }
  #maintext {
    height: 60px;
  }
}
@media (max-width: 280px) {
  .maintext-box {
    max-width: 54px;
  }
  #maintext {
    height: 54px;
  }
}

.photo-caption{
  text-align:right;
  margin-top: 54px;
}

@media (max-width: 540px) {
  .photo-caption .caption-name{
    display: block;
  }
  .photo-caption .slash{
    display: none;
  }
}

/*=================================================
about
===================================*/
#about{
  padding-top:150px;
  padding-bottom:200px;
}
.about-box {
  max-width: 910px;
  margin: auto;
  padding: 0px 50px;
}
.about-text {
  font-weight: bold;
  font-size: 27px;
  line-height: calc( 47/ 27);
  letter-spacing: -0.02rem;
}
@media (max-width: 820px) {
  .about-box{
    padding: 0px 20px;
  }
}

@media (max-width: 540px) {
  #about{
    padding-top:36px;
    padding-bottom:54px;
  }
  .about-text {
    font-size: 1.8rem;
    line-height: calc( 32/ 18);
    letter-spacing: 1.08px;
  }
}

@media (max-width: 374px){
  .about-text {
      font-size: 1.4rem;
  }
}
/*=================================================
works
===================================*/
.program-box{
  display:flex;
  border: 2px solid var(--main--color);
  border-right: none;
}
.program-subheading{
  display:flex;
  font-size: 2.2rem;
  width: 265px;
  border-right: 2px solid var(--main--color);
  justify-content:center;
  align-items:center;
}
.program-subheading p{
  text-align:center;
  font-weight: bold;
  letter-spacing: 2.64px;
}
.program-text{
  flex: 1;
  max-width: 683px;
  padding: var(--space--s);
}
.program-text p{
  margin: -10px 0px;
}
.program-text p:not(:first-child){
  margin: -10px 0px;
  margin-top:50px;
}

.program-schedule p{
  font-size: 1.6rem;
}
.program-schedule{
  margin-top:50px;
}
.program-schedule-item{
  display:flex;
  background: var(--bg--color);
  padding: 17px 23px;
  margin-bottom:5px;
}
.program-schedule-heding{
  width: 80px;
  font-weight: bold;
  margin-right: 23px;
}
.program-schedule-info{
  flex:1;
}
.organizations-box{
  margin-top:70px;
}
.organizations{
  margin-top: 20px;
}
.organizations-item{
  margin-bottom:10px;
  text-indent: -0.7em;
  padding-left: 0.7em;
}
.organaization-name{
  font-weight: bold;
}

.organizations-item:before{
  content: "";
  list-style: disc;
  display:  inline-block;
  background-color: #333;
  border-radius:  50%;
  width: 3px;
  height: 3px;
  position:  relative;
  top: -5px;
  margin-right: 3px;
}

.organizations-item:last-child{
  margin-bottom:initial;
}

@media (max-width: 1024px){
  .program-text{
    max-width: initial;
  }
}

@media (max-width: 820px){
  .program-box{
    flex-direction: column;
    padding-right: initial;
    margin-left: 20px;
  }
  .program-subheading{
    display:flex;
    font-size: 2.2rem;
    width: 100%;
    height:100px;
    justify-content:flex-start;
    color: var(--main--color);
    background: var(--sub--color);
    padding: 30px;
    border-right: initial;
    border-bottom: 2px solid var(--main--color);
  }
  .program-text{
    padding: 30px;
    border-right: initial;
  }
  .program-text p{
    margin: -7px 0px;
  }
  .program-schedule-item{
    padding: 17px;
    flex-direction: column;
  }
}

/*=================================================
news
===================================*/
#news,#information{
  background:var(--bg--color);
}
#information{
  padding-bottom: var(--space--m);
}

/*=================================================
case
===================================*/
#case-carousel{
  margin-top: 30px;
}
.case-btn{
  width: 162px;
}
.case_btn a{
  border-bottom: 2px solid;
  font-size:1.4rem;
  font-weight:bold;
  padding-bottom: 6px;
  letter-spacing: 1.95px;
}
.case_btn__text{
  display:inline-block;
  text-align: left;
  pointer-events: auto;
  margin-right:7px;
  font-size: 1.4rem;
  letter-spacing: 2.1px;
  margin-bottom: initial;
  max-width: 90%;
}
.case_btn__text span{
  margin-left: 5px;
}
.arrow-right-min {
  display: inline-block;
  width: 9px;
  height: 9px;
  border-top: 2px solid #000;
  border-right: 2px solid #000;
  transform: rotate(45deg);
  margin-right: 2px;
  margin-left: 10px;
}
.case_btn a:hover .arrow-right-min{
  border-top: 2px solid var(--hover--color);
  border-right: 2px solid var(--hover--color);
}

/*=================================================
related
===================================*/
#related{
  background: #F5F4EF;
  padding-right: 99px;
  padding-top:37px;
  padding-bottom:50px;
}
#related h4{
    font-size: 1.4rem;
    letter-spacing: 0.84px;
    margin-bottom: 36px;
    font-weight: 500;
}
.related_contents{
  margin-left: 300px;
}
#related_case{
  margin-bottom: 54px;
}
.related-case-list{
  display: flex;
  flex-wrap: wrap;
}
.related-case-list li{
  margin-right: 28px;
  margin-bottom: 28px;
}
@media (max-width: 1160px ){
  .related_contents{
    margin-left: 20px;
  }
}

@media (max-width: 540px ){
  #related{
    background: #F5F4EF;
    padding-right: 20px;
    padding-left: 20px;
  }
  .related-case-list {
    flex-direction: column;
  }
  .related-case-list li{
    margin-right: 20px;
    margin-bottom: 20px;
  }
  .related_contents{
    margin-left: initial;
  }
}
/*=================================================
archives
===================================*/
.archives-list{
  display: flex;
  flex-wrap:wrap;
  justify-content:space-between;
}
.archives-list li{
  width: calc(50% - 27px);
  margin-bottom: 45px;
  margin-right : 54px;
}
.archives-list li:last-child, .archives-list li:nth-last-child(2){
  margin-bottom: initial;
}
.archives-list li a:hover{
  opacity: 0.5;
  transition : all 0.2s ease 0s;
}

#page .archives-list li,#related .archives-list li{
  width: calc(33% - 27px);
  margin-bottom: 54px;
  margin-right : 27px;
}
#page .archives-list li:nth-child(3n),#related .archives-list li:nth-child(3n){
  margin-right : initial;
}
/* 最終行のアイテム数が2つの時、左右に振り分けられるのを防ぐ */
#page .archives-list li:nth-child(3n-1),#related .archives-list li:nth-child(3n-1){
  margin-right:auto;
  margin-left:20px;
}
.archives-list li:nth-child(even){
  margin-right:initial;
}
.archive-category-box{
  display: flex;
  justify-content: space-between;
}
.archives-category{
  font-size: 1.2rem;
  padding: 6px 14px;
  border: 1px solid;
  border-bottom:initial;
  background: #ffffff;
}
.archives-single-header{
  position: relative;
  width: 100%;
}
.archives-title-box{
  display:block;
}
.archives-category--single{
  font-size: 1.2rem;
  padding: 12px 14px;
  border: 1px solid;
  display: inline-block;
  background: #ffffff;
  position: absolute;
  right:0;
  bottom:0;
  z-index: -1;
}
.archives-title-single{
  display: block;
  padding-right: 180px;
  width:100%;
}

.archives-category-icon{
  width: 32px;
  margin-bottom:13px;
}
.archives-category-icon img{
  display: block;
}
.archives-image{
  border: 1px solid;
  margin-bottom: 16px;
  position: relative;
  overflow: hidden;
  padding-top: 60%;
}
.archives-image img{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.archives-title{
  font-size:1.4rem;
  font-weight: 500;
  letter-spacing: 0.84px;
  margin-bottom: 5px;
}
.archives-description{
  font-size:1.4rem;
  font-weight: 400;
  line-height: calc(25 / 14);
}

@media (max-width: 1060px){
  #page .archives-list li,#related .archives-list li{
    width: calc(50% - 27px);
    margin-bottom: 54px;
    margin-right : 54px;
  }
  #page .archives-list li:nth-child(3n),#related .archives-list li:nth-child(3n){
    margin-right : 54px;
  }
  #page .archives-list li:nth-child(3n-1),#related .archives-list li:nth-child(3n-1){
    margin-right : 54px;
    margin-left:initial;
  }
  #page .archives-list li:nth-child(even),.archives-list li:nth-child(even){
    margin-right:initial;
  }
  .archives-category--single{
    position: initial;
    margin-bottom:18px;
  }
  .archives-title-single{
    padding-right: initial;
  }
}

@media (max-width: 540px ){
  .archives-list li{
    width: 100%;
    margin-right : initial;
  }
  #page .archives-list li,#related .archives-list li{
    width: 100%;
    margin-bottom: 54px;
    margin-right : initial;
  }
  .archives-list li:last-child, .archives-list li:nth-last-child(2){
    margin-bottom: 54px;
  }
  #page .archives-list li:nth-child(3n),#related .archives-list li:nth-child(3n){
    margin-right : initial;
  }
  #page .archives-list li:nth-child(3n-1),#related .archives-list li:nth-child(3n-1){
    margin-right: initial;
    margin-left:initial;
  }
}
@media (max-width: 374px ){
  .archives-description {
    font-size: 1.2rem;
  }
  .archives-list li:last-child{
    margin-bottom: initial;
  }
}

/*=================================================
info
===================================*/
.contact-item{
  text-align: center;
  max-width: 654px;
  margin: auto;
}

.info-text{
  height: 54px;
  display: flex;
  align-items: center;
  margin-bottom:72px;
}

/*form*/
.c-form{
  padding-top: 54px;
}
.c-form__item{
  text-align: left;
  display: flex;
  flex-direction: column;
  margin-bottom: 36px;
  width: 100%;
  padding-left: 30px;
  padding-right: 30px;
  font-size: 1.4rem;
}
.c-form__submit{
  text-align: center;
  display: inline-block;
}
.c-form__submit input,.back-button{
  font-size: 1.4rem;
  font-weight: bold;
  background: #fff;
  border-radius: 30px;
  display: inline-block;
  width: 162px;
  border: 1px solid #333;
  padding: 5px;
  letter-spacing: 2.1px;
  text-indent: 0.5em;
  text-align: center;
  height: 54px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.c-form__submit input:hover,.c-form__submit .back-button:hover{
  color: var(--hover--color);
  border: 2px solid var(--hover--color);
}
.c-form__inquiry{
  text-align: left;
  margin-top:9px;
}
.c-form__inquiry label{
  width: 100%;
}
input[type=radio] {
  display: none;
}
.wpcf7-list-item.first {
  margin: 0;
}
.wpcf7-list-item-label {
  cursor: pointer;
  display: flex;
}
input[type="radio"] {
  opacity: 0;
  position: absolute;
}
/* チェック前のボタン */
.wpcf7-list-item-label::before {
  background: #fff;
  border: 1px solid #333;
  border-radius: 100%;
  content: "";
  height: 1.4em;
  margin-bottom: auto;
  margin-right: .5em;
  margin-top: auto;
  transition: background-color .5s; 
  width: 1.4em;
}
span.wpcf7-list-item-label {
  margin-right: 54px;
}
input[type="radio"]:checked + .wpcf7-list-item-label::before {
  background-color: #333;
  box-shadow: inset 0 0 0 3px #fff; 
}
.wpcf7-spinner {
  display: block;
  margin: auto;
}
input{
  text-align: left;
  line-height: 1.5rem;
  background: #fff;
  padding: 10px 15px;
  height: 54px;
  width: 100%;
  margin-top: 9px;
}
textarea{
  text-align: left;
  line-height: calc(30 / 16);
  background: #fff;
  padding:10px 15px;
  width: 100%;
  margin-top: 9px;
}
label{
  margin-bottom:9px;
}

input.invalid{
    background-color: #ffe1e1;
}
.error{
    color: #ff7676;
    font-size: .8em;
    display: none;
}
.error.invalid{
    display: block;
}
.end-message {
  display: none;
  padding: 10px;
}
.false-message {
  display: none;
  padding: 10px;
}

@media (max-width: 1024px) {
  .contact-logo{
    width: 400px;
  }
}

@media (max-width: 820px) {
  .contact-logo{
    width: 230px;
  }
  .c-form__inquiry{
    display: flex;
    flex-direction: column;
  }
  .c-form__item{
    padding-left: 15px;
    padding-right: 15px;
  }
  .wpcf7-list-item.first,.wpcf7-list-item {
    display: block;
    margin : 0px 0px 10px 0px;
  }
}

/*=================================================
confrim-page
===================================*/
#page.contact-confirm,#page.contact-thanks{
  padding: 73px 99px 73px 99px;
}
.contact-confirm,.contact-thanks{
  background: var(--bg--color);
}
.contact-thanks{
  min-height: 80vh;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.confirm-titile{
  text-align:left;
  padding: 0px 30px;
}
.confirm-item{
  display: flex;
  align-items: center;
  text-align: left;
  line-height: 1.5rem;
  background: #fff;
  padding: 10px 15px;
  height: 54px;
  width: 100%;
  margin-top: 9px;
}
.thanks-info{
  margin-bottom:139px;
}
.thanks-back{
  display: flex;
  justify-content: center;
}

.confirm-textarea{
  background: #fff;
  padding: 10px 15px;
}
.submit-box{
  display: flex;
  justify-content: center;
  padding-left: 30px;
  padding-right: 30px;
}
.submit-box div:last-child{
  display:none;
}
.back-button{
  margin-right: 10px;
  margin-top:9px;
}
@media (max-width: 1240px){
  #page.contact-confirm,#page.contact-thanks{
    padding-top: 100px;
  }
}
@media (max-width: 820px){
  .confirm-titile{
    padding: 0px 15px;
  }
}
@media (max-width: 540px ){
  #page.contact-confirm{
    padding: 100px 20px 73px 20px;
  }
  .submit-box{
    flex-direction:column;
    align-items: center;
  }
  .back-button{
    margin-right: initial;
  }
  .thanks-info{
    margin-bottom:108px;
    text-align:left;
  }
}

/*=================================================
footer
===================================*/
#footer {
  width: 100%;
  text-align: center;
  padding: 25px 30px 72px 30px;
  border-top: 1px solid;
}

#footer-sitelogo{
  text-align: left;
}
#footer-sitelogo img{
  width: 212px;
}
#footer-list {
  display: flex;
  z-index: 800;
  position: relative;
  margin-bottom: 40px;
  margin-left: 284px;
}
.footer-list__item{
  text-align:left;
}
.footer-list__item a{

}
.footer-list__item:not(:last-child){
  margin-right:50px;
}
.tax-list {
  text-align: left;
  font-size: 1.2rem;
  margin-top: 10px;
}
.category-border{
  content: "";
  margin-top: 15px;
  width: 20px;
  height: 1px;
  background: var(--main--color);
}
.category-title{
  font-size: 1.5rem;
  font-weight: 500;
  letter-spacing: 1.8px;
}
#footer-list .menu-description{
  font-size: 1.0rem;
  margin-top: -3px;
  font-weight: 500;
  letter-spacing: 0.9px;
}
#footer-menu{
  display:flex;
  justify-content: center;
  text-align: center;
  margin: 0 auto;
  padding-bottom: 38px;
}
#footer-menu li:not(:first-child){
  margin-left:47px;
}
.footer-item{
  display:flex;
  justify-content: flex-end;
  margin-bottom:15px;
}
#footer-message{
  text-align:left;
}
#footer-message .mail{
  margin-left: 15px;
}
#footer-message .domain::before{
  content: '@';
}
#footer-text{
  display: flex;
  flex-direction:row-reverse;
  align-items:flex-end;
  justify-content: space-between;
}
#footer-logo{
  display:flex;
  justify-content:flex-end;
}
#footer-logo img{
  width:initial;
  height:45px;
}
.logo-image:first-child{
  margin-right:48px;
}
.footer-caption{
  vertical-align: middle;
  font-size: 1.2rem;
}
.message-info{
    margin-right: 30px;
    font-size: 1.2rem;
  }
@media (max-width:1160px){
  #footer{
    text-align:left;
    padding-top: 36px;
    padding-bottom: 70px;
  }
  #footer-list{
    margin-left: initial;
    margin-bottom:54px;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
  }
  #footer-sitelogo{
    padding-bottom: 36px;
    text-align: center;
  }
  .footer-border {
    border: 0.05rem solid #C1C1C1;
    width: 100vw;
    margin: 0 calc(50% - 50vw);
    margin-bottom: 20px;
  }
  #footer-logo{
    justify-content:flex-start;
  }
  #footer-text{
    display: block;
  }
  #footer-logo img{
    width:78px;
  }
  #footer-message{
    text-align:center;
    margin-bottom:52px;
  }
  .footer-caption:last-child{
    margin-bottom: initial;
  }
  .footer-item {
    flex-direction: column;
  }
  .footer-list__item:not(:last-child) {
    margin-right: 10px;
    margin-bottom: 50px;
    width: calc( 25% - 10px );
  }
}
@media (max-width: 820px) {
  #footer{
    padding :30px 20px 72px 20px;
  }
  .message-info{
    margin-right: initial;
  }
  .message-mail{
    margin-bottom:10px;
  }
  #footer-logo img{
    width:initial;
    height:40px;
  }
  .logo-image:first-child{
    margin-right:25px;
  }
  .footer-caption{
    margin-bottom:var(--space--m);
  }
  .art-caption{
    text-align:center;
  }
  .footer-list__item:not(:last-child) {
    width: calc( 33% - 10px );
  }
}
@media (max-width: 414px){
  #footer-message .mail{
    margin-left: initial;
  }
  #footer-list {
    display: flex;
    justify-content: flex-start;
    z-index: 800;
    position: relative;
    margin-bottom: 50px;
    flex-wrap: wrap;
  }
  .footer-list__item:not(:last-child) {
    width: 50%;
    margin-bottom: 36px;
    margin-right: initial;
  }
}

/*=================================================
conponent
===================================*/
/*openclose*/
.openclose {
  display:none;
  position: absolute;
  right: 0px;
  z-index: 999;
  justify-content: center;
  align-items: center;
  border-radius: 3px;
  width: 36px;
  height: 30px;
  top: 7px;
  right: 0;
  color: var(--sub--color);
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
  font-size: 0.6rem;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  font-size: 0.8em;
}
.openclose:hover{
  cursor:pointer;
}

.openclose span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #333;
  border-radius: 4px;
}

.openclose span:nth-of-type(1) {
  top: 0;
}

.openclose span:nth-of-type(2) {
  top: 10px;
}

.openclose span:nth-of-type(3) {
  top: 20px;
}

.openclose span:nth-of-type(2)::after {
  position: absolute;
  top: 0;
  left: 0;
  content: '';
  width: 100%;
  height: 2px;
  background-color: #333;
  border-radius: 4px;
  -webkit-transition: all .4s;
  transition: all .4s;
}

.openclose.active.news-active{
  position: fixed;
  top: 20px;
  right: 15px;
}

.openclose.active span:nth-of-type(1) {
  -webkit-transform: translateY(20px) scale(0);
          transform: translateY(20px) scale(0);
}

.openclose.active span:nth-of-type(2) {
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

.openclose.active span:nth-of-type(2)::after {
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
}

.openclose.active span:nth-of-type(3) {
  -webkit-transform: translateY(-20px) scale(0);
          transform: translateY(-20px) scale(0);
}

.btn{
  font-size: 1.4rem;
  font-weight:400;
  background:var(--sub--color);
  width:100%;
  margin-bottom: 3px;
}
@media (max-width: 1240px){
  .openclose{
    display: flex;
  }
}

/*site_btn*/
.site_btn{
  text-align:left;
  letter-spacing: calc(0.6px / 20);
  width:328px;
  height:50px;
  background:var(--sub--color);
  border: 1px solid var(--main--color);
  padding-left: 13px;
}
.site_btn:hover{
  color:var(--sub--color);
  background:var(--main--color);
}

/*news_btn*/
#news .news-item li{
  background: #ffffff;
  margin-bottom: 3px;
}
#news .arrow::before{
  right: 20px;
}
#news .arrow::after{
  right: 20px;
}
.news-title-box {
  display: flex;
  width: 100%;
  justify-content: space-between;
}
.news_btn{
  position: relative;
  font-size:1.4rem;
  display:flex;
  align-items:center;
  padding-top:25px;
  padding-bottom:25px;
  padding-left:30px;
  width:100%;
}
.news_btn:hover{
  color: var(--hover--color);
}
.news-date{
  width: 110px;
}
.news-title{
  margin-left: 89px;
  margin-right:54px;
}

/*arrow*/
.arrow{
  margin-left: 54px;
  display: inline-block;
  color: var(--main--color);
  vertical-align: middle;
  text-decoration: none;
  position:relative;
}
.arrow::before,
.arrow::after{
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  content: "";
  vertical-align: middle;
}

.arrow::before{
  right: 0;
  width: 50px;
  height: 1px;
  background: var(--main--color);
}
.arrow::after{
  right: 0;
  width: 10px;
  height: 10px;
  border-top: 1px solid var(--main--color);
  border-right: 1px solid var(--main--color);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.site_btn.arrow:hover{
  color: var(--sub--color);
  -webkit-transition: all 0.2s ease 0s;
  transition: all 0.2s ease 0s;
}
.site_btn.arrow:hover::before{
  background: var(--sub--color);
  -webkit-transition: all 0.2s ease 0s;
  transition: all 0.2s ease 0s;
}
.site_btn.arrow:hover::after{
  border-top: 2px solid var(--sub--color);
  border-right: 2px solid var(--sub--color);
}

.news_btn:hover .arrow{
  color: var(--hover--color);
  -webkit-transition: all 0.2s ease 0s;
  transition: all 0.2s ease 0s;
}
.news_btn:hover .arrow::before{
  background: var(--hover--color);
  -webkit-transition: all 0.2s ease 0s;
  transition: all 0.2s ease 0s;
}
.news_btn:hover .arrow::after{
  border-top: 2px solid var(--hover--color);
  border-right: 2px solid var(--hover--color);
}

/*section_btn*/
.section_btn-box{
  text-align: right;
  padding-right: var(--space--side2);
  margin-top:72px;
  margin-left: 261px;
}
#case .section_btn-box{
  margin-top:36px;
}
.section-btn{
  width: 162px;
}
.section_btn a{
  border-bottom: 2px solid;
  font-size:1.4rem;
  font-weight:bold;
  padding-bottom: 6px;
  letter-spacing: 1.95px;
}
.section_btn a:hover{
  border-bottom: 2px solid currentColor;
}
.section-btn__text{
  display:inline-block;
  width: 137px;
  text-align: left;
  pointer-events: auto;
}
#back-btn{
  position: fixed;
  bottom: 30px;
}
#back-btn a{
  display: block;
  border-bottom: initial;
}
#back-btn a:after{
  content: "";
  display: inline-block;
  height: 2px;
  width: 167px;
  background: currentColor;
  color: currentColor;
  position: absolute;
  bottom: 5px;
  left: 0px;
}
#back-btn a:hover{
  border-bottom: initial;
}
#back-btn a:hover:after{
  background: 2px solid currentColor;
}

#back-btn .section-btn__text{
  margin-bottom: initial;
  width: 147px;
  text-align: right;
}
.section_btn .arrow-right {
  margin-right: 5px;
  width: 10px;
  height: 10px;
}
.section_btn .arrow-left {
  display: inline-block;
  width: 10px;
  height: 10px;
  margin: 0 5px;
  border-left: 2px solid #000;
  border-bottom: 2px solid #000;
  transform: rotate(45deg);
}
.section_btn a:hover .arrow-right{
  border-top: 2px solid var(--hover--color);
  border-right: 2px solid var(--hover--color);
}
.section_btn a:hover .arrow-left{
  border-bottom: 2px solid var(--hover--color);
  border-left: 2px solid var(--hover--color);
}

@media (max-width:1920px) {
  .section_btn-box{
    max-width: calc( 1026px + var(--space--side2 ) + 54px);
  }
}

@media (max-width:768px) {
  .site_btn{
    font-size: 1.6rem;
    width: 268px;
  }
  .news_btn{
   font-size: 1.8rem;
   padding-left: 16px;
   line-height: 2.7rem;
  }
  .news_btn.arrow::before{
    right: 15px;
  }
  .news_btn.arrow::after{
    right: 15px;
  }
}

@media (max-width:1160px) {
  .section_btn-box {
    margin-left: initial;
  }
  .news_btn{
    display:block;
    padding-left: initial;
  }
  .news-date{
    width: 100%;
    margin-bottom:12px;
    font-size: 1.4rem;
  }
  .news-title {
    margin-left: initial;
    margin-right:10px;
    font-size: 1.4rem;
  }
  #back-btn a:after{
    left: 10px;
  }
  #back-btn {
      position: fixed;
      bottom: 30px;
      background: #ffffff;
      border: 2px solid;
      padding: 9px;
      z-index: 801;
      margin-right: 50px;
      bottom: 0;
      left: 0;
      height: 50px;
      width: calc(100% - 48px);
  }
  #news .news_btn{
    padding-left: 20px;
  }
  #news .news-title{
    margin-right: 30px;
  }
}

@media (max-width:820px) {
  #back-btn {
      padding: 10px;
  }
}
@media (max-width:540px) {
  .section_btn-box {
    margin-top: 54px;
  }
}
@media (max-width:374px) {
  .text-small {
    font-size: 1.4rem;
    line-height: calc(30 / 16);
  }
  #news .news-title{
    font-size: 1.2rem;
  }
  .section_btn a {
    font-size: 1.3rem;
  }
}
/*トップへ戻るボタン*/
.pagetop {
  height: 50px;
  width: 50px;
  border: 2px solid;
  position: fixed;
  right: 0;
  bottom: 0;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 801;
}

.pagetop-arrow {
  display: inline-block;
  vertical-align: middle;
  color: #333;
  line-height: 1;
  width: 1em;
  height: 1em;
  border: 2px solid currentColor;
  border-left: 0;
  border-bottom: 0;
  box-sizing: border-box;
  transform: translateY(25%) rotate(-45deg);
}
.pagetop:hover{
  opacity: 1;
  color: var(--main--color);
}

/*reCAPTCHA アイコンの非表示*/
.grecaptcha-badge { visibility: hidden; }