@charset"UTF-8";
:root {
  --color-base:#000000;
  --color-white:#fff;
  --color-black2:#231815;
  --color-gray1:#efefef;
  --color-gray2:#c2c6cc;
  --color-gray3:#c4c5c5;
  --color-blue:#195faf;
}

/**************************************
 * Common Styles
 **************************************/
html {
	font-size: 15px;
	box-sizing: border-box;
	height: 100%;
}
@media screen and (max-width: 767px) {
	html{
		font-size: 15px;
	}
}
/*
@media (min-width: 1280px) {
	html{
		font-size: 17px;
	}
}
@media (min-width: 1536px) {
  html{
    font-size: 19px;
  }
}
*/

body{
  font-family: "M PLUS 1", "游ゴシック体", "Yu Gothic", "游ゴシック", "YuGothic", "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W6", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", "MS PGothic", Arial, sans-serif;
	background-color: var(--color-white);
	color: var(--color-base);
	font-weight: 300;
	font-style: normal;
	line-height: 1.65;
	letter-spacing: 0.02em;
}
body.nav-opened{
  overflow: hidden !important;
}
body.nav-opened{
  overflow: hidden !important;
}

/* common width
============================================== */
.w1120{width:100%;max-width:1120px;margin-right: auto;margin-left: auto;}
.w1050{width:100%;max-width:1050px;margin-right: auto;margin-left: auto;}
.w1000{width:100%;max-width:1000px;margin-right: auto;margin-left: auto;}
.w960{width:100%;max-width:960px;margin-right: auto;margin-left: auto;}
.w880{width:100%;max-width:880px;margin-right: auto;margin-left: auto;}
.w776{width:100%;max-width:776px;margin-right: auto;margin-left: auto;}
.w640{width:100%;max-width:640px;margin-right: auto;margin-left: auto;}
@media screen and (max-width: 767px) {
  .w1120{max-width:100%;}
  .w1050{max-width:100%;}
  .w1000{max-width:100%;}
  .w960{max-width:100%;}
  .w880{max-width:640px;}
  .w776{max-width:640px;}
  .w640{max-width:640px;}
}


h1, h2, h3, h4, h5, h6{
	font-weight: 500;
}
p{
	word-break:break-all;
	letter-spacing: 0.03em;
	line-height: 1.65;
}
hr {
	margin: 0;
	border-top:1px solid white;
	color: inherit;
}
img{
	vertical-align: bottom;
}
img.full{
	width:100%;
	height: auto;
}
a {
	text-decoration: none;
	cursor: pointer;
	color: inherit;
	background: 0 0;
	font-size: 100%;
	margin: 0;
	padding: 0;
	vertical-align: baseline;
	letter-spacing: 0.03em;
}
a:link{
	text-decoration: none;
	outline: none;
	-webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  -ms-transition: 0.3s;
  transition: 0.3s;
}
a:focus,
a:visited,
a:active {
	color: inherit;
	text-decoration: none;
	outline: none;
}
a:hover{
	cursor: pointer;
}
a.trans:hover{
	opacity: 0.8;
}
a.decoration{
	display: inline-block;
  text-decoration: underline;
}
a img {
	border: none;
	text-decoration: none;
}
a.img-wrap{
	display: inline-block;
	line-height: 1;
	vertical-align: bottom;
}
a.img-wrap img,
a.img-wrap svg
{
	display: block;
	margin: 0;
	padding: 0;	
}
strong {
	font-weight: 500;
}
.sr-text{
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
}
.lang-en{
	word-break: normal;
}
.grecaptcha-badge{
  display: none;
}

/* BootStrap Theme Setting
============================================== */
.container-full {
	position: relative;
	display: block;
	width:100%;
	margin-left: auto;
	margin-right: auto;
}
.container-fluid {
	display: block;
}

/* Common Structure
============================================== */
.l-wrapper {
	width: 100%;
	position: relative;
}
.l-container {
	display:block;
	margin: 0 auto;
	min-height: 100vh;
	width: 100%;
}
.l-main{
	min-height:480px;
}
.l-main__wrapper {
	display:block;
	height: 100%;
	width: 100%;
}
.l-main__container {
	height: 100%;
	margin: 0 auto;
	position: relative;
	width: 100%;
}
/*
.l-main__container{
	padding-top:128px;
}
@media screen and (min-width: 960px) and (max-width: 1024px){
	.l-main__container{
		padding-top:186px;
	}
}
@media screen and (min-width: 768px) and (max-width: 959px) {
	.l-main__container{
    	padding-top: calc(5.9rem + 11vw);
	}
}
@media screen and (max-width: 767px) {
	.l-main__container{
		padding-top:83px;
	}
}
@media screen and (min-width: 1024px) {
	.l-main__container{
		padding-top:193px;
	}
}
@media (min-width: 1280px) {
	.l-main__container{
		padding-top:215px;
	}
}
@media (min-width: 1536px) {
	.l-main__container{
		padding-top:238px;
	}
}
*/

/***********************************************
   Common styles
***********************************************/

/* Common animation
============================================== */
.cover,
.cover_fast{
  position: relative;
}
.cover::after,
.cover_fast::after{
  content: "";
  display: block;
  position: absolute;
  background: var(--color-white);
  width: 100%;
  height: 103%;
  top:-1%;
  right:0;
  transition-property: width;
  transition-duration: 1.1s;
  transition-delay: .5s;
}
.cover.beige1::after,
.cover_fast.beige1::after{
  background: var(--color-beige1);
}
.cover.yellow2::after,
.cover_fast.yellow2::after{
  background: var(--color-yellow2);
}
.cover.green3::after,
.cover_fast.green3::after{
  background: var(--color-green3);
}
.cover_fast::after{
  transition-duration: .7s;
  transition-delay: .3s;
}
.cover.show::after,
.cover_fast.show::after{
  width: 0;
}
.fade_fast-list .fade-list-item,
.fade_fast,
.fade-list .fade-list-item,
.fade{
  opacity: 0;
  transition-duration: 0.26s;
  transition-property: opacity;
}
.fade-list .fade-list-item,
.fade{
  transition-duration: 1s;
}
.fade_fast-list .fade-list-item.show,
.fade-list .fade-list-item.show,
.fade_fast.show,
.fade.show{
  opacity: 1;
}
.fadein,
.fadein_list .fadein_list-item {
	transform: translate(0,40px);
	-moz-transform: translate(0,40px);
	-webkit-transform: translate(0,40px);
	opacity: 0;
}
.fadein.scrollin {
	transform: translate(0,0);
	-moz-transform: translate(0,0);
	-webkit-transform: translate(0,0);
	transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
	-moz-transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
	-webkit-transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
	opacity: 1;
}
.fadein_list .fadein_list-item.scrollin {
	transform: translate(0,0);
	-moz-transform: translate(0,0);
	-webkit-transform: translate(0,0);
	transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
	-moz-transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
	-webkit-transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
	opacity: 1;
}
.is-pc .fadein_list .fadein_list-item.scrollin {
	transform: translate(0,0);
	-moz-transform: translate(0,0);
	-webkit-transform: translate(0,0);
	transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
	-moz-transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
	-webkit-transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
	opacity: 1;
}
.fadein-right,
.fadein-after-right::after {
  transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
  -moz-transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
  -webkit-transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
  transform: translate(3.75rem, 1.25rem);
  -moz-transform: translate(3.75rem, 1.25rem);
  -webkit-transform: translate(3.75rem, 1.25rem);
  opacity: 0;
}
.fadein-left ,
.fadein-after-left::after {
  transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
  -moz-transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
  -webkit-transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
  transform: translate(-3.75rem, 1.25rem);
  -moz-transform: translate(-3.75rem, 1.25rem);
  -webkit-transform: translate(-3.75rem, 1.25rem);
  opacity: 0;
}
[class*="fadein-after-"].scrollin::after,
[class*="fadein-before-"].scrollin::before,
[class*="fadein-"].scrollin {
  opacity: 1;
	transform: translate(0,0);
	-moz-transform: translate(0,0);
	-webkit-transform: translate(0,0);
}

/* common
============================================== */
.c-abs{
  display: inline-block;
  line-height: 1;
  position: absolute;
  top: auto;
  left: auto;
  right: auto;
  z-index: 1;
}
.c-abs img{
  width:100%;
  height: auto;
}
.c-rel{
  position: relative;
}
/*
.c-container__height-full{
  overflow: hidden;
  height:100%;
}*/

/* Common Structure
============================================== */
.l-wrapper {
	width: 100%;
  position: relative;
}
/* body overflow対策 (斜め帯のはみ出し防止) */
body {
  overflow-x: hidden;
  position: relative;
  width: 100%;
}

/**************************************
 * Components: Background Diagonal Bands
 **************************************/
.c-diagonal-bg {
  position: absolute;
  left: 50%; /* 画面中央 */
  
  /* 中央配置 + 42px右ズレ + 傾斜(-9.31deg) */
  /* margin-left: 42px; 指定により中央から42pxずらす */
  /*margin-left: 42px; */
  transform: translateX(-50%) skewY(-9.31deg);
  transform-origin: center center;
  z-index: -1;
  pointer-events: none;
  /*aspect-ratio: 1866 / 506;*/
  width: 100%;
  height: 34rem;
}

/* 各バンドの垂直位置 (適宜調整が必要) */
.band-gray-header {
  background-color: var(--color-gray1);
  top: auto;
  bottom: -16vw;
  height: 100vw;
  z-index: -2;
}
.band-blue-intro {
  background-color: var(--color-blue);
  top: 5.8rem;
  height: 39.5rem;
  height: 90.5%;
}
@media (min-width: 768px) and (max-width: 1189px) {
  .c-intro {
    padding-bottom: 0rem!important;
  }
  .band-blue-intro {
    top: 5.8rem;
    height: 92.3%;
  }
  .c-about{
    padding-bottom: 0rem!important;
  }
}
@media (max-width: 767px) {
  .c-intro {
    padding-bottom: 0rem!important;
  }
  .band-blue-intro {
    top: 3.8rem;
    height: 91.5%;
  }
  .c-about{
    padding-bottom: 0rem!important;
  }
}
.band-blue-service {
  background-color: var(--color-blue);
  top: 11.5rem;
  height: 33rem;
}
@media (min-width: 768px) and (max-width: 1189px) {
  .c-service{
    padding-bottom: 8.3333rem!important;
  }
  .band-blue-service {
    top: 7.5rem;
    height: 76.5%;
  }
}
@media (max-width: 767px) {
  .c-service{
    padding-bottom: 8.3333rem!important;
  }
  .band-blue-service {
    top: 7.5rem;
    height: 86.5%;
  }
}
.band-gray-works {
  background-color: var(--color-gray1);
  top: -12rem;
  height: 100%;
  z-index: -2;
}
.band-blue-works {
  background-color: var(--color-blue);
  top: 50rem;
  height: 36rem;
}
@media (min-width: 768px) and (max-width: 1189px) {
  .band-gray-works {
    height: 75rem;
  }  
  .band-blue-works {
    top: 42rem;
    height: 26rem;
  }
}
@media (max-width: 767px) {
  .band-gray-works {
    height: 86rem;
  }
  .band-blue-works {
    top: 41rem;
    height: 52rem;
  }
}
.band-blue-access {
  background-color: var(--color-blue);
  top: 11.2rem;
  height: 32rem;
}
.band-gray-access {
  background-color: var(--color-gray1);
  top:auto;
  bottom: -12rem;
  height: 90%;
  z-index: -2;
}
@media (min-width: 768px) and (max-width: 1189px) {
  .c-access {
    padding-top: 5.3333rem!important;
  }  
  .band-blue-access {
    top: 9.2rem;
    height: 47%;
  }
}
@media (max-width: 767px) {
  .band-blue-access {
    top: 10.7rem;
    height: 56%;
  }
  .c-access {
      padding-top: 5.3333rem!important;
  }
}
.band-gray-contact {
  background-color: var(--color-gray1);
  top: auto;
  bottom: -3rem;
  height: 130%;
  z-index: -2;
}
@media (min-width: 768px) and (max-width: 1189px) {

  
}
@media (max-width: 767px) {
  .c-contact{
    padding-top: 2.3333rem!important;
  }
}

