@charset "UTF-8";


html,p{ font-family: 'Noto Sans JP', sans-serif; color:#000; }


/* FONT */
html,p{ font-size:12.5px; letter-spacing:.1rem; line-height:2; }
#g-nav .nav-list a{ font-size:1.6rem; letter-spacing:.1em; line-height:1.2; font-weight:400; }
.font-xxl{ font-size:2.7rem; letter-spacing:.4rem; line-height:1.2; }
.font-xl{ font-size:2.1rem; }
.font-l{ font-size:1.8rem; letter-spacing:.1rem; line-height:1.2; }
.font-ml{ font-size:1.6rem; letter-spacing:.1rem; line-height:1.4; }
.font-m{ font-size:1.3rem; letter-spacing:.1rem; line-height:1.4; }
.font-sm{ font-size:1.2rem; letter-spacing:.1rem; line-height:1.2; }
.font-s{ font-size:1rem; letter-spacing:.1rem; }
.font-ss{ font-size:.8rem; letter-spacing:.1rem; line-height:1.5; }
.font-sss{ font-size:.7rem; letter-spacing:.1rem; line-height:1.5; }
.font-title{ font-size:2.2rem; letter-spacing:.3rem; line-height:2; }
.font-w400{ font-weight:400; }
.font-w600{ font-weight:600; }
.font-w800{ font-weight:800; }
.font-ls-m{ letter-spacing:.15rem; }
.font-ls-l{ letter-spacing:.3rem; }
.font-lh-l{ line-height:2.4; }
.font-center{ text-align:center; }
.font_btn_arrow{ font-size:1rem; }

.navi-menu{ letter-spacing:.2rem; }
.footer-font{ color:#fff; text-align:center; font-size:.7rem; transition: all 0.3s 0s ease; }
.footer-font.active{ color:#000; }


@media screen and (min-width:375px) {
html,p{ font-size:14px; letter-spacing:.1rem; line-height:1.7; }
}

@media screen and (min-width:768px) {
html,p{ font-size:14px; letter-spacing:.1rem; line-height:1.7; }
}

@media screen and (min-width:1280px) {
html,p{ font-size:16px; letter-spacing:.15rem; }
}





/* SPACE */
.mt-ssss{ margin-top:3px; }
.mt-sss{ margin-top:5px; }
.mt-ss{ margin-top:10px; }
.mt-s{ margin-top:15px; }
.mt-m{ margin-top:30px; }
.mt-l{ margin-top:45px; }
.mt-xl{ margin-top:60px; }
.mt-xxl{ margin-top:90px; }
.ml-s{ margin-left:15px; }
.ml-m{ margin-left:30px; }
.pt-l{ padding-top:45px; }
.pt-xl{ padding-top:60px; }
.pb-m{ padding-bottom:30px; }
.pb-l{ padding-bottom:45px; }
.pb-xl{ padding-bottom:60px; }
.pb-xxl{ padding-bottom:90px; }

@media screen and (min-width:768px) {
.mt-s{ margin-top:30px; }
.mt-m{ margin-top:45px; }
.mt-l{ margin-top:60px; }
.mt-xl{ margin-top:90px; }
.mt-xxl{ margin-top:120px; }
.pb-m{ padding-bottom:30px; }
.pb-l{ padding-bottom:60px; }
.pb-xl{ padding-bottom:90px; }
.pb-xxl{ padding-bottom:120px; }
}





/* COMMON */
.pc{ display:none; }
.opacity{ opacity:0; }
.center{ text-align:center; }
.va-middle{ vertical-align:middle; }
.white{ color:#fff; }
.blue{ color:#104F85; }
.flex-center{ justify-content:center; align-items:center; }
.btn__blue{ display:inline-block; padding:12px 9vw; width:60%; max-width:100%; color:#fff; background-color:#104F85; text-align:center; transition:all 0.3s 0s ease; cursor:pointer; }

@media screen and (min-width:768px) {
	.pc{ display:inline; }
	.sp{ display:none; }
	.opacity{ opacity:100; }
	.btn__blue{ margin-left:30%; margin-right:30%; padding:15px 0; width:24%; transition:all 0.3s 0s ease; }
	.btn__blue:hover{ background-color:#063155; }
}





/* Loading　*/
#splash { position:fixed; z-index:999; width:100%; height:100%; background:#104F85; text-align:center; color:#fff; }
#splash_text { position:absolute; top:50%; left:50%; z-index:999; width:100%; transform:translate(-50%, -50%); color:#fff; }
#splash_text svg{ height:1px; }





/* HEADER */
header{ position:relative; }
.header{ position:fixed; top:0; left:0; width:100%; height:92px; background:url("../img/common/header_bg.svg"); mix-blend-mode:multiply; z-index:10; }
.header__container{ position:fixed; top:0; left:0; padding:15px; z-index:10; }
.logo{ width:167px; }

@media screen and (min-width:768px) {
	.header{ position:fixed; top:0; left:0; width:100%; height:120px; background:url("../img/common/header_bg_pc.svg"); mix-blend-mode:multiply; z-index:10; }
	.header__container{ display:flex; position:fixed; top:0; left:0; width:100%; padding:30px 30px 0 30px; z-index:10; }
	.logo,.logo img{ width:167px; }	
}
@media screen and (min-width:1280px) {
	.header__container{ display:flex; position:fixed; top:0; left:0; width:100%; padding:30px 120px 0 120px; z-index:10; }
	.logo,.logo img{ width:300px; }	
}





/* FOOTER */
footer{ position:relative; }
.footer{ position:fixed; bottom:0; left:0; width:100%; height:92px; background:url("../img/common/footer_bg.svg"); mix-blend-mode:multiply; }
.footer__top .footer-font{ display:inline-block; position:absolute; bottom:10px; left:50%; width:100%; transform:translate(-50%,0); z-index:9; }
.footer__lower{ display:table; width:100%; height:60px; background-color:#063155; }
.footer__lower .footer-font{ height:60px; display:table-cell; vertical-align:middle; }

@media screen and (min-width:768px) {
	.footer{ height:120px; background:url("../img/common/footer_bg_pc.svg"); }
	.footer__top .footer-font{ bottom:30px }
	.footer__lower{ height:90px; }
}





/* NAVIGATION */
.openbtn1{ position:fixed; top:30px; right:15px; cursor:pointer; width:21px; height:14px; border-radius:5px; z-index:11; }
.openbtn1 span{ display:inline-block; transition:all .6s; position:absolute; left:0px; height:1.5px; border-radius:2px; background:#fff; width:100%; }
.openbtn1 span:nth-of-type(1) { top:0px; }
.openbtn1 span:nth-of-type(2) { top:7px; }
.openbtn1 span:nth-of-type(3) { top:14px; }
.openbtn1.active span:nth-of-type(1) { text-outline:0px; transform:translateY(6px) rotate(-45deg); width:100%; background:#000; }
.openbtn1.active span:nth-of-type(2) { opacity:0; }
.openbtn1.active span:nth-of-type(3){ top:12px; transform:translateY(-6px) rotate(45deg); width:100%; background:#000; }

.navi{ position:fixed; top:0; left:0; width:100%; height:100%; padding:15px; z-index:10; background-color:#ffffff; animation-duration:.5s; animation-timing-function:ease-in-out; animation-fill-mode:forwards; }
.navi.active{ animation-name:NaviActive; }
@keyframes NaviActive{ 0% { left:-100%; } 100%{ left:0; } }
.navi.close{ animation-name:NaviClose; }
@keyframes NaviClose{ 0% { left:0; } 100%{ left:-100%; } }

.navi-menu{ width:100%; margin-top:20vw; }
.navi-menu li{ text-align:center; display:flex; justify-content:center; align-items:center; }
.navi-menu-list{ height:80px; margin:0 15px; border-bottom:1px solid #BFBFBF; }
.navi-menu li a{ width:100%; }
.navi-menu-button{ width:60%; height:54px; margin:0 auto; margin-top:60px; background-color:#104F85; color:#fff; border-radius:27px; }

@media screen and (min-width:768px) {
	.navi{ display:flex; position:initial; top:initial; left:initial; width:100%; height:100%; padding:15px; z-index:10; background-color:initial; animation-duration:.5s; animation-timing-function:ease-in-out; animation-fill-mode:forwards; }
	.close{ left:50%; }
	.navi-menu{ width:100%; margin-top:0; display:flex;  justify-content:flex-end; }
	.navi-menu li{ margin-left:30px; display:initial; color:#fff; border-bottom:initial;  justify-content:initial; align-items:initial; }
	.navi-menu-list{ height:initial; margin:0; border-bottom:initial; }
	.navi-menu-button{ width:initial; height:initial; margin:0; margin-top:0px; background-color:initial; color:#fff; border-radius:initial; }
	.navi-menu li a{ position:relative; }
	.navi-menu li.current a,.navi-menu li a:hover{ color:#fff; }
	.navi-menu li a::after { content:''; position:absolute; top:1.8rem; left:1%; width:95%; height:1.5px; background:#fff; transition:all .3s; transform:scale(0, 1); transform-origin:center top; }
	.navi-menu li.current a::after,
	.navi-menu li a:hover::after { transform:scale(1, 1); }
}
@media screen and (min-width:1280px) {
	.navi-menu li{ margin-left:60px; }
}





/* MAIN */
.contaner{ padding:0 15px; }
.contaner img{ width:100%; }
@media screen and (min-width:768px) {
	.contaner{ padding:0 15%; }
}


.slider{ z-index:0; overflow:hidden;/**/ }
.slider img{ width:100vw; height:100vh; background-repeat:no-repeat; background-size:cover; background-position:center center; }
@keyframes zoomUp { 0% { transform: scale(1.09); } 100% { transform: scale(1); } }
.add-animation { animation: zoomUp 10s linear 0s normal both; }
.slider__img01{ background:url("../img/top/sp/main1.jpg"); }
.slider__img02{ background:url("../img/top/sp/main2.jpg"); }
.slider__img03{ background:url("../img/top/sp/main3.jpg"); }
.slider__img04{ background:url("../img/top/sp/main4.jpg"); }
.slider__img{ width:100vw; height:100vh; background-attachment:fixed; background-repeat:no-repeat; background-size:cover; background-position:center center; }
@media screen and (min-width:768px) {
	.slider__img01{ background:url("../img/top/pc/main1.jpg"); }
	.slider__img02{ background:url("../img/top/pc/main2.jpg"); }
	.slider__img03{ background:url("../img/top/pc/main3.jpg"); }
	.slider__img04{ background:url("../img/top/pc/main4.jpg"); }
	.slider__img{ width:100vw; height:100vh; background-attachment:fixed; background-repeat:no-repeat; background-size:cover; background-position:center center; }
}


.pageheader{ }
.pageheader img{ width:100vw; }
.pageheader .pagetitle{ position:absolute; top:24vw; left:30px; }
.pagetitle-en{ font-size:2.7rem; font-family:'Gill Sans'; }
.pagetitle-jp{ margin-top:-18px; }
.pageheader__img__vision{ background:url("../img/vision/sp/header.jpg"); }
.pageheader__img__business{ background:url("../img/business/sp/header.jpg"); }
.pageheader__img__company{ background:url("../img/company/sp/header.jpg"); }
.pageheader__img__contact{ background:url("../img/contact/sp/header.jpg"); }
.pageheader__img{ width:100%; height:50vw; background-size:cover; background-repeat:no-repeat; background-position:center center; }


@media screen and (min-width:768px) {
	.pageheader img{ width:100%; }
	.pageheader .pagetitle{ position:absolute; top:10vw; left:60px; }
	.pagetitle-en{ font-size:3.3rem; font-weight:500; }
	.pageheader__img__vision{ background:url("../img/vision/pc/header.jpg"); }
	.pageheader__img__business{ background:url("../img/business/pc/header.jpg"); }
	.pageheader__img__company{ background:url("../img/company/pc/header.jpg"); }
	.pageheader__img__contact{ background:url("../img/contact/pc/header.jpg"); }
	.pageheader__img{ width:100%; height:24vw; background-size:cover; background-repeat:no-repeat; background-position:center center; }
}
@media screen and (min-width:1280px) {
	.pageheader .pagetitle{ top:10vw; left:120px; }

}




.vision-main{ width:100%; height:90vw; display:table; text-align:center; background:url("../img/vision/sp/bg.svg"); background-repeat:no-repeat; background-size:cover; background-position:center center; }
.vision-main div{ height:90vw; display:table-cell; vertical-align:middle; }
.vision-main .copy{ line-height:2.4; }

@media screen and (min-width:768px) {
	.vision-main{ height:600px; background:url("../img/vision/pc/bg.svg"); background-repeat:no-repeat; background-size:cover; background-position:center center; }
	.vision-main div{ height:600px; }
	.vision-title{ font-size:3rem; }
	.vision-main .copy{ font-size:1.5rem; margin-top:60px; }
}



.business-main-box{ position:relative; }
.business-main-box-img-img01{ background:url("../img/business/sp/img1.jpg"); }
.business-main-box-img-img02{ background:url("../img/business/sp/img2.jpg"); }
.business-main-box-img-img03{ background:url("../img/business/sp/img3.jpg"); }
.business-main-box-img,.business-main-box-img__right{ position:absolute; top:2.7rem; left:0; width:100%; height:45vw; background-repeat:no-repeat; background-size:cover; background-position:center center; }
.business-main-box-img img,.business-main-box-img__right img{ width:100%; }
.business-main-box-h2,.business-main-box-h2__right{ text-align:center; }
.business-main-box-copy,.business-main-box-copy__right{ text-align:center; margin-top:48vw; }

@media screen and (min-width:768px) {
	.business-main-box{ height:23vw; }
	.business-main-box-img-img01{ background:url("../img/business/pc/img1.jpg"); }
	.business-main-box-img-img02{ background:url("../img/business/pc/img2.jpg"); }
	.business-main-box-img-img03{ background:url("../img/business/pc/img3.jpg"); }
	.business-main-box-img,.business-main-box-img__right{ position:absolute; top:0; left:0; width:35%; height:24vw; background-repeat:no-repeat; background-size:cover; background-position:center center; }
	.business-main-box-img img{ width:100%; }
	.business-main-box-container{ height:23vw; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; }
	.business-main-box-h2{ text-align:left; margin-left:37%; } .business-main-box-h2 h2{ text-align:left; }
	.business-main-box-copy{ text-align:left; margin-top:10px; margin-left:37%; }
	.business-main-box-img__right{ position:absolute; top:0; left:initial; right:0; width:35%; }
	.business-main-box-img__right img{ width:100%; }
	.business-main-box-container__right{ height:23vw; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; }
	.business-main-box-h2__right{ text-align:right; margin-right:38%; width:62%; } .business-main-box-h2 h2{ text-align:left; }
	.business-main-box-copy__right{ text-align:right;  margin-top:10px; margin-right:37%; width:63%; }	
}
@media screen and (min-width:1280px) {
	.business-main-box-img,.business-main-box-img__right{ position:absolute; top:0; left:0; width:30%; height:20.5vw; background-repeat:no-repeat; background-size:cover; background-position:center center; }
	.business-main-box-h2{ margin-left:32%; }
	.business-main-box-copy{ margin-left:32%; }
	.business-main-box-img__right{ position:absolute; top:0; left:initial; right:0; width:30%; }
	.business-main-box-container,.business-main-box-container__right{ height:20.5vw; }
	.business-main-box-h2__right{ margin-right:32%; width:68%; }
	.business-main-box-copy__right{ margin-right:31%; width:69%; }
}


.company-main{ }
.company-main table{ width:100%; }
.company-main tr,.company-main th,.company-main td{ width:100%; display:block; }
.company-main tr{ border-bottom:1px solid #BFBFBF; }
.company-main tr:last-child{ border-bottom:initial; }
.company-main th{ margin:15px 15px 0 15px; font-weight:500; }
.company-main td{ margin:6px 15px 15px 15px; }
@media screen and (min-width:768px) {
	.company-main tr{ display:flex; }
	.company-main th{ width:15%; }
	.company-main td{ width:85%; }
	.company-main th{ margin:30px; }
	.company-main td{ margin:30px; }
}



.contact-main{ }
.contact-main .table{ width:100%; }
.contact-main .tr,.contact-main .th,.contact-main .td{ width:100%; display:block; }
.contact-main .th{ margin-left:3px; font-weight:500; }
.contact-main .tr{ margin-top:30px; }
.contact-main .tr:first-child{ margin-top:0; }
.contact-main input{ width:100%; margin-top:6px; padding:24px 0 24px 15px; background-color:#F0F0F0; }
.contact-main span.post,.contact-main .td{ display:flex; }
.contact-main span.post{ margin:33px 6px 27px 0; }
.contact-main textarea{ width:100%; height:200px; margin-top:6px; padding:24px 0 24px 15px; background-color:#F0F0F0; }
::placeholder{ color:#989898; }
.contact-main span.required{ font-size:.8rem; background-color:#104F85; color:#fff; padding:2px 10px 3px 10px; display:inline; margin-left:6px; }
/*validation*/
.input-invalid { border:1.5px solid #f50000; }
.form-invalid { color:#f50000; font-size:12px; padding-left:12px; padding-top:3px; }
.input-valid { border:1.5px solid #104F85; color:#000000!important; }

@media screen and (min-width:768px) {
	.contact-main .tr{ margin-top:45px; display:flex; align-items:center; }
	.contact-main .th{ width:25%; }
	.contact-main .td{ width:75%; }
	.contact-main input,.contact-main textarea{ padding:30px 0 30px 20px; outline:none; }
	.tr-textarea{ align-items:flex-start!important; } .tr-textarea th{ margin-top:36px; }
	.contact-main span.required{ display:block; font-size:.7rem; margin-top:5px; margin-left:0; width:33%; text-align:center; }
	.err{ padding-left:25%; }
}
@media screen and (min-width:1024px) {
	.contact-main span.required{ width:24%; }
}



.button__contact{ position:relative; width:100%; padding:.2rem 30px 1.2rem 30px; background-color:#104F85; }
.button__contact h2{ margin-top:0px; font-size:2.7rem; font-family:'Gill Sans'; }
.button__contact div{ margin-top:-15px; margin-left:3px; }
.button__contact-arrow{ position:absolute; top:50%; right:30px; transform:translate(0,-20%); border-radius:50%; border:solid 1.5px #fff; }
.button__contact-arrow svg{ padding:30%; width:45px; height:45px; }

@media screen and (min-width:768px) {
	.button__contact{ padding:2rem 60px 5rem 60px; transition: all 0.6s 0s ease; }
	.button__contact h2{ font-size:3rem; }
	.button__contact-copy{ position:relative; top:30px; }
	.button__contact-arrow{ top:50%; right:60px; border:solid 2px #fff; transition:all 0.3s 0s ease; }
	.button__contact:hover{ background-color:#0B406D; }
	.button__contact:hover .button__contact-arrow{ background-color:#fff; transform:translate(15%,-20%); }
	.button__contact-arrow svg{ padding:30%; width:72px; height:72px; }
	.button__contact:hover .button__contact-arrow #arrow_svg1,.button__contact:hover .button__contact-arrow #arrow_svg2{ stroke:#0B406D; }
}
@media screen and (min-width:1280px) {
	.button__contact{ padding:2rem 15% 5rem 15%; }
	.button__contact-arrow{ top:50%; right:15%; }
	.button__contact-arrow img{ width:84px; height:84px; }
}