@charset "utf-8";
/* CSS Document */
*{box-sizing: border-box;}
html{font-size:16px;text-align: justify;}
body{background:#30383F;color:#ECECEC;line-height:1.7;letter-spacing:2px;font-family: 'Noto Sans JP', sans-serif;font-weight: 400;}
img{max-width:100%;vertical-align: bottom;}
.raleway{font-family: 'Raleway', sans-serif;font-weight:500;letter-spacing: 2px;}
.raleway700 {font-family: 'Raleway', sans-serif;font-weight:700;letter-spacing: 2px;}
.poppins{font-family: 'Poppins', sans-serif;}
.container{max-width:1440px;margin-left:auto;margin-right:auto;padding-left:60px;padding-right:60px;}
.border-x{border-right:1px solid #596065;border-left:1px solid #596065;}
.border-y{border-bottom:1px solid #596065;}
a{color:inherit;text-decoration: none;}

a.link-opacity{transition:opacity 0.2s ease-in-out;}
a.link-opacity:hover{opacity:0.7;}

.header-bg-area{background:url("../img/bg-mainvisual.png") no-repeat;background-size:100% 100%;background-position:left bottom;position:relative;}
.perticle{position:absolute;width:100%;height:100%;z-index:1;top:0;left:0;opacity:0.8;}
header{position: relative;z-index:3;}
.header-wrapper h1,.header-wrapper p.h1{height: 120px; display: flex;align-items: center;}
.header-wrapper{display: flex;align-items: center; justify-content: space-between;}
nav.header-main-nav{margin-left:auto;}
.header-main-nav > ul{display: flex;align-items: center;}
.header-main-nav > ul > li:not(:last-of-type){margin-right:60px;}
.header-main-nav > ul > li:last-of-type a{background:#558AF2;display: block;padding:10px;border-radius:3px;transition:filter 0.2s ease-in-out,background 0.2s ease-in-out;font-weight: 700;}
.header-main-nav > ul > li:last-of-type a:hover{filter:drop-shadow(2px 2px 2px #222222);background:#669CF2;}
a.nav-line-bottom{position:relative;}
a.nav-line-bottom:after{content:"";width:0%;height:1px;background:#B89108;position:absolute;bottom:-3px;left:0;transition:width 0.2s ease-in-out;}
a.nav-line-bottom:hover:after{width:100%;}
.mainvisual-wrapper{height:calc(100vh - 120px);display: flex;flex-direction: column;justify-content: center;position: relative;}
.mainvisual-sub-nav ul{display: flex;align-items: center;}
.mainvisual-sub-nav li:not(:last-of-type){margin-right:30px;}
.mainvisual-bottom{position: absolute;width:100%;bottom:0;left:0;padding-left:60px;padding-bottom:30px;font-size:12px;letter-spacing: 0;z-index: 2;}
.main-catch-main{margin-bottom:30px;}
.main-catch-sub{font-size:24px;font-weight:400;}
.scroll-arrow{width:85px;height:85px;background:url("../img/scroll-btn.svg") no-repeat;position:absolute;right:60px;bottom:90px;z-index: 2;}
.scroll-arrow:after{content:"";width:10px;height:80px;display: block;background:url("../img/scroll-arrow.svg") no-repeat;position:absolute;left:10px;right:0;bottom:-55px;margin:auto;animation: move-y 1s infinite alternate ease-in-out;}
.main-catch-wrapper{position:relative;z-index: 2;}
@keyframes move-y {
  from {
    transform: translateY(0);
  }
  to {
    transform: translateY(10px);
  }
}
.section-ttl{font-size:64px;color:#B89108;margin-bottom:30px;font-weight: bold;line-height: 1.2}
.section-sub-ttl{font-size:24px;margin-bottom:30px;font-weight:bold;}
.top-section-conteiner{padding-top:144px;padding-bottom:144px;}
.link-btn a{border:1px solid #596065;display: flex;border-radius:3px;padding:15px 60px;width:fit-content;transition:filter 0.2s ease-in-out,background 0.2s ease-in-out;display: flex;min-width: 320px;justify-content: center;}
.link-btn a:hover{filter:drop-shadow(2px 2px 2px #222222);background:#596065;}
.link-btn a:hover img{transform: translateX(5px);}
.link-btn img{margin-left:15px;transition:transform 0.2s ease-in-out;}
.aboutus-inner{max-width:650px;}
.section-lead{margin-bottom:60px;}

.top-aboutus{background:url("../img/bg-top-aboutus.png") no-repeat;background-position:center right;background-size:contain;}
.aboutus-wrapper{min-height:900px;display: flex;align-items: center;}

.service-box-wrapper{display: flex;}
.service-inner{max-width:960px;margin-left:auto;margin-right:auto;}
.service-box{width:calc(33% - 2px);position:relative;}
.service-box a{display: block;background:rgba(255,255,255,0.05);padding:30px 30px 90px;height:100%;transition:filter 0.2s ease-in-out,background 0.2s ease-in-out;}
.service-box a:hover{background:rgba(255,255,255,0.1);filter:drop-shadow(2px 2px 2px #222222);}
.service-box:not(:last-of-type){margin-right:2px;}
.service-box-img{text-align:center;margin-bottom:15px;}
.service-box-ttl-en{text-align:center;font-size:12px;}
.service-box-ttl-jp{text-align:center;font-size:16px;font-weight:bold;margin-bottom:15px;}
.service-box-text{font-size:14px;}
.service-box-arrow{position:absolute;width:fit-content;left:0;bottom:45px;right:0;margin:auto;transition: transform 0.2s ease-in-out;}
.service-box a:hover .service-box-arrow{transform:translateX(10px);}
.top-news-date{line-height: 1;padding-right:60px;margin-right:60px;border-right:1px solid #596065;}
.top-news-date .news-y{font-size:24px;display:block;text-align: right;}
.top-news-date .news-md{font-size:64px;display:block;color:#B89108;}
.top-news-box{display:flex;align-items:center;}
.top-news-box:not(:last-of-type){margin-bottom:60px;}
.top-news-box a{text-decoration: underline;}
.news-box-wrapper{max-width:750px;margin:auto;}
.link-wrapper{padding:0;display:flex;max-width:900px;}
.top-link-btn{width:50%;}
.top-link-btn:not(:last-of-type){border-right:1px solid #596065;}
.top-link-btn a{height:150px;display:flex;align-items:center;justify-content: center;font-size:32px;transition:background 0.2s ease-in-out;}
.top-link-btn a:hover{background:#596065;}
.top-link-btn a span{transition:transform 0.2s ease-in-out,filter 0.2s ease-in-out;}
.top-link-btn a:hover span{transform: scale(1.05);/*filter:drop-shadow(2px 2px 2px #333);*/}
.footer-nav-aera{display:flex;justify-content: space-between;}
.footer-wrapper{max-width:750px;margin:auto;padding:144px 0;letter-spacing: 0;}
.footer-company-area{margin-bottom:60px;}
.accordion-nav-child{font-weight:400;font-size:14px;}
.footer-nav-box h3{font-size:14px;}
.accordion-nav > a:after,.accordion-nav > h3 > a:after{content:url("../img/accordion-arrow.svg");margin-left:5px;}
.accordion-nav h3{display:flex;align-items:center;}
.accordion-nav{position:relative;}
.accordion-nav-child{position:absolute;z-index: 2; opacity:0;top:2.3em;left:0;transform: translateY(0); transition:all 0.2s ease-in-out;white-space: nowrap;}
.accordion-nav-child li{transform:translateY(-1em);transition:all 0.3s ease;}
.accordion-nav-child li:not(:last-of-type){margin-bottom:32px;margin-top: 24px;}
.accordion-nav-child.active{opacity:1;}
.accordion-nav-child.active li{transform:translateY(0);}
.footer-bottom{display:flex;justify-content:flex-end;font-weight:400;font-size:14px;padding-top: 1rem;}
.footer-bottom p:not(:last-of-type){margin-right:60px;}
.footer-nav-aera {margin-bottom:90px;}
.menu-trigger{display: none;}

@media screen and (max-width: 768px) {
	header{padding-top:70px;}
	.scroll-arrow{display: none;}
	.header-wrapper{position:fixed;top:0;left:0;width:100%;z-index:9;transition:background 0.2s ease-in-out;}
	.header-wrapper.sticky{background:rgba(0,0,0,0.5);}
    .container{max-width:100%;}
    .top-aboutus{background: url(../img/bg-top-aboutus.png) no-repeat;background-position: center right;background-size:contain;background-color:rgba(48,56,63,0.8);background-blend-mode:darken;}
	.header-wrapper h1,.header-wrapper p.h1{height: 70px;}
	.header-main-nav{position:fixed;width:50%;height:100vh;top:0;right:0;background:#596065;display: none;z-index: 9;opacity:0;transform:translateX(150px);}
	.header-main-nav.active{display:block;opacity:1;transform:translateX(0);transition:transform 0.2s ease-in-out;}
	.header-main-nav > ul{flex-direction:column;height:100%;align-items:flex-start;}
	.accordion-nav-child{position:static;display: block;}
	.accordion-nav-child{opacity:1;}
	.accordion-nav-child li{transform:translateY(0);}
	.accordion-nav-child.active{display: block;}
	.header-main-nav > ul > li{padding:30px;width:100%;}
	.accordion-nav-child li:not(:last-of-type){margin-bottom:15px;}
	.accordion-nav > a{display: block;margin-bottom:15px;}
	.nav-overlay{width: 100vw;height:100vh;z-index:2;position:fixed;left:0;top:0;background:rgba(0,0,0,0.7);display: none;}
	.nav-overlay.active{display:block;}
	.header-main-nav > ul > li:not(:last-of-type){border-bottom:1px solid #737b81;}
	.header-main-nav > ul > li:last-of-type a{text-align:center;}
	.mainvisual-wrapper{height: calc(100vh - 70px);}
	.menu-trigger,
	.menu-trigger span {
		display: inline-block;
		transition: all .4s;
		box-sizing: border-box;
		z-index:99;
	}
	.menu-trigger {
	  position: relative;
	  display:block;
	  width: 36px;
	  height: 26px;
	  background: none;
	  border: none;
	  appearance: none;
	  cursor: pointer;
	  margin-right: -30px;
	}
	.menu-trigger span {
	  position: absolute;
	  left: 0;
	  width: 100%;
	  height: 4px;
	  background-color: #ECECEC;
	  border-radius: 4px;
	}
	.menu-trigger span:nth-of-type(1) {
	  top: 0;
	}
	.menu-trigger span:nth-of-type(2) {
	  top: 11px;
	}
	.menu-trigger span:nth-of-type(3) {
	  bottom: 0;
	}
	.menu-trigger.active span:nth-of-type(1) {
	  transform: translateY(11px) rotate(-45deg);
	}
	.menu-trigger.active span:nth-of-type(2) {
	  opacity: 0;
	}
	.menu-trigger.active span:nth-of-type(3) {
	  transform: translateY(-11px) rotate(45deg);
	}
	.main-catch-sub br{display: none;}
	.footer-wrapper{padding:60px 30px;}
}

@media screen and (max-width: 600px) {
	html{font-size:12px;}
	.container{padding-left:32px;padding-right:32px;}
	.main-catch-sub{font-size:16px;}
	.section-ttl{font-size:32px;}
	.section-sub-ttl{font-size:16px;}
    .mainvisual-bottom{padding-left:15px;display: flex;
    justify-content: center;
    padding: 2rem;}
	.link-btn a{width:100%;text-align:center;justify-content: center;}
	.service-box:not(:last-of-type){margin-right:0;margin-bottom:2px;}
	.service-box{width:100%;}
	.service-box-wrapper{flex-direction:column;}
	.service-box a{padding:15px 15px 90px;}
	.link-wrapper{flex-direction:column;padding-left:0;padding-right:0;}
	.top-link-btn{width:100%;}
	.top-link-btn:not(:last-of-type){border-right:none;border-bottom: 1px solid #596065;}
	.top-link-btn a{height:100px;}
	.top-news-box{flex-direction:column;align-items: flex-start}
	.top-news-date{border-right:none;border-bottom: 1px solid #596065;padding-right:0;padding-bottom:15px;margin-bottom:15px;}
	.top-news-date .news-md{font-size:32px;}
	.top-news-date .news-y{font-size:16px;}
	.top-news-date .news-y{text-align:left;}
	.top-news-box:not(:last-of-type){border-bottom: 1px solid #596065;padding-bottom:30px;margin-bottom:30px;}
	.aboutus-wrapper{min-height:auto;}
	.menu-trigger{margin-right:0;}
	.header-main-nav{width:70%;}
	.footer-bottom{justify-content:center;flex-direction: column;padding-left: 15px;}
	.footer-nav-aera{flex-direction:column;}
	.news-wrapper{padding-top:45px;padding-bottom:45px;}
	.footer-nav-box h3{padding:15px;/*text-align:center;justify-content: center;*/}
	.footer-nav-box:not(:last-of-type) h3{border-bottom:1px solid #596065;}
	.footer-nav-box.accordion-nav h3{border-bottom:none;}
	.footer-company-area{margin-bottom:30px;}
	footer .accordion-nav-child li{padding-left:30px;}
	footer .accordion-nav-child li:last-of-type{border-bottom: 1px solid #596065;padding-bottom:15px;}
	.footer-nav-aera{margin-bottom:30px;}
	.service-box-text{font-size:12px;}
	.header-main-nav > ul > li{font-size:16px;}
    #contactlink .border-x{border-left:none;border-right:none;}
}