/* グレーの帯 (Contact下部〜Footer) */
.c-diagonal-bg--gray {
  background-color: var(--color-gray1);
  height: 1200px; /* フッターまで覆うよう長めに */
  top: auto;
  bottom: -300px; /* フッター下にはみ出させる */
  z-index: -2;
}

.c-bg--gray{
  position: relative;
}
.c-bg--gray::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--color-gray1);
    z-index: -2;
}

/**************************************
 * Components: UI
 **************************************/
.c-section-title {
  font-family: "M PLUS 1", sans-serif;
  font-weight: 500;
  font-size: 1rem;
  margin-bottom: 0em;
}
.c-title-en {
  display: block;
}
.c-prose {
  margin-top:0.3em;
  font-size: 1rem;
}
.c-table-type1{
  margin-top:1.8rem;
}
.c-table-type1 th,
.c-table-type1 td {
  padding: 1rem;
  border-top: 1px solid var(--color-gray2);
  text-align: left;
}
.c-table-type1 th {
  padding: 0.75rem 0.3rem 1.5rem;
  width: 6.9333rem;
  font-weight: 500;
  text-align: justify;
  text-justify: inter-ideograph;
  -moz-text-align-last: justify;
  text-align-last: justify;
}
.c-table-type1 th span {
  display: inline-block;
  width: 100%;
}
.c-table-type1 td{
  padding: 0.75rem 1rem 1.5rem 2.3rem;
  line-height: 1.8666;
}
.c-table-type1 td.address{
  line-height: 1.3333;
}
@media (max-width: 767px) {
  .c-table-type1 tr {
    display: flex;
    flex-direction: column;
  }
  .c-table-type1 th{
    background-color: var(--color-gray1);
    text-align: center;
    text-align-last: center;
  }
  .c-table-type1 th, .c-table-type1 td {
    width: 100%;
    border-top: none;
    padding: 0.5rem 0;
  }
}
.c-button-type1 {
  display: inline-block;
  border: 1px solid var(--color-base);
  background: #fff;
  cursor: pointer;
  font-size: 1rem;
  font-weight: 500;
  padding: 0.3rem 2rem;
  border-radius: 2em;
  cursor: pointer;
}
.c-button-type1 .text{
  position: relative;
  padding-left: 0.66666em;
}
.c-button-type1 .text::before{
  content: "";
  display: block;
  position: absolute;
  top: calc(50% - 0.2666rem);
  left:0;
  width: 0.5333rem;
  height: 100%;
  aspect-ratio: 8 / 10;
  z-index: 1;
  background-image: url('../img/common/icon_arrow_right.svg');
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: center top;
}
@media (max-width: 767px) {
  .c-button-type1 {
    padding: 0.3rem 1.4em;
  }
}

/**************************************
 * Section Specific
 **************************************/

/* header */
.l-header {
  /*
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 80px;
  z-index: 1000;
  background-color: rgba(255,255,255,0.95);
  box-shadow: 0 2px 5px rgba(0,0,0,0.05);
  */
}
.l-header__top{
  padding-top: 0.8666rem;
  padding-bottom:0.1333rem
}
.l-header__tel{
  width :1.29333rem;
}
.l-header__logo{
  aspect-ratio: 252 / 48;
  width: 16.8rem;
  height: auto;
}
.l-header__logo a{
  margin-top: 0.5rem;
  line-height: 1;
}
.l-header__tel{
  width: 12.9333rem;
  display: block;
}
.l-header__nav{
  height:4.9333rem;
}
@media (max-width: 767px) {
  .l-header__logo{
    width: 20.5333rem;
    display: inline-block;
    padding-top: 0.4rem;
  }
  .l-header__logo a {
    margin-top: 0;
  }
}

.c-nav{
    font-family: "Noto Sans JP", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    font-weight: 400;
}
.c-nav__list{
  height: 3.7333rem;
}

/* nav */
.c-nav__link {
  font-size: 0.9rem;
  position: relative;
  display: block;
  padding: 5px 0;
  position: relative;
}
/* ナビの青いチェックマーク */
.is-pc .c-nav__link:hover::after {
  content: "";
  display: block;
  position: absolute;
  aspect-ratio: 14 / 6;
  top: -2px;
  left: calc(50% - 0.4666rem);
  width: 0.9333rem;
  height: auto;
  border-radius: 2px;
  background-image: url('../img/common/fig_mark.svg');
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: center top;
}

