@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@800;900&family=Zen+Kaku+Gothic+New:wght@500&display=swap');


/* reset */
/* -------------------------------------------------------- */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {margin:0; padding:0;}
html {width:100%; height:100%; overflow-y:scroll;}
h1,h2,h3,h4,h5,h6 {font-size:100%; font-weight:bold;}
p, ul, ol, dl, address, blockquote, table, div {font-size:100%;}
p {margin:0 0 0 0;}
ol,ul {list-style:none;}
fieldset,img {border:0; vertical-align:top;}
table {border-collapse:collapse; border-spacing:0;}
caption,th {text-align:left;}
th {vertical-align:top; font-weight:normal; text-align:left;}
td {vertical-align:top;}
address,caption,cite,code,dfn,em,strong,th,var {font-style:normal; font-weight:normal;}
q:before,q:after {content:'';}
abbr,acronym {border:0;}

font-family: Zen Kaku Gothic New;
font-size: 40px;
font-weight: 500;
line-height: 56px;
letter-spacing: 0.16em;
text-align: center;

/* common */
/* -------------------------------------------------------- */
html,body {font-variant-ligatures:none;}
html {font-size:62.5%;}
body {font-size:14px; font-size:1.4rem; font-weight:500; font-family:"Zen Kaku Gothic New", sans-serif; color:#1c1c1c; text-align:center; -webkit-text-size-adjust:100%; text-size-adjust:100%; background:none;}

h1, h2, h3, h4, h5, h6, h7 {line-height:1.2;}
p, li, dt, dd, th, td, address, blockquote, div {line-height:1.6;}
input, select, option, textarea, button {font-size:15px; font-size:1.5rem; font-weight:500; font-family:"Zen Kaku Gothic New", sans-serif; line-height:1.4; vertical-align:middle; color:inherit; outline:none;}
input[type='submit'],input[type='reset'],input[type='button'], button {color:inherit; cursor:pointer; -ms-appearance:none; -webkit-appearance:none; appearance:none;}
:placeholder-shown {color:#bcbcbc;}
::-webkit-input-placeholder {color:#bcbcbc;}
:-moz-placeholder {color:#bcbcbc; opacity:1;}
::-moz-placeholder {color:#bcbcbc; opacity:1;}
:-ms-input-placeholder {color:#bcbcbc;}

strong {font-weight:bold;}
ol {list-style-type:decimal; margin-left:2.2em;}
img {max-width:100%; width:auto; height:auto; line-height:0; vertical-align:top; border:0; display:inline;}

a {color:#1c1c1c; text-decoration:underline;}
a:hover {color:#1c1c1c; text-decoration:none;}

.en {font-family:"Lato", sans-serif;}


/* decision */
/* -------------------------------------------------------- */
#bpCheck {display:none;}

body .pc {display:block;}
br.pc, span.pc, img.pc {display:inline;}
body .sp, br.sp, span.sp, img.sp {display:none;}

a.off {pointer-events:none; cursor:default; opacity:0.3;}
a.tel {pointer-events:none; cursor:default;}
a * {pointer-events:none;}
body.mobile a.tel {pointer-events:auto; cursor:pointer;}

.cfix::before,
.cfix::after {display:table; content:" ";}
.cfix::after {clear:both;}

@media screen and (max-width:767px){
	#bpCheck {display:block;}

	body .pc, br.pc, span.pc, img.pc {display:none;}
	body .sp {display:block;}
	br.sp, span.sp, img.sp {display:inline;}
}


/* container */
/* -------------------------------------------------------- */
#container {width:100%; overflow:hidden;}


/* header */
/* -------------------------------------------------------- */
#header {width:100%; height:200px; background-color:rgba(255,255,255,0); display:flex; align-items:center; position:fixed; top:-200px; left:0; z-index:300; transition:height 0.3s ease, background-color 0.3s ease, top 0.6s 1.6s ease;}
#header > div {width:100%; padding:0 80px; box-sizing:border-box; display:flex; justify-content:space-between; align-items:center; transition:padding 0.3s ease;}
#header .logo {width:73px; transition:width 0.3s ease;}
#header .logo a {display:block;}
#header .mail {display:none;}
#header .mail a {width:56px; height:56px; background-color:rgba(28,28,28,1); border-radius:100%; box-sizing:border-box; display:block; position:fixed; top:44px; right:84px; transition:width 0.3s ease, height 0.3s ease, top 0.3s ease, right 0.3s ease;}
#header .mail svg {width:42%; height:42%; fill:#fff; display:block; position:absolute; top:29%; left:29%;}
body.move #header {height:80px; background-color:rgba(255,255,255,1);}
body.move #header > div {padding:0 26px;}
body.move #header .logo {width:58px;}
body.move #header .mail a {width:44px; height:44px; top:14px; right:72px;}
body.load #header {top:0;}

#gNavBtn {width:56px; height:56px; border:1px solid #1C1C1C; border-radius:100%; box-sizing:border-box; position:fixed; top:44px; right:23px; z-index:310; cursor:pointer; display:none; transition:width 0.3s ease, height 0.3s ease, top 0.3s ease;}
#gNavBtn > span {width:38%; height:2px; margin:-1px 0 0 0; background-color:rgba(28,28,28,1); display:block; position:absolute; top:50%; left:31%; transition-property:background-color;}
#gNavBtn > span::before,
#gNavBtn > span::after {content:''; width:100%; height:2px; background-color:rgba(28,28,28,1); display:block; position:absolute; left:0;}
#gNavBtn > span::before {top:-7px; transition-property:top;}
#gNavBtn > span::after {bottom:-7px; transition-property:bottom;}
body.move #gNavBtn {width:44px; height:44px; top:14px;}
body.move #gNavBtn > span::before {top:-6px;}
body.move #gNavBtn > span::after {bottom:-6px;}
body.load #gNavBtn,
body.load #gNavBtn > span::before,
body.load #gNavBtn > span::after {transition-duration:0.3s; transition-delay:0s; transition-timing-function:ease;}

#gNavCheck {display:none;}
#gNavCheck:checked + #header #gNavBtn > span {background-color:rgba(28,28,28,0);}
#gNavCheck:checked + #header #gNavBtn > span::before {top:0; transform:rotate(45deg); transition-property:transform;}
#gNavCheck:checked + #header #gNavBtn > span::after {bottom:0; transform:rotate(-45deg); transition-property:transform;}

#gNav ul {display:flex; flex-wrap:wrap; align-items:center;}
#gNav ul > li {font-size:1.4rem; font-weight:800; line-height:1.2; letter-spacing:0.08em; text-align:left; color:#1C1C1C; padding:0 0 0 2.0em;}
#gNav ul > li a {text-decoration:none; color:#1C1C1C; display:block;}
#gNav ul > li.top {display:none;}
#gNav ul > li.contact a {width:144px; height:40px; color:#fff; background-color:#1C1C1C; border-radius:9999px; display:flex; justify-content:center; align-items:center;}
#gNav ul > li a > span {width:100%; height:1.0em; text-align:center; display:block; position:relative; overflow:hidden;}
#gNav ul > li a > span > span {display:block; position:relative; top:-1.2em; left:0; transition:top 0.3s ease;}
#gNav ul > li a:hover > span > span {top:0;}

@media screen and (max-width:800px){
	#header {height:144px; top:-144px;}
	#header > div {padding:0 23px;}
	#header .logo {width:73px;}
	#header .mail {display:block;}
	body.move #header {height:72px;}
	body.move #header > div {padding:0 23px;}
	body.move #header .logo {width:44px;}
	body.load #header {top:0;}

	#header #gNavBtn {display:block;}
	#gNav {width:100%; height:100vh; display:flex; align-items:flex-end; position:fixed; bottom:-100%; left:0; z-index:305; overflow:auto; transition:bottom 0.6s ease;}
	#gNavCheck:checked + #header #gNav {bottom:0;}

	#gNav > div {width:100%; padding:20px; background-color:#fff; box-sizing:border-box;}
	#gNav ul {max-width:320px; margin:0 auto;}
	#gNav ul > li {width:50%; text-align:center; padding:1.2em 0;}
	#gNav ul > li.top {width:100%; display:block;}
	#gNav ul > li.top a {width:74px; margin:0 auto; display:block;}
	#gNav ul > li.contact {width:100%;}
	#gNav ul > li.contact a {width:200px; height:48px; margin:0 auto;}
}


/* footer */
/* -------------------------------------------------------- */
#footer {color:#fff; padding:80px 0 30px 0; background-color:#1c1c1c;}
#footer .nav {display:flex; flex-wrap:wrap; justify-content:center; align-items:center;}
#footer .nav > li {font-size:1.4rem; font-weight:800; line-height:1.2; letter-spacing:0.08em; text-align:left; color:#fff; padding:0 0 0 2.0em;}
#footer .nav > li a {text-decoration:none; color:#fff;}
#footer .nav > li.top {width:100%; padding:0 0 40px 0;}
#footer .nav > li.top a {width:90px; margin:0 auto; display:block;}
#footer .nav > li.contact a {width:144px; height:40px; color:#1C1C1C; background-color:#fff; border-radius:9999px; display:flex; justify-content:center; align-items:center;}
#footer .nav > li a > span {width:100%; height:1.0em; text-align:center; display:block; position:relative; overflow:hidden;}
#footer .nav > li a > span > span {display:block; position:relative; top:-1.2em; left:0; transition:top 0.3s ease;}
#footer .nav > li a:hover > span > span {top:0;}
#footer .address {margin:120px auto 0 auto; display:inline-block;}
#footer .address dt img {max-width:132px; width:100%;}
#footer .address dd {font-size:1.2rem; line-height:1.8rem; text-align:left; margin:1.0em 0 0 0;}
#footer .address dd a {max-width:312px; width:100%; display:block;}
#footer .copy {font-size:1.0rem; line-height:1.6rem; text-align:center; margin:60px 0 0 0;}

@media screen and (max-width:767px){
	#footer {padding:80px 0 24px 0;}
	#footer .nav {display:block;}
	#footer .nav > li {font-size:1.4rem; text-align:center; padding:2.0em 0 0 0;}
	#footer .nav > li.top {padding:0;}
	#footer .nav > li.contact a {margin:0 auto;}
	#footer .address {margin:49px auto 0 auto;}
	#footer .address dd {font-size:1.2rem; line-height:1.8rem;}
	#footer .copy {font-size:1.0rem; line-height:1.6rem; margin:40px 0 0 0;}
}


/* contents */
/* -------------------------------------------------------- */
#contents {}

.sec {max-width:1300px; margin:0 auto; padding:0 15px; box-sizing:border-box;}

#stkr {width:20px; height:20px; background:rgba(0,0,0,0.1); border-radius:100%; position:fixed; top:-10px; left:-10px; opacity:0; transition:transform 0.3s ease-out, opacity 0.3s ease, background-color 0.3s ease; pointer-events:none; z-index:310;}
#stkr.on {opacity:1;}

.ttl-01 {text-align:left; display:flex; align-items:flex-end;}
.ttl-01 .en {font-size:8.0rem; line-height:1; letter-spacing:0.08em; white-space:nowrap; padding:0 0.5em 0 0;}
.ttl-01 .jp {font-size:1.5rem; line-height:2.62rem;}
.ttl-02 {font-size:2.2rem; line-height:1;}
.ttl-02 .en {letter-spacing:0.08em;}
.ttl-02 span {padding:0 1.5em; display:inline-block; position:relative;}
.ttl-02 span::before,
.ttl-02 span::after {font-family:"Zen Kaku Gothic New", sans-serif; display:block; position:absolute; top:0;}
.ttl-02 span::before {content:'['; left:0;}
.ttl-02 span::after {content:']'; right:0;}
.ttl-01.parallax {transform:translate3d(0,0,0); opacity:1;}
.ttl-01.parallax.on {transform:translate3d(0,0,0); opacity:1;}
.ttl-01.parallax .en {transform:translate3d(-50px,0,0); opacity:0;}
.ttl-01.parallax.on .en {transform:translate3d(0,0,0); opacity:1; transition:opacity 0.6s ease, transform 0.6s ease;}
.ttl-01.parallax .jp {transform:translate3d(-50px,0,0); opacity:0;}
.ttl-01.parallax.on .jp {transform:translate3d(0,0,0); opacity:1; transition:opacity 0.6s 0.2s ease, transform 0.6s 0.2s ease;}

.txt-01 dt {font-size:3.2rem; line-height:4.8rem; white-space:nowrap;}
.txt-01 dd {font-size:1.5rem; line-height:2.62rem; margin:50px 0 0 0;}

.parallax {transform:translate3d(0,50px,0); opacity:0;}
.parallax.on {transform:translate3d(0,0,0); opacity:1; transition:opacity 0.6s ease, transform 0.6s ease;}

@media screen and (max-width:767px){
	.sec {padding:0 6.0vw;}

	.ttl-01 {display:block;}
	.ttl-01 .en {font-size:5.6rem; line-height:1; padding:0; display:block;}
	.ttl-01 .jp {font-size:1.5rem; margin:1.0em 0 0 0; display:block;}
	.ttl-02 {font-size:2.2rem;}

	.txt-01 dt {font-size:2.8rem; line-height:4.2rem; white-space:normal;}
	.txt-01 dd {font-size:1.5rem; line-height:2.62rem; margin:24px 0 0 0;}
}

/* mv-sec */
.mv-sec {background:url(../img/mv.jpg) center top no-repeat; background-size:cover;}
.mv-sec .sec {max-width:1030px;}
.mv-sec .mv {height:100.0vh; display:flex; align-items:center;}
.mv-sec .mv > div {width:100%;}
.mv-sec .mv-txt {width:510px;}
.mv-sec .about {min-height:120.0vh; display:flex; align-items:center;}
.mv-sec .about > div {width:100%; padding:30px 0; box-sizing:border-box;}
.mv-sec .about dl {text-align:left;}
.mv-sec .about dt {font-size:5.6rem; line-height:7.84rem; letter-spacing:0.08em;}
.mv-sec .about dt span {font-size:2.2rem; line-height:3.52rem; letter-spacing:0; display:block;}
.mv-sec .about dd {font-size:1.8rem; line-height:4.32rem; letter-spacing:0.08em; margin:2.0em 0 0 0;}
.mv-sec {opacity:0;}
.mv-sec .mv-txt > div:nth-of-type(1) {transform:translate3d(-150px,0,0); opacity:0;}
.mv-sec .mv-txt > div:nth-of-type(2) {transform:translate3d(150px,0,0); opacity:0;}
body.load .mv-sec {opacity:1; transition:opacity 0.6s ease;}
body.load .mv-sec .mv-txt > div:nth-of-type(1) {transform:translate3d(0,0,0); opacity:1; transition:opacity 1.0s 1.0s ease-out, transform 1.0s 1.0s ease-out;}
body.load .mv-sec .mv-txt > div:nth-of-type(2) {transform:translate3d(0,0,0); opacity:1; transition:opacity 1.0s 1.2s ease-out, transform 1.0s 1.2s ease-out;}

@media screen and (max-width:767px){
	.mv-sec {background-image:url(../img/mv_sp.jpg);}
	.mv-sec .mv {height:100.0vh; align-items:flex-start;}
	.mv-sec .mv-txt {width:79.4vw; margin:0 auto; padding:40.0vw 0 0 0;}
	.mv-sec .about {align-items:flex-start;}
	.mv-sec .about > div {width:100%; padding:120.0vw 0 20.0vw 0;}
	.mv-sec .about dt {font-size:5.6rem; line-height:7.84rem; letter-spacing:0.08em;}
	.mv-sec .about dt span {font-size:2.2rem; line-height:3.52rem; letter-spacing:0; display:block;}
	.mv-sec .about dd {font-size:1.8rem; line-height:4.32rem; letter-spacing:0.08em; margin:2.0em 0 0 0;}
}

/* product-sec */
.product-sec {padding:180px 0 0 0; background-color:#fff;}
.product-sec .catch {font-size:4.0rem; line-height:5.6rem; letter-spacing:0.16em; text-align:center; margin:0 auto; padding:0 0 0.5em 0; display:inline-block; position:relative;}
.product-sec .catch::before {content:''; width:100%; height:1px; background-color:#1c1c1c; display:block; position:absolute; bottom:0; left:0;}
.product-sec .ttl-01 {margin:180px 0 0 0;}
.product-sec .clm1 {margin:130px 0 0 0; position:relative;}
.product-sec .clm1 .ctx {max-width:332px; text-align:left; position:relative; z-index:5;}
.product-sec .clm1 .ttl-02 {color:#F2483C;}
.product-sec .clm1 dl {margin:80px 0 0 0;}
.product-sec .clm1 dd.img1 {margin:30px 0 0 0;}
.product-sec .clm1 dd.img2 {width:200px; margin:0; position:absolute; top:-50px; left:520px;}
.product-sec .clm1 .img3 {width:calc(50% + 165px); height:100%; background-repeat:no-repeat; background-position:center center; background-size:cover; border-radius:80px 0 0 80px; position:absolute; top:0; right:0;}
.product-sec .clm1.type1 .ctx {margin:0 0 0 auto;}
.product-sec .clm1.type1 .img3 {border-radius:0 80px 80px 0; left:0;}
.product-sec .clm2 {margin:130px 0 0 0; padding:100px 108px 84px 0; background:url(../img/product_04.jpg) center center no-repeat; background-size:cover; border-radius:48px;}
.product-sec .clm2 .ctx {width:610px; text-align:left; margin:0 0 0 auto;}
.product-sec .clm2 dl {margin:80px 0 0 0;}
.product-sec .clm2 dd.btns {margin:60px 0 0 0; display:flex; justify-content:space-between;}
.product-sec .clm2 dd.btns a {width:296px; height:80px; font-size:1.5rem; line-height:3.2rem; text-decoration:none; color:#000; background-color:#fff; border-radius:9999px; display:flex; justify-content:center; align-items:center; position:relative;}
.product-sec .clm2 dd.btns a svg {width:10px; height:10px; margin:-5px 8px 0 0; fill:#F2483C; display:block; position:absolute; top:50%; right:0;}
.product-sec .clm2 dd.btns a span {padding:0 0 0 40px; display:block; position:relative;}
.product-sec .clm2 dd.btns a span::before {content:''; width:36px; height:36px; margin:-18px 0 0 0; background-position:center center; background-repeat:no-repeat; background-size:auto 100%; display:block; position:absolute; top:50%; left:0;}
.product-sec .clm2 dd.btns a.btn1 span::before {background-image:url(../img/icon_pdf.png);}
.product-sec .clm2 dd.btns a.btn2 span::before {background-image:url(../img/icon_ebook.png);}
.product-sec .clm3 {margin:160px 0 -300px 0; border-radius:12px; overflow:hidden;}
.product-sec .clm3 img {display:block;}
.product-sec .clm1 .img3.parallax {transform:translate3d(50px,0,0); opacity:0;}
.product-sec .clm1 .img3.parallax.on {transform:translate3d(0,0,0); opacity:1; transition:opacity 0.6s ease, transform 0.6s ease;}
.product-sec .clm1.type1 .img3.parallax {transform:translate3d(-50px,0,0); opacity:0;}
.product-sec .clm1.type1 .img3.parallax.on {transform:translate3d(0,0,0); opacity:1; transition:opacity 0.6s ease, transform 0.6s ease;}

@media screen and (max-width:1270px){
	.product-sec .clm1 .ctx {width:26.1%;}
	.product-sec .clm1 dt {white-space:normal;}
	.product-sec .clm1 .img3 {width:63.6%;}
}
@media screen and (max-width:767px){
	.product-sec {padding:120px 0 0 0;}
	.product-sec .catch {font-size:3.2rem; line-height:4.8rem; letter-spacing:0; display:block;}
	.product-sec .ttl-01 {margin:130px 0 0 0;}
	.product-sec .clm1 {margin:24px 0 0 0; position:relative;}
	.product-sec .clm1 .ctx {max-width:100%; width:100%; margin:58px 0 0 0; position:static;}
	.product-sec .clm1 dl {margin:24px 0 0 0;}
	.product-sec .clm1 dd.img1 {margin:24px 0 0 0;}
	.product-sec .clm1 dd.img2 {width:17.3vw; margin:0; top:-2.1vw ; left:8.5vw;}
	.product-sec .clm1 .img3 {width:100%; height:64.0vw; border-radius:24px; position:static;}
	.product-sec .clm1.type1 .ctx {margin:58px 0 0 0;}
	.product-sec .clm1.type1 .img3 {border-radius:24px; left:0;}
	.product-sec .clm2 {margin:56px -6.0vw 0 -6.0vw; padding:80px 6.0vw; background-position:left center; border-radius:0;}
	.product-sec .clm2 .ctx {width:auto; margin:0;}
	.product-sec .clm2 .txt-01 dt {font-size:2.2rem;}
	.product-sec .clm2 dl {margin:24px 0 0 0;}
	.product-sec .clm2 dd.btns {margin:22px 0 0 0; display:block;}
	.product-sec .clm2 dd.btns > div {padding:24px 0 0 0;}
	.product-sec .clm2 dd.btns a {width:296px; height:80px; font-size:1.5rem;}
	.product-sec .clm3 {margin:80px 0 0 0;}
}

/* company-message-sec */
.company-message-sec {padding:480px 0 154px 0; background-color:#F5F5F5;}
.company-message-sec .clm {margin:130px 0 0 0; display:flex; justify-content:space-between;}
.company-message-sec .ctx {width:28.6%; text-align:left;}
.company-message-sec dl {margin:80px 0 0 0;}
.company-message-sec .imgs {width:62.6%;}
.company-message-sec .imgs > div {max-width:650px; width:100%; height:660px; position:relative;}
.company-message-sec .imgs > div > div {border-radius:12px; overflow:hidden;}
.company-message-sec .imgs img {display:block;}
.company-message-sec .imgs .img1 {width:61.2%; position:absolute; top:0; right:0; z-index:1;}
.company-message-sec .imgs .img2 {width:61.2%; position:absolute; bottom:0; left:0; z-index:2;}
.company-message-sec .imgs .img1.parallax {transform:translate3d(50px,0,0); opacity:0;}
.company-message-sec .imgs .img1.parallax.on {transform:translate3d(0,0,0); opacity:1; transition:opacity 0.6s ease, transform 0.6s ease;}
.company-message-sec .imgs .img2.parallax {transform:translate3d(-50px,0,0); opacity:0;}
.company-message-sec .imgs .img2.parallax.on {transform:translate3d(0,0,0); opacity:1; transition:opacity 0.6s ease, transform 0.6s ease;}

@media screen and (max-width:1270px){
	.company-message-sec dt {white-space:normal;}
	.company-message-sec .img {height:51.9vw;}
}
@media screen and (max-width:767px){
	.company-message-sec {padding:100px 0 50.0vw 0;}
	.company-message-sec .clm {margin:92px 0 0 0; display:block;}
	.company-message-sec .ctx {width:auto;}
	.company-message-sec dl {margin:24px 0 0 0;}
	.company-message-sec .imgs {width:auto; margin:32px 0 0 0;}
	.company-message-sec .imgs > div {max-width:650px; width:auto; height:auto;}
	.company-message-sec .imgs .img1 {width:62.4%; margin:0 0 0 auto; position:static;}
	.company-message-sec .imgs .img2 {width:76.8%; margin:-26.6vw 0 0 0; position:static;}
}

/* company-history-sec */
.company-history-sec {padding:120px 0 160px 0; background-color:#fff;}
.company-history-sec .clm {display:flex; justify-content:space-between;}
.company-history-sec .clm > div:first-of-type .ttl-02 {white-space:nowrap; padding:0 2.0em 0 0;}
.company-history-sec .clm > div:last-of-type {flex:1;}
.company-history-sec .list {max-width:780px; width:100%; text-align:left;}
.company-history-sec .list dl {border-bottom:solid 1px #DADADA; display:flex;}
.company-history-sec .list dl:first-of-type dt {padding-top:0;}
.company-history-sec .list dl:first-of-type dd {padding-top:0;}
.company-history-sec .list dt {font-size:1.5rem; line-height:2.62rem; white-space:nowrap; padding:1.2em 6.0em 1.2em 0;}
.company-history-sec .list dd {font-size:1.5rem; line-height:2.62rem; padding:1.2em 0; flex:1;}

@media screen and (max-width:767px){
	.company-history-sec {padding:56px 0 65.3vw 0;}
	.company-history-sec .clm {display:block;}
	.company-history-sec .clm > div:first-of-type .ttl-02 {text-align:left; padding:0;}
	.company-history-sec .clm > div:last-of-type {margin:51px 0 0 0;}
	.company-history-sec .list dl {display:block;}
	.company-history-sec .list dl:first-of-type dt {padding-top:0;}
	.company-history-sec .list dl:first-of-type dd {padding-top:0;}
	.company-history-sec .list dt {font-size:1.5rem; line-height:2.25rem; padding:1.2em 0 0 0;}
	.company-history-sec .list dd {font-size:1.5rem; line-height:2.25rem; padding:0 0 1.2em 0; word-break:break-all;}
}

/* company-outline-sec */
.company-outline-sec {padding:200px 0 200px 0; background-color:#F5F5F5;}
.company-outline-sec .clm {display:flex; justify-content:space-between;}
.company-outline-sec .clm > div:first-of-type {position:relative; flex:1;}
.company-outline-sec .clm > div:last-of-type {width:37.5%; text-align:left;}
.company-outline-sec .list {text-align:left; margin:120px 0 0 0;}
.company-outline-sec .list dl {border-bottom:solid 1px #BCBCBC; display:flex;}
.company-outline-sec .list dt {width:6.0em; font-size:1.5rem; line-height:2.25rem; white-space:nowrap; padding:1.2em 0;}
.company-outline-sec .list dd {font-size:1.5rem; line-height:2.25rem; padding:1.2em 0; flex:1;}
.company-outline-sec .img1 {width:92.4%; margin:0 0 -225px 0; border-radius:12px; position:relative; top:-280px; overflow:hidden;}
.company-outline-sec .img1 img {display:block;}
.company-outline-sec .img2 {width:34.8%; border-radius:12px; position:relative; left:45.4%; overflow:hidden;}
.company-outline-sec .img2 img {display:block;}
.company-outline-sec .img3 {width:100%; height:100%; margin:0; background:url(../img/company_05.jpg) center center no-repeat; background-size:cover; position:fixed; bottom:0; left:0; z-index:-1;}
.company-outline-sec .map {width:100%; height:480px; margin:107px 0 0 0; border-radius:12px; overflow:hidden;}
.company-outline-sec .map iframe {width:100%; height:100%; filter: grayscale(1);}
.company-outline-sec .map + .txt {font-size:1.5rem; line-height:2.62rem; text-align:center; margin:1.5em 0 0 0;}
.company-outline-sec .map + .txt a {text-decoration:none; color:#1c1c1c;}
.company-outline-sec .img3.parallax {transform:translate3d(0,0,0); opacity:0;}
.company-outline-sec .img3.parallax.on {transform:translate3d(0,0,0); opacity:1; transition:opacity 0.6s ease, transform 0.6s ease;}

@media screen and (max-width:767px){
	.company-outline-sec {padding:57.6vw 0 84px 0;}
	.company-outline-sec .clm {display:block;}
	.company-outline-sec .clm > div:first-of-type {position:relative;}
	.company-outline-sec .clm > div:last-of-type {width:auto; margin:64px 0 0 0;}
	.company-outline-sec .list {margin:40px 0 0 0;}
	.company-outline-sec .list dl {display:block;}
	.company-outline-sec .list dt {width:auto; font-size:1.5rem; padding:1.2em 0 0 0;}
	.company-outline-sec .list dd {font-size:1.5rem; padding:0 0 1.2em 0;}
	.company-outline-sec .img1 {width:100%; margin:-103.4vw 0 0 0; top:0;}
	.company-outline-sec .img2 {display:none;}
	.company-outline-sec .img3 {background-image:url(../img/company_05_sp.jpg);}
	.company-outline-sec .map {width:100%; height:400px; margin:48px 0 0 0;}
	.company-outline-sec .map + .txt {font-size:1.5rem; line-height:2.62rem;}
}

/* case-sec */
.case-sec {margin:80.0vh 0 0 0; padding:250px 0 380px 0; background:url(../img/case_bg.png) center bottom no-repeat; background-size:auto 165px;}
.case-sec .clm {margin:130px -20px 0 -20px; display:flex;}
.case-sec .clm > div {width:33.33%; width:calc(100% / 3); padding:0 20px; box-sizing:border-box;}
.case-sec .clm .img {width:100%; padding:95.2% 0 0 0; background-repeat:no-repeat; background-position:center center; background-size:cover; border-radius:12px; overflow:hidden;}
.case-sec .clm dl {max-width:300px; width:100%; margin:40px auto 0 auto;}
.case-sec .clm dt {font-size:2.2rem; line-height:3.52rem; text-align:center;}
.case-sec .clm dd {font-size:1.5rem; line-height:2.62rem; text-align:left; margin:1.0em 0 0 0;}

@media screen and (max-width:767px){
	.case-sec {padding:80px 0 263px 0; background-image:url(../img/case_bg_sp.png); background-size:auto 170px;}
	.case-sec .clm {margin:16px 0 0 0; display:block;}
	.case-sec .clm > div {width:auto; padding:32px 0 0 0;}
	.case-sec .clm .img {width:100%; padding:60.9% 0 0 0;}
	.case-sec .clm dl {margin:24px auto 0 auto;}
	.case-sec .clm dt {font-size:1.8rem; line-height:3.2rem;}
	.case-sec .clm dd {font-size:1.5rem; line-height:2.25rem;}
}

/* contact-sec */
.contact-sec {padding:160px 0 170px 0; background-color:#fff;}
.contact-sec .form {max-width:850px; width:100%; margin:40px auto 0 auto; display:block;}
.contact-sec .form input[type="text"],
.contact-sec .form textarea {width:100%; padding:1.2em 1.0em; background-color:#F5F5F5; border:none; box-sizing:border-box;}
.contact-sec .form textarea {height:240px; resize:none;}
.contact-sec .form label {font-size:1.5rem; display:flex; align-items:center; margin:0.5em 0 0 0;}
.contact-sec .form label input {margin:0 0.5em 0 0; display:block;}
.contact-sec .btns {margin:28px 0 0 0; display:flex; flex-wrap:wrap; justify-content:center; align-items:center;}
.contact-sec .btns > div {padding:10px 5px 0 5px;}
.contact-sec .btns button {width:360px; height:80px; font-size:1.8rem; line-height:1; color:#fff; background-color:#1c1c1c; border:none; border-radius:9999px; box-sizing:border-box; display:flex; justify-content:center; align-items:center; position:relative; cursor:pointer;}
.contact-sec .btns button svg {width:10px; height:10px; margin:-5px 10px 0 0; fill:#fff; display:block; position:absolute; top:50%; right:0;}
.contact-sec .txt1 {font-size:1.2rem; line-height:1.8rem; text-align:right; color:#F2483C;}
.contact-sec .txt2 {margin:10px 0 0 0; border-top:solid 1px #1C1C1C;}
.contact-sec .txt2 > dl {text-align:left; padding:15px 0; border-bottom:solid 1px #1C1C1C; display:flex; align-items:center;}
.contact-sec .txt2 > dl > dt {width:32%; font-size:1.5rem; line-height:2.62rem;}
.contact-sec .txt2 > dl > dt span {color:#F2483C; margin:0 0 0 0.2em; display:inline-block;}
.contact-sec .txt2 > dl > dd {font-size:1.2rem; line-height:1.8rem; flex:1;}
.contact-sec .txt2 > dl > dd .erro-txt {font-size:1.4rem; text-align:left; color:#c00;}
.contact-sec .txt3 {text-align:left; margin:30px 0 0 0;}
.contact-sec .txt3 textarea {width:100%; height:12.0em; scroll-behavior:smooth; resize:none;}
.contact-sec .txt4 {font-size:1.6rem; text-align:left; margin:30px 0 0 0;}
.contact-sec .txt5 {text-align:center; margin:50px 0 0 0;}
.contact-sec .txt5 a {width:360px; height:80px; font-size:1.8rem; line-height:1; text-decoration:none; color:#fff; margin:0 auto; background-color:#1c1c1c; border:none; border-radius:9999px; box-sizing:border-box; display:flex; justify-content:center; align-items:center; position:relative; cursor:pointer;}
.contact-sec .txt5 a svg {width:10px; height:10px; margin:-5px 10px 0 0; fill:#fff; display:block; position:absolute; top:50%; right:0;}
.contact-sec .clm1 {margin:0 -6px; display:flex;}
.contact-sec .clm1 > div {width:50%; padding:0 6px; box-sizing:border-box;}
.contact-sec form::before {content:''; width:100%; height:100%; background-color:rgba(255,255,255,0.7); display:block; position:fixed; top:0; left:0; opacity:0; pointer-events:none; z-index:998;}
.contact-sec form::after {content:''; width:50px; height:50px; margin:-25px 0 0 -25px; background:url(../img/loading.svg) no-repeat center center; background-size:cover; display:block; position:fixed; top:50%; left:50%; opacity:0; pointer-events:none; z-index:999;}
.contact-sec form.loading::before {opacity:1; pointer-events:auto; transition:opacity 0.3s ease;}
.contact-sec form.loading::after {opacity:1; pointer-events:auto; transition:opacity 0.3s ease; animation:spinner 1.5s linear infinite;}
.contact-sec input.inputCheck {display:none;}
@keyframes spinner {
	0% {transform:rotate(0deg);}
	100% {transform:rotate(360deg);}
}

@media screen and (max-width:767px){
	.contact-sec {padding:150px 0 160px 0;}
	.contact-sec .form {margin:55px auto 0 auto; display:block;}
	.contact-sec .form input[type="text"],
	.contact-sec .form textarea {padding:0.8em 0.5em;}
	.contact-sec .form textarea {height:200px;}
	.contact-sec .form label {font-size:1.5rem;}
	.contact-sec .btns {margin:30px 0 0 0; display:block;}
	.contact-sec .btns > div {text-align:center; padding:10px 0 0 0;}
	.contact-sec .btns button {max-width:328px; width:100%; height:80px; font-size:1.8rem; margin:0 auto;}
	.contact-sec .txt1 {font-size:1.2rem; line-height:1.8rem;}
	.contact-sec .txt2 {margin:5px 0 0 0;}
	.contact-sec .txt2 > dl {padding:12px 0; display:block;}
	.contact-sec .txt2 > dl > dt {width:auto; font-size:1.5rem; line-height:1.5rem;}
	.contact-sec .txt2 > dl > dd {font-size:1.2rem; line-height:1.8rem; margin:0.5em 0 0 0;}
	.contact-sec .clm1 {margin:0 -4px;}
	.contact-sec .clm1 > div {padding:0 4px;}
}