/* NAVIGATION
============================================== */
.drawer-container {
  max-width:none;
}
.drawer-navbar {
  height: 3.7333rem;
  border-bottom: none;
  background-color: inherit;
}	
.drawer-navbar .drawer-menu {
}
.drawer-navbar .drawer-nav{
  height:100vh;
}
.drawer-nav {
  text-align: left;
  overflow: scroll;
  height: 100vh;
  background-color: inherit;
  color: var(--color-base);
}
/* 768px以上ではハンバーガーボタンを非表示、メニューリストは常時表示 */
@media screen and (min-width: 768px) {
  .drawer-toggle {
    display: none !important;
  }
  .drawer-navbar {
    display: block;
  }
  .drawer-navbar .drawer-nav {
    height: auto;
    overflow: visible;
  }
  .drawer-menu {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
  }
  body.drawer-open {
    overflow: auto;
  }
  .drawer-overlay {
    display: none !important;
  }
}
.drawer-navbar .drawer-menu li {
  float: unset;
}
.drawer-nav ul li {
  position: relative;
}
.drawer-nav ul li.home{
  display: none;
}
.drawer-nav a {
  color: var(--color-base);
}
@media (max-width: 767px) {
  .drawer-navbar {
    z-index: 4;
  }
  .drawer-container {
    max-width:none;
    text-align: right;
  }
  .drawer-hamburger {
    background-color: var(--color-white);
    position: fixed;
    z-index: 104;
    top: 0.85rem;
    right: 16px;
    display: block;
    width:26px;
    border-radius: 50%;
    padding: 0;
    padding-top: 15px;
    padding-right: 12px;
    padding-bottom: 23px;
    padding-left: 12px;
    opacity: 0.9;
  }
  .drawer--top .drawer-hamburger{
    right:16px;
    background-color: var(--color-white);
  }
  .drawer--top.drawer-open .drawer-hamburger{
    right:16px;
    background-color: var(--color-blue);
  }
  .drawer-hamburger:hover {
    cursor: pointer;
    background-color: var(--color-white);
  }
  .drawer-hamburger-icon,
  .drawer-hamburger-icon:before,
  .drawer-hamburger-icon:after{
    height: 2px;
    background-color: var(--color-blue);
  }
  .drawer--top.drawer-close .drawer-hamburger-icon,
  .drawer--top.drawer-close .drawer-hamburger-icon:before,
  .drawer--top.drawer-close .drawer-hamburger-icon:after{
    background-color: var(--color-blue);
  }
  .drawer--top.drawer-open .drawer-hamburger-icon:before,
  .drawer--top.drawer-open .drawer-hamburger-icon:after{
    background-color: var(--color-white);
  }
  .drawer--right.drawer-open .drawer-hamburger {
    right: 18rem;
  }
  .drawer-navbar .drawer-navbar-header {
    border-bottom: none;
  }
  .drawer-navbar-header{
    z-index: 102;
    height:0;
  }
  .drawer-nav {
    text-align:left;
    overflow: scroll;
    height: 100vh;
    background-color: var(--color-blue);
    color:var(--color-white);
  }
  .drawer-nav a {
    color:var(--color-white);
  }
  .drawer-nav ul {
    padding:4% 15%!important;;
    /*border-bottom:1px solid #000;*/
    margin:0;
  }
  .drawer-nav ul li.home{
    display: list-item
  }
  .drawer-nav ul li {
  	padding:5px 0 20px;
    position:relative;
    list-style: none;
  }
}

/* footer */
.l-footer__logo{
  aspect-ratio: 252 / 48;
  width: 13.3333rem;
}
.l-footer .c-pagetop{
  position: absolute;
  aspect-ratio: 36 / 100;
  display: block;
  right: 3rem;
  bottom: 7rem;
  z-index: 300;
  width: 2.4rem;
  height: auto;
  opacity: 0.9;
}
.l-footer__address-list li{
  width:100%;
  max-width:21.8666rem;
  padding-top:0.6rem;
  padding-bottom:0.6rem;
}
.l-footer__address a{
  display: block;
  aspect-ratio: 328 / 48;
}
.l-footer__copyright{
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 300;
  font-size: 0.7333rem;
}
@media (max-width: 767px) {
  .l-footer__address-list li{
    max-width: 15.8666rem;
  }
  .l-footer__logo{
    width: 12.3333rem;
  }
  .l-footer .c-pagetop{
    right: 1.3333rem;
    bottom: 6.6666rem;
    width: 3.2rem;
  }
}

/* common:image title-en */
.c-title-en{
  display: inline-block;
  line-height: 1;
  z-index: 3;
}
.c-title-en.professional{
  width:auto;
  height:2.9333rem;
  aspect-ratio: 438 / 44;
  overflow: hidden;
  margin-top: 2.9333rem;
}
.c-title-en.news{
  width:auto;
  height:2.9333rem;
  aspect-ratio: 164 / 44;
}
.c-title-en.vertical{
  width:2.9333rem;
  height:auto;
  overflow: hidden;
}
.c-title-en.about{
  aspect-ratio: 44 / 196;
}
.c-title-en.service{
  aspect-ratio: 44 / 240;
}
.c-title-en.works{
  aspect-ratio: 44 / 208;
}
.c-title-en.access{
  aspect-ratio: 44 / 222;
}
.c-title-en.contact{
  aspect-ratio: 44 / 258;
}
@media (max-width: 960px) {
  .c-title-en.professional {
    left:0;
    margin-top: 0;
    width: 4.55vw;
    height: auto;
    aspect-ratio: 44 / 438;
  }
  .c-title-en.news{
    height:4.55vw;
  }
  .c-title-en.vertical {
    width: 4.55vw;
    height:auto;
  }
}

@media (min-width: 641px) and (max-width: 767px) {
  .c-title-en.professional {
    width: 6.55vw;
  }
  .c-title-en.news {
    height: 6.55vw;
  }
  .c-title-en.vertical {
    width: 6.55vw;
  }  
}

@media (max-width: 640px) {
  .c-title-en.professional {
    width: 8.55vw;
  }
  .c-title-en.news {
    height: 8.55vw;
  }
  .c-title-en.vertical {
    width: 8.55vw;
  }  
}

/* common:VISUAL CONTAINER */
.c-visual_container{
  position: relative;
  width:100%;
  height: auto;
}
.c-text-container{
  background-color: var(--color-white);
  padding-left:0.8666rem;
  padding-right:1.4rem;
}
@media (max-width: 767px) {
  .c-text-container{
    padding-left:1.3333rem;
    padding-right:1.3333rem;
    padding-top: 1.3333rem;
    padding-bottom: 1.3333rem;
  }
}

/* PROFESSIONAL */
.c-intro{
  padding-top: 4.6rem;
  padding-bottom: 5.8666rem;
}
.c-intro__text{
  padding-top: 0.5rem;
}
.c-intro__lead{
  margin-top: calc(2.9333rem * 2.9);
}
.c-intro__lead .text{
  display: inline-block;
  padding: 0.4em;
  background-color: var(--color-white);
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 300;
  line-height: 1;
  font-size: 1.0666rem;
  margin-bottom: 0.85rem;
}
@media (min-width: 768px) {
  .c-intro__text{
    -ms-flex: 0 0 46.4285%;
    flex: 0 0 46.4285%;
    width: 46.4285%;
    max-width: 46.4285%;
  }
  .c-intro__image{
    -ms-flex: 0 0 53.571%;
    flex: 0 0 53.571%;
    width: 53.571%;
    max-width: 53.571%;
  }
  .c-intro__lead .text{
    font-size: 0.8666rem;
  }
}
.c-intro .c-visual_container{
  aspect-ratio: 500 / 482;
  max-width: 33.3333rem;
}
.c-intro__arrow_wrapper{
  padding-right:20%;
}
.c-intro__arrow{
  position: relative;
  display: inline-block;
  line-height: 1;
  width: 3.4666rem;
  margin-left: 11rem;
}
@media (max-width: 960px) {
  .c-intro__image {
      -ms-flex: 0 0 53.571%;
      flex: 0 0 47.571%;
      width: 47.571%;
      max-width: 47.571%;
  }
  .c-intro__text {
      -ms-flex: 0 0 46.4285%;
      flex: 0 0 50.4285%;
      width: 50.4285%;
      max-width: 50.4285%;
  }
  .c-intro__arrow{
    margin-left: calc(50% - 0.4666rem);
  }
  .c-intro .c-visual_container{
    padding-left: 4rem;
  }
  .c-intro__lead{
    margin-top: 0;
    font-size: 0.9rem;
  }
}
@media (max-width: 767px) {
  .c-intro__image {
      -ms-flex: 0 0 100%;
      flex: 0 0 100%;
      width: 100%;
      max-width: 100%;
  }
  .c-intro__text {
      -ms-flex: 0 0 100%;
      flex: 0 0 100%;
      width: 100%;
      max-width: 100%;
  }
  .c-intro .c-visual_container{
    padding-left: 12vw;
  }
}


/* ABOUT */
.c-about{
  padding-top: 7.3333rem;
  padding-bottom: 6rem;
}
.c-about .c-visual_container{
  aspect-ratio: 440 / 482;
  max-width: 29.3333rem;
}
.c-about .c-visual_container img.under {
  top: 0; left: 0;
  width: 80.4545%;
  z-index: 1;
}
.c-about .c-visual_container img.over {
  bottom: 0; right: 0;
  width: 56.3636%;
  z-index: 2;
}
.c-about .c-text-container{
  width: calc(100% - 2px);
}
.c-title-en.about{
  top: 0; right: 0;
}
@media (max-width: 767px) {
  .c-about .c-visual_container{
    max-width: 100%;
  }
  .c-about .c-text-container{
    width: 100%;
  }
}


/* SERVICE */
.c-service{
  padding-top: 7.3333rem;
  padding-bottom: 11.3333rem;
}
.c-service .c-visual_container{
  aspect-ratio: 512 / 482;
  max-width: 34.1333rem;
}
.c-service  .c-visual_container img.under {
  top: 0; right: 15.2343%;
  width: 69.1406%;
  z-index: 1;
}
.c-service  .c-visual_container img.over {
  bottom: 0; right: 0;
  width: 46.2686%;
  z-index: 2;
}
.c-service .c-text-container{
  width: calc(100% - 1.666rem);
}
@media (max-width: 767px) {
  .c-service .c-visual_container{
    max-width: 100%;
  }
  .c-service .c-text-container{
    width: 100%;
  }
}


/* WORKS */
.c-works{
  position: relative;
  padding-bottom:2rem;
}
/*
.c-works::before{
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 50%;
  background-color: var(--color-gray1);
  z-index: -2;
}
*/
.c-works .c-section-title{
  font-size: 1.2666rem;
}
.c-works .c-button-cat {
  display: block;
  padding: 0.5333rem;
  border: 1px solid var(--color-black2);
  font-size: 0.8666rem;
  background-color: var(--color-white);
  min-width: 7.1333rem;
  line-height: 1;
  text-align: center;
  font-weight: 500;
}
.c-works__thumb{
  margin-bottom: 1rem;
}
#load-more-btn{
  cursor: pointer;
  width: 3.4666rem;
  display: inline-block;
}
.c-works__text__inner{
  width:98%;
  margin-left:auto;
  margin-right:auto;
  background-color: var(--color-white);
  padding-left: 2.6666rem;
  padding-right: 2.6666rem;
  padding-top: 2.1875rem;
  padding-bottom: 2.1875rem;
}
@media (max-width: 767px) {
  .c-works__text__inner {
    width: 94%;
    margin-left: 0;
    margin-right: 0;
    background-color: var(--color-white);
    padding-left: 1.6666rem;
    padding-right: 1.6666rem;
    padding-top: 1.5875rem;
    padding-bottom: 1.5875rem;
  }
}

/* NEWS */
.c-news{
  padding-bottom: 1.6rem;
}
.c-news__item{
  padding-left:3rem;
  padding-right:3rem;
  border-bottom: 1px solid var(--color-gray2);
}
.c-news__date{
  font-size: 0.8666rem;
  font-weight: 500;
  width: 9rem;
  display: inline-block;
}
.c-news__title{
  font-size: 1rem;
  font-weight: 300;
  line-height: 1.5;
  width: calc(100% - 9rem);
  display: inline-block;
}
@media (max-width: 767px) {
  .c-news__item{
    padding-left:1.2rem;
    padding-right:1rem;
  }
  .c-news__date{
    width: 100%;
    margin-bottom: 0.4rem;
  }
  .c-news__title{
    width: 100%;
  }
}



/* ACCESS */
.c-access{
  position: relative;
  padding-top: 7.3333rem;
  padding-bottom: 5.8666rem;
}
/*
.c-access::before{
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 50%;
  background-color: var(--color-gray1);
  z-index: -2;
}
*/
.c-access .c-visual_container{
  aspect-ratio: 445 / 354;
  max-width: 29.6666rem;
}
.c-access .c-visual_container img.pic {
  top: 0; left: 0;
  width: 79.5505%;
  z-index: 1;
}
.c-access .c-text-container {
  width: calc(100% - 2px);
}
.c-title-en.access{
  top: 0; right: 0;
}
.c-access .tab-link_inner{
  font-weight: 500;
}
.c-access .tab-link:not(.active) .tab-link_inner{
  background: var(--color-gray3);
}
.c-access .tab-link:not(.active) .tab-link_inner:hover{
  background: var(--color-white);
}
@media (max-width: 767px) {
  .c-access .c-visual_container {
    max-width: 100%;
  }
}

/* CONTACT */
.c-contact{
  padding-top: 7.3333rem;
  /*background-color: var(--color-gray1);*/
}
.c-title-en.contact{
  top: 0; right: 0;
}
.c-contact .required{
  color: var(--color-blue);
  font-weight: 500;
}
.c-contact__form .info2-table{
	width:100%;
	position: relative;
}
.c-contact__form .info2-row:last-child{
	border-bottom: 0;
}
.c-contact__form .info2-cell.title{
  font-weight: 500;
	-ms-flex: 0 0 14.6666rem;
	flex: 0 0 14.6666rem;
	width: 14.6666rem;
	max-width: 14.6666rem;
	color: var(--color-base);
	vertical-align: middle;
	padding-top: 2.5rem!important;
}
.c-contact__form .info2-cell.detail{
/*	border-left: 2px solid #fff;*/
	-ms-flex: 0 0 calc(100% - 14.6666rem);
	flex: 0 0 calc(100% - 14.6666rem);
	width: calc(100% - 14.6666rem);
	max-width: calc(100% - 14.6666rem);
}
.c-contact__form .info2-cell.detail input{
	width:100%;
	height: 50px;
	box-sizing: border-box;
	border: none;
	padding-left: 1em;
	padding-right: 1em;
	-webkit-appearance: none;
}
.c-contact__form .info2-cell.detail.name input::placeholder {
  color: var(--color-gray2);
}
.c-contact__form .info2-cell.detail.name input:-ms-input-placeholder {
  color: var(--color-gray2);
}
.c-contact__form .info2-cell.detail.name input::-ms-input-placeholder {
  color: var(--color-gray2);
}
.c-contact__form .info2-cell.detail textarea{
	width:100%;
	box-sizing: border-box;
	border: none;
	padding:1em;
	-webkit-appearance: none;
}
.c-contact__form input[type="submit"] {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 400;
  background-color: var(--color-blue);
  color: #fff;
  border: none;
  padding: 15px 50px;
  cursor: pointer;
}
.c-contact__form .submit-btn input[type="submit"] {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 400;
	width:  100%;
  max-width: 14.5333em;
	display: inline-block;
	background-color:  var(--color-blue);
	color: #fff;
	line-height: 3.6em;
	text-align: center;
	appearance: none;
	-webkit-appearance: none;
	font-weight: 500;
	letter-spacing: 0.1em;
	border-width: initial;
	border-style: none;
	border-color: initial;
	border-image: initial;
	border-radius: 3em;
	padding: 0px;
}
.c-contact__form .wpcf7-spinner {
  display: none !important;
}
@media screen and (max-width: 767px){
	.c-contact__form .info2-cell.title{
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		width: 100%;
		max-width: 100%;
		font-weight: 600;
	}
	.c-contact__form .info2-cell.detail{
		border-left: 0;
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		width: 100%;
		max-width: 100%;	
	}
}


/***********************************************
   blog-single / c-archive
***********************************************/
.post-container aside{
  position: relative;
  z-index: 1;
  width:17.5rem;
}
.post-container aside .widget{
  width: 100%;
  display: block;
  position: relative;
}
.post-container aside .widget.category .widget__container{
  min-height: 8.1250rem;
}
.post-container aside .widget.archive .widget__container{
  min-height: 10.6250rem;
}
.post-container aside .widget__container{
  position: relative;
  background: var(--color-white);
  border-radius: 1.125rem;
}
.post-container aside .widget__inner{
  padding: 1.5rem;
  padding-right: 3rem;
}
.post-container aside .instagram .widget__inner{
  padding: 0;
}
.post-container aside .widget-title{
    font-family: "Noto Sans JP", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    font-weight: 300;
    font-size: 1rem;
    line-height: 3em;
    font-weight: normal;
    background-color: var(--color-blue);
    color: var(--color-white);
    width: 100%;
    text-align: center;
    margin: 0;
    color: #fff;
}
.post-container aside .widget-list{
  margin-top:0.7rem;
}

.post-container aside .instagram .widget__container{
  background: inherit;
}
.post-container aside .widget.category ul{
  font-size: 1rem;
}
.post-container aside .widget.archive ul{
  font-size: 1rem;
}
.post-container aside .widget ul{
  font-weight: 500;
}
.post-container aside .widget ul a{
  font-weight: 500;
  display: inline-block;
  width:100%;
}
.post-container aside .widget ul > li{
  border-bottom:1px solid var(--color-gray2);
  position: relative;
  padding-top:0.8em;
  padding-bottom:0.8em;
}
.post-container aside .widget.archive ul{
  padding-top:0.8em;
  max-height: 12.56em;
  overflow: hidden;
  transition: all 0.3s ease-out;
}
.post-container aside .widget.archive ul.open {
  max-height: 1000px;
  transition: all 0.6s ease-out;
}
button#toggle-archive{
  position: relative;
  appearance: none;
  -webkit-appearance: none;
  border: none;
  background: var(--color-gray);
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  font-weight: 500;
  letter-spacing: 0.06em;
  width:100%;
  max-width: 11.56rem;
  line-height: 1;
  padding-top:0.5em;
  padding-bottom:0.7em;
  border-radius: 2em;
}
button#toggle-archive::after {
  display: inline-block;
  position: absolute;
  content: "\f107";
  font-family: 'icomoon' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 1.25em;
  color: var(--color-base);
  top: 0.35em;
  right: 0.6em;
  height: 1.25em;
  width: 1.25em;
  z-index: 1;
}
button#toggle-archive.active::after{
  content: "\f106";
}

/* c-post-hero */
.c-post-hero{
  background-color: var(--color-blue);
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 400;
  color: var(--color-white);
}
.c-post-hero .title_en{
  font-size: 2rem;
  font-weight: 700;
  line-height: 1;
}
.c-post-hero .title_en img {
  width: auto;
  height: 1.9333rem;
  aspect-ratio: 164 / 44;
}
.c-post-hero .title {
  padding-right: 0.192em;
  letter-spacing: 0.15em;
}
.post-container .section__container{
  display: -ms-flexbox !important;
  display: flex !important;
  -ms-flex-wrap: wrap !important;
  flex-wrap: wrap !important;
  -ms-flex-direction: row !important;
  flex-direction: row !important;
  -ms-flex-pack: justify !important;
  justify-content: space-between !important;
}
.post-container main{
  position: relative;
  z-index: 1;
  width: calc(100% - (2.125rem + 17.5rem));
}
.post-container .site-main__inner{
  background: var(--color-white);
  border-radius: 1.125rem;
  min-height: 28rem;
  padding-bottom: 2rem;
}
.c-archive__meta .date{
  font-size: 0.8666rem;
  font-weight: 500;
  line-height: 1;
}
.post-single .entry-header .date {
  font-size: 0.8666rem;
  font-weight: 500;
  line-height: 1;
}
.post-single .entry-header .text-wrap{
  border-bottom:1px solid var(--color-base);
}
.post-single .entry{
  overflow: hidden;
  display: block;
  position: relative;
}
.post-single .entry-content{
  padding-top: 1.5rem;
  width: 100%;
  overflow: hidden;
}
.c-post__category-label{
  display: block;
  box-sizing: border-box;
  padding: 0.4333rem;
  border: 1px solid var(--color-black2);
  font-size: 0.8666rem;
  background-color: var(--color-white);
  min-width: 5.1333rem;
  line-height: 1;
  text-align: center;
  font-weight: 500;
}
.blog-single .entry-header .title {
  font-size: 1.25rem;
  font-weight: 500;
  line-height: 1.5;
  margin-top: 0.5em;
  margin-bottom:1em;
}
.c-archive__item__inner{
  padding-top:1.7333rem;
  padding-bottom:1.7333rem;
  border-bottom:1px solid var(--color-gray2);
}
.c-archive__item:first-child .c-archive__item__inner{
  background-image: none;
}
.c-archive__text{
  font-size: 1rem;
  font-weight: 500;
}
.c-archive__image img{
  aspect-ratio: 4 / 3;
  object-fit: cover;
}
.c-archive__item .title{
  font-size: 1.25rem;
  color: var(--color-font-pattern1);
  line-height: 1.5;
  margin-top:0.3rem;
  font-weight: 500;
}
.c-archive__text .title a{
  text-decoration-line: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2em;
  display: inline-block;
  width:100%;
}
.c-archive__text .archive__tax{
  font-size: 0.9375rem;
}
.c-archive__text .archive__tax > [class*="col-"]{
  margin-left: 0.8rem;
}
.c-archive__text .archive__tax > [class*="col-"]:first-child{
  margin-left: 0;
}
.c-archive__text .archive__tax a{
  padding-left: 0.55em;
  padding-right: 0.55em;
  padding-top:0.07em;
  padding-bottom:0.1em;
}
.c-archive__text .archive__tax a.news{
  background: var(--color-green13);
}
.c-archive__text .archive__tax a.diary{
  background: var(--color-yellow6);
}
@media screen and (min-width: 768px) and (max-width: 1100px){
  .post-archive .c-post-hero__text {
    top: 24.5%;
  }
}
@media screen and (max-width: 767px){
  .post-container .section__container{
    -ms-flex-direction: column !important;
    flex-direction: column !important;
    -ms-flex-pack: start !important;
    justify-content: flex-start !important;
  }
  .post-container main{
    width: 100%;
  }
  .post-container aside{
    width: 100%;
  } 
  .c-archive___wrap {
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .c-archive__list{
    padding-left: 8px;
    padding-right: 8px;
  }
  .blog-single .section__container{
    padding-left: 8px;
    padding-right: 8px;
  }
  button#toggle-archive{
    max-width: none;
    width: calc(100% + 1.5rem);
  }
}
@media screen and (max-width: 640px){
  .post-archive .c-post-hero__text {
    top: 24.5%;
  }
}
@media screen and (max-width: 540px){
  .post-archive .c-post-hero__text {
    top: 24.5%;
  }
}
@media screen and (max-width: 430px){
  .post-archive .c-post-hero__text {
    top: 2.5%;
  }
}

/***********************************************
   Pager ( Blog + Blog detail )
***********************************************/
.entry-pager{
	max-width: 800px;
	margin: 3.5rem auto 0;
	text-align: center;
}
.entry-pager .wp-pagenavi,
.entry-pager .pagenavi{
	font-weight: 500;
	font-size: 1.1875rem;
	display: flex;
	justify-content: center;
	align-items: center;
	line-height: 1;
}
.entry-pager .wp-pagenavi .current,
.entry-pager .wp-pagenavi .page {
  position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
  width: 1.5rem;
  margin-left: 0.3rem;
  margin-right: 0.3rem;
  -webkit-transition: none;
  -moz-transition: none;
  -o-transition: none;
  -ms-transition: none;
  transition: none;
}
.button__wrap{
  width:40%;
}
.link__wrap{
  width:20%;
}
.entry-pager .wp-pagenavi .page:hover,
.entry-pager .wp-pagenavi .current{
	font-size: 1.3750rem;
  font-weight: 500;
}
.entry-pager .wp-pagenavi .page:hover::after,
.entry-pager .wp-pagenavi .current::after{
  content: "";
  display: block;
  width:1em;
  height:1px;
  background-color: var(--color-white);
  position: absolute;
  bottom:-0.4em;
  left:calc(50% - 0.5em);
}
.entry-pager .pagenavi a.all{
  display: inline-block;
  position: relative;
  line-height: 1;
}
.entry-pager .pagenavi a.all::after{
  content: "";
  display: block;
  width:100%;
  height:1px;
  background-color: var(--color-base);
  position: absolute;
  bottom:-0.4em;
  left:0;
}
.entry-pager .pagenavi a.page-btn,
.entry-pager .wp-pagenavi a.first,
.entry-pager .wp-pagenavi a.last,
.entry-pager .wp-pagenavi a.previouspostslink,
.entry-pager .wp-pagenavi a.nextpostslink{
  background-color: var(--color-white);
  font-size: 0.9375rem;
  font-weight: 500;
  position: relative;
  display: -ms-flexbox !important;
  display: flex !important;
  -ms-flex-direction: row !important;
  flex-direction: row !important;
  justify-content: center !important;
  -ms-flex-align: center !important;
  align-items: center !important;
  width:6.5333em;
  height:3.2em;
  border-radius: 2em;
  margin-bottom: 4px;
  text-align: center;
  line-height: 1;
}
.entry-pager .pagenavi a.page-btn.prev,
.entry-pager .wp-pagenavi a.last,
.entry-pager .wp-pagenavi a.nextpostslink{
  margin-left: 0.8em;
}
.entry-pager .pagenavi a.page-btn.next,
.entry-pager .wp-pagenavi a.first,
.entry-pager .wp-pagenavi a.previouspostslink{
  margin-right: 0.8em;
}
.entry-pager .pagenavi a.page-btn.prev::before,
.entry-pager .pagenavi a.page-btn.next::after,
.entry-pager .wp-pagenavi a.first::after,
.entry-pager .wp-pagenavi a.last::before,
.entry-pager .wp-pagenavi a.previouspostslink::after,
.entry-pager .wp-pagenavi a.nextpostslink::before{
  content: "";
  position: absolute;
  display: inline-block;
  box-sizing: border-box;
  left:4px;
  top:4px;
  width:calc(100% - 8px);
  height:calc(100% - 8px);
  border: 1px solid var(--color-base);
  border-radius: 2rem;
  z-index: 0;
}
.entry-pager .pagenavi a.page-btn.prev::after,
.entry-pager .wp-pagenavi a.last::after,
.entry-pager .wp-pagenavi a.nextpostslink::after{
  content: "";
  display: inline-block;
  aspect-ratio: 8 / 10;
  width:auto;
  height:1em;
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: 100% auto;
	background-image: url("../img/common/icon_arrow_right.svg");
  margin-left: 0.3em;
}
.entry-pager .pagenavi a.page-btn.next::before,
.entry-pager .wp-pagenavi a.first::before,
.entry-pager .wp-pagenavi a.previouspostslink::before{
  content: "";
  display: inline-block;
  aspect-ratio: 8 / 10;
  width:auto;
  height:1em;
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: 100% auto;
	background-image: url("../img/common/icon_arrow_left.svg");
  margin-right: 0.3em;
}
@media screen and (max-width: 1024px) {
  .button__wrap{
    width:35%;
  }
  .link__wrap{
    width:30%;
  }
}
@media screen and (max-width: 700px) {
  .entry-pager .pagenavi a.page-btn.prev,
  .entry-pager .wp-pagenavi a.last,
  .entry-pager .wp-pagenavi a.nextpostslink{
    margin-left: 0.4em;
  }
  .entry-pager .pagenavi a.page-btn.next,
  .entry-pager .wp-pagenavi a.first,
  .entry-pager .wp-pagenavi a.previouspostslink{
    margin-right: 0.4em;
  }
}
@media screen and (max-width: 580px) {
  .button__wrap{
    width:30%;
  }
  .link__wrap{
    width:40%;
  }
}


/***********************************************
   Blog detail entry content
***********************************************/
.entry .entry-content p{
	margin-top: 1rem;
}
.entry .entry-content p+p{
	margin-top: 0rem;
}
.entry .entry-content .wp-block-image,
.entry .entry-content .wp-block-gallery{
	margin-top: 2rem;
	margin-bottom: 1.5rem;
}
.entry .entry-content .wp-block-image{
  max-width: 100%;
}
.entry .entry-content .wp-block-image {
  max-width: 100%;
}
.entry .entry-content a {
  transition: color 110ms ease-in-out;
}
.entry .entry-content a {
	text-decoration: underline;
}
.entry .entry-content a:hover,
.entry .entry-content a:active {
	outline: 0;
	text-decoration: none;
}
.entry .entry-content a:focus {
	outline: 0;
	text-decoration: underline;
}
.entry .entry-content .wp-block-file *+.wp-block-file__button {
  padding-left: 1em;
  padding-right: 1em;
  text-decoration: none;
}
.entry .entry-content .wp-block-file{
	margin-top: 1rem;
}
.entry .entry-content .wp-block-file__button {
  background: var(--color-base);
}
.wp-block-image figcaption {
  color: var(--color-base);
  font-size: 1rem;
  text-align: left;
}

