@charset "UTF-8";


:root {
  --bs-br-01: #9A8065; --cl-wh-01:#ffffff;
  --cl-tx-01:#1C1C1C; --cl-tx-02: #888888; --cl-tx-03:#E1251B;
  --cl-bt-01: #E1251B;
  --cl-bg-01: #FAFAFA; --cl-bg-02: #FFFDF9;
  --cl-line-01: #C8C8C8;
  --cl-gradient-01: linear-gradient(90deg, #E1251B 0%, #7B140F 100%);
  --shadow-01: ;


}




/* Base Common Css */
/*---------------------------------------------
  Reset
---------------------------------------------*/
*, *::before, *::after {box-sizing: border-box; margin: 0; padding: 0;}
html {font-family: 'Noto Sans JP', sans-serif; font-size: 62.5%; overflow-x: hidden; scroll-behavior: smooth;}
body {margin: 0; line-height: 1.6; font-size: 1.6rem; overflow-x: hidden; word-wrap: break-word;}
h1,h2,h3,h4,h5,h6,p,a,ul,li,ol,dl,dt,dd,table,tr,th,td,span,strong {margin: 0; padding: 0; line-height: 1.6em; letter-spacing: 0em; font-weight: 400;font-feature-settings : "palt"; color: var(--colortxt-01);}
main {display: block;overflow: hidden;}
ul, ol {list-style: none; margin: 0; padding: 0;}
a, a:visited {color:var(--colortxt-01); text-decoration: none; background-color: transparent; transition: .5s;}
a:hover, a:active {color:var(--colortxt-01);}
abbr[title] {border-bottom: none; text-decoration: underline; text-decoration: underline dotted;}
b, strong {font-weight: bolder;}
code, kbd, samp {font-family: monospace, monospace; font-size: 1em;}
small {font-size: 80%;}
sub, sup {font-size: 75%; line-height: 0; position: relative; vertical-align: baseline;}
sub {bottom: -0.25em;}
sup {top: -0.5em;}
img {border-style: none; width: auto; height: auto; max-width: 100%; max-height: 100%; display: block;}
hr {box-sizing: content-box; height: 0; overflow: visible;}
button, input, optgroup, select, textarea {font-size: 100%; line-height: 1.15; margin: 0;}
button, input {overflow: visible;}
button, select {text-transform: none;}
button, [type="button"], [type="reset"], [type="submit"] {-webkit-appearance: button;}
button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {border-style: none; padding: 0;}
button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {outline: 1px dotted ButtonText;}
fieldset {padding: 0.35em 0.75em 0.625em;}
legend {box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal;}
progress {vertical-align: baseline;}
textarea {overflow: auto;}
[type="checkbox"], [type="radio"] {box-sizing: border-box; padding: 0;}
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {height: auto;}
[type="search"] {-webkit-appearance: textfield; outline-offset: -2px;}
[type="search"]::-webkit-search-decoration {-webkit-appearance: none;}
::-webkit-file-upload-button {-webkit-appearance: button; font: inherit;}
details {display: block;}
summary {display: list-item;}
template {display: none;}
[hidden] {display: none;}




/*---------------------------------------------
  Common parts
---------------------------------------------*/
#contents {width: 100%;padding: 0;margin: 0;z-index: 0;overflow: hidden;}
section {width: 100%;height: auto; padding: 0;margin: 0 auto;display: block;position: relative;}
#low-contents{width: 100%;padding: 0;margin: 0;z-index: 0;overflow: hidden;background: ;}
.inbox {width: 100%; height: auto; padding: 60px 20px; margin: 0 auto; display: block; position: relative; }
.inbox h2 {font-size: 2rem; color: ; font-family: "Petit Formal Script", cursive; font-weight: bold; text-align: center; margin-bottom: 60px;}
.inbox h3 {font-size: 1.8rem; color: ; font-weight: bold; text-align: left; margin-bottom: 30px;}
.sp-none {display: none;} .tb-none {display: block;} .tbl-none {display: block;} .pc-none {display: block;} .sp-tb-none {display: none;} .tb-tbl-none {display: block;} .tbl-pc-none {display: block;}.sp-block {display: block;}.tb-block {display: none;}.tbl-block {display: none;}.pc-block {display: none;}
.flex-wrap-sb {display: flex; justify-content: space-between; align-items: center; margin: 0 auto;}
.flex-wrap-sa {display: flex; justify-content: space-around; align-items: center; margin: 0 auto;}
.flex-wrap-sb-tb, .flex-wrap-sa-tb{display: block;}
.flex-wrap-sb-tbl, .flex-wrap-sa-tbl{display: block;}
.flex-wrap-sb-pc, .flex-wrap-sa-pc{display: block;}
@media screen and (min-width: 768px) {
  .sp-none {display: block;} .tb-none {display: none;} .tbl-none {display: block;} .pc-none {display: block;} .sp-tb-none {display: none;} .tb-tbl-none {display: none;} .tbl-pc-none {display: block;}.sp-block {display: none;}.tb-block {display: block;}.tbl-block {display: none;}.pc-block {display: none;}
  .flex-wrap-sb-tb{display: flex;justify-content: space-between;align-items: center; margin: 0 auto;}
  .flex-wrap-sa-tb{display: flex;justify-content: space-around;align-items: center; margin: 0 auto;}

}
@media screen and (min-width: 1024px) {
  .inbox {padding: 90px 10px;}
  .inbox h2 {font-size: 2rem; margin-bottom: 60px;}
  .sp-none {display: block;} .tb-none {display: block;} .tbl-none {display: none;} .pc-none {display: block;} .sp-tb-none {display: block;} .tb-tbl-none {display: none;} .tbl-pc-none {display: none;}.sp-block {display: none;}.tb-block {display: none;}.tbl-block {display: block;}.pc-block {display: none;}
  .flex-wrap-sb-tbl{display: flex;justify-content: space-between;align-items: center; margin: 0 auto;}
  .flex-wrap-sa-tbl{display: flex;justify-content: space-around;align-items: center; margin: 0 auto;}

}
@media screen and (min-width: 1100px) {
  .inbox {max-width: 1200px; padding: 90px 0; margin: 0 auto; }
  .sp-none {display: block;} .tb-none {display: block;} .tbl-none {display: block;} .pc-none {display: none;} .sp-tb-none {display: block;} .tb-tbl-none {display: block;} .tbl-pc-none {display: none;}.sp-block {display: none;}.tb-block {display: none;}.tbl-block {display: none;}.pc-block {display: block;}
  .flex-wrap-sb-pc{display: flex;justify-content: space-between;align-items: center; margin: 0 auto;}
  .flex-wrap-sa-pc{display: flex;justify-content: space-around;align-items: center; margin: 0 auto;}

}


/* Button */
.btn-base-01, .btn-base-01:visited {width: fit-content;display: inline-block;padding: 15px 60px;color: #fff;font-size: 1.6rem;font-weight: 600;text-decoration: none;background-color: #E1251B;transition: .3s;border-radius: 30px;}
.btn-base-01:active, .btn-base-01:hover {color: #fff;background-color: #f13228;}

.btn-base-02, .btn-base-02:visited {width: fit-content;display: inline-block;padding: 15px 60px;color: #fff;font-size: 1.6rem;font-weight: 600;text-decoration: none;background-color: #E1251B;transition: .3s;border-radius: 30px;}
.btn-base-02:active, .btn-base-02:hover {color: #fff;background-color: #f13228;}


/* Form */
input {padding: .3rem .5rem;}
button, input, optgroup, select, textarea {font-size: 1rem;}


/* Animation ----------------------- */
.mv-left-in-pt1,.mv-left-in-pt2,.mv-right-in-pt1,.mv-right-in-pt2,.mv-bottom-in-pt1,.mv-bottom-in-pt2,.mv-scale-in-pt1,.mv-scale-in-pt2 { opacity: 0;will-change: transform, opacity;}
.mv-scale-in {opacity: 0;transform: scale(0.8);}
.reveal-lr {clip-path: inset(0 100% 0 0);will-change: clip-path;transform: translateZ(0);backface-visibility: hidden;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
.reveal-tb {clip-path: inset(100% 0 0 0);will-change: clip-path;transform: translateZ(0);backface-visibility: hidden;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
.reveal-rl {clip-path: inset(0 0 0 100%);will-change: clip-path;transform: translateZ(0);backface-visibility: hidden;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
.reveal-bt {clip-path: inset(0 0 100% 0);will-change: clip-path;transform: translateZ(0);backface-visibility: hidden;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
.reveal-center {clip-path: inset(50% 50% 50% 50%);will-change: clip-path;transform: translateZ(0);backface-visibility: hidden;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
.parallax-up, .parallax-down, .parallax-fade-left, .parallax-fade-right {will-change: transform, opacity; transform: translateZ(0); backface-visibility: hidden; }
.parallax-up {}
.parallax-down {}
.parallax-fade-left { opacity: 0.3; transform: translateX(-100px);}
.parallax-fade-right {opacity: 0.3; transform: translateX(100px);}
@media (max-width: 768px) {
  .parallax-up:not(.parallax-mobile-enabled),.parallax-down:not(.parallax-mobile-enabled),.parallax-fade-left:not(.parallax-mobile-enabled),.parallax-fade-right:not(.parallax-mobile-enabled) {transform: none !important;opacity: 1 !important;will-change: auto !important;}
  .parallax-mobile-enabled {will-change: transform, opacity;transform: translateZ(0);}
  .parallax-up,.parallax-down,.parallax-fade-left,.parallax-fade-right {will-change: auto;}
}
@media (min-width: 769px) and (max-width: 1024px) {
  .parallax-up,.parallax-down,.parallax-fade-left,.parallax-fade-right {transform: translateZ(0);}
}
.parallax-disabled {transform: none !important;opacity: 1 !important;will-change: auto !important;}
.parallax-subtle {}
.parallax-strong {}
.parallax-layer-back {z-index: 1;}
.parallax-layer-middle {z-index: 2;}
.parallax-layer-front {z-index: 3;}
.mv-fade-in-pt1, .mv-fade-in-pt2, .mv-fade-in-slow-pt1, .mv-fade-in-slow-pt2, .mv-fade-in-fast-pt1, .mv-fade-in-fast-pt2 { opacity: 0;}
.gsap-loaded .mv-fade-in-pt1, .gsap-loaded .mv-fade-in-pt2, .gsap-loaded .mv-fade-in-slow-pt1, .gsap-loaded .mv-fade-in-slow-pt2, .gsap-loaded .mv-fade-in-fast-pt1, .gsap-loaded .mv-fade-in-fast-pt2 { opacity: 1; }




/*---------------------------------------------
  Preloader
---------------------------------------------*/




/*---------------------------------------------
  Header
---------------------------------------------*/
.header {width: 100%; position: absolute; top: 0; left: 0; z-index: 100; background: none;}
.header-inner {width: 100%; height: 60px; padding: 0 10px; display: flex; justify-content: space-between; align-items: center; overflow-x: hidden;}
.header-inner .header-title { width: 7vw;}
.header-inner .header-title img { display: block; width: 7vw;}
.header-inner a:link , .header-inner a:visited {display: block; font-size: 5.6vw; color: var(--cl-wh-01) !important; font-family: "Petit Formal Script", cursive;}
@media screen and (min-width: 768px) {
  .header-inner {height: 80px;}
  .header-inner .header-title {width: 5vw;}
  .header-inner .header-title img {width: 5vw;}
  .header-inner a:link , .header-inner a:visited {font-size: 3.8vw;}
}
@media screen and (min-width: 1024px) {
  .header-inner {padding: 0 20px;}
  .header-inner .header-title {width: 4vw;}
  .header-inner .header-title img {width: 4vw;}
  .header-inner a:link , .header-inner a:visited {font-size: 2.8vw;}
}
@media screen and (min-width: 1100px) {
  .header-inner {width: 96%; margin: 0 auto; padding: 0 20px; position: relative;}
  .header-inner .header-title {width: 2.4vw;}
  .header-inner .header-title img {width: 2.4vw;}
  .header-inner a:link , .header-inner a:visited {font-size: 1.8vw;}
}




/*---------------------------------------------
  Footer
---------------------------------------------*/
.copy-wrap { width: 100%; padding: 20px 0; margin: 0; display: block; z-index: 1; background: var(--cl-wh-01);}
.copy-wrap p {text-align: center; color: var(--cl-tx-01); font-size: 14px; font-family: "Noto Serif", serif;}
@media screen and (min-width: 768px) {
}
@media screen and (min-width: 1024px) {
}
@media screen and (min-width: 1200px) {
}

.mv-bottom-in {
  opacity: 0;
  transform: translateY(100px);
}




/*---------------------------------------------
  Top page
---------------------------------------------*/
@media screen and (min-width: 768px) {
}
@media screen and (min-width: 1024px) {
}
@media screen and (min-width: 1100px) {
}

/* Main ----------------------- */
.main {width: 100%;height: 100vh; background: url('../images/main-bg.jpg') 50% 50%/cover no-repeat;}
.main .inbox { padding-top: 60vw;}
.main .inbox h2 {font-size: 5rem; font-family: "Noto Serif", serif; color: var(--cl-wh-01); text-align: center; margin-bottom: 30px; text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.1);}
.main .inbox p {font-size: 4vw; color: var(--cl-wh-01); text-align: center; text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.1);}
.main .inbox h2 + p {font-size: 6vw; font-family: "Noto Serif", serif; color: var(--cl-wh-01); margin-bottom: 30px; font-weight: bold;}

@media screen and (min-width: 768px) {
  .main .inbox { padding-top: 43vw;}
  .main .inbox h2 {font-size: 6rem;}
  .main .inbox p {font-size: 2.6vw;}
  .main .inbox h2 + p {font-size: 4vw;}
}
@media screen and (min-width: 1024px) {
  .main .inbox { padding-top: 44vw;}
  .main .inbox h2 {font-size: 8rem;}
  .main .inbox p {font-size: 2.6vw;}
  .main .inbox h2 + p {font-size: 3.8vw;}
}
@media screen and (min-width: 1025px) {
  .main .inbox {height: 100vh; padding-top: 14vw;}
  .main .inbox h2 {font-size: 5.8vw; margin-bottom: 25px;}
  .main .inbox p {font-size: 1.6vw;}
  .main .inbox h2 + p {font-size: 2.8vw;}
}



/* Service */
.service .inbox .tl-box p {font-size: 3vw; text-align: center; margin-bottom: 0;}
.service .inbox .tl-box h2 {font-size: 7vw; margin: ;}
.service .inbox .tl-box + p {text-align: center; font-size: 4vw; margin-bottom: 50px;}
.service .inbox .flex-wrap-sb-tbl .item {width: 100%; display: block; margin-bottom: 50px;}
.service .inbox .flex-wrap-sb-tbl .item:last-child {margin-bottom: 0;}
.service .inbox .flex-wrap-sb-tbl .item img {width: 100%; margin-bottom: 20px;}
.service .inbox .flex-wrap-sb-tbl .item h3 {font-size: 4vw; font-weight: bold; text-align: center; margin-bottom: 20px;}
.service .inbox .flex-wrap-sb-tbl .item p {text-align: center;}
@media screen and (min-width: 768px) {
  .service .inbox .tl-box p {font-size: 2.4vw;}
  .service .inbox .tl-box h2 {font-size: 5.4vw;}
  .service .inbox .tl-box + p {font-size: 2.8vw;}
  .service .inbox .flex-wrap-sb-tbl .item img {width: 80%; margin: 0 auto 20px;}
  .service .inbox .flex-wrap-sb-tbl .item h3 {font-size: 2.8vw;}
  .service .inbox .flex-wrap-sb-tbl .item p {text-align: center;}
}
@media screen and (min-width: 1024px) {
  .service .inbox .flex-wrap-sb-tbl {align-items: normal;}
  .service .inbox .tl-box p {font-size: 1.8vw;}
  .service .inbox .tl-box h2 {font-size: 3.2vw;}
  .service .inbox .tl-box + p {font-size: 1.6vw;}
  .service .inbox .flex-wrap-sb-tbl .item {width: calc(100% / 3 - 30px);}
  .service .inbox .flex-wrap-sb-tbl .item img {width: 100%; margin: 0 auto 20px;}
  .service .inbox .flex-wrap-sb-tbl .item h3 {font-size: 1.6vw;}
}
@media screen and (min-width: 1025px) {
  .service .inbox .tl-box p {font-size: 1.2vw;}
  .service .inbox .tl-box h2 {font-size: 2.4vw;}
  .service .inbox .tl-box + p {font-size: 1.1vw;}
  .service .inbox .flex-wrap-sb-tbl .item {width: calc(100% / 3 - 30px);}
  .service .inbox .flex-wrap-sb-tbl .item img {width: 100%; margin: 0 auto 20px;}
  .service .inbox .flex-wrap-sb-tbl .item h3 {font-size: 1.1vw;}
}


/* consept */
.consept {background: url('../images/consept-bg.jpg') 50% 50%/cover no-repeat;}
.consept .inbox .tl-box {color: var(--cl-wh-01);}
.consept .inbox .tl-box p {font-size: 3vw; text-align: center; margin-bottom: 0;}
.consept .inbox .tl-box h2 {font-size: 7vw; margin: ;}
.consept .inbox h3 {text-align: center; color: var(--cl-wh-01); font-size: 5vw;  font-family: "Noto Serif", serif; }
.consept .inbox h3 + p {color: var(--cl-wh-01); font-size: ; text-align: center;}
@media screen and (min-width: 768px) {
  .consept .inbox .tl-box p {font-size: 2.4vw;}
  .consept .inbox .tl-box h2 {font-size: 5.4vw;}
  .consept .inbox h3 {font-size: 4vw; }
  .consept .inbox h3 + p {font-size: 2.8vw;}
}
@media screen and (min-width: 1024px) {
  .consept .inbox .tl-box p {font-size: 1.8vw;}
  .consept .inbox .tl-box h2 {font-size: 3.2vw;}
  .consept .inbox h3 {font-size: 3vw; }
  .consept .inbox h3 + p {font-size: 1.6vw;}
}
@media screen and (min-width: 1025px) {
  .consept .inbox .tl-box p {font-size: 1.2vw;}
  .consept .inbox .tl-box h2 {font-size: 2.4vw;}
  .consept .inbox h3 {font-size: 2vw;}
  .consept .inbox h3 + p {font-size: 1.1vw;}
}


/* Contact */
.contact {background: url('../images/contact-bg.jpg') 50% 50%/cover no-repeat;}
.contact .inbox .tl-box {color: var(--cl-tx-01);}
.contact .inbox .tl-box p {font-size: 3vw; text-align: center; margin-bottom: 0;}
.contact .inbox .tl-box h2 {font-size: 7vw; margin: ;}
.contact .inbox .tl-box + p {text-align: center; font-size: 4vw; margin-bottom: 50px;}
.contact .inbox a:link, .contact .inbox a:visited {color: var(--cl-wh-01); background-color: var(--cl-tx-01); border-radius: 30px; display: block; width: fit-content; padding: 10px 30px; font-size: ; margin: 0 auto;}
@media screen and (min-width: 768px) {
  .contact .inbox .tl-box p {font-size: 2.4vw;}
  .contact .inbox .tl-box h2 {font-size: 5.4vw;}
  .contact .inbox .tl-box + p {font-size: 2.8vw;}
  .contact .inbox a:link, .contact .inbox a:visited {padding: 10px 30px; font-size: 2.4vw;}
}
@media screen and (min-width: 1024px) {
  .contact .inbox .tl-box p {font-size: 1.8vw;}
  .contact .inbox .tl-box h2 {font-size: 3.2vw;}
  .contact .inbox .tl-box + p {font-size: 1.6vw;}
  .contact .inbox a:link, .contact .inbox a:visited {padding: 10px 30px; font-size: 1.6vw;}
}
@media screen and (min-width: 1025px) {
  .contact .inbox .tl-box p {font-size: 1.2vw;}
  .contact .inbox .tl-box h2 {font-size: 2.4vw;}
  .contact .inbox .tl-box + p {font-size: 1.1vw;}
  .contact .inbox a:link, .contact .inbox a:visited {padding: 10px 30px; font-size: 1.1vw;}
}




/*---------------------------------------------
  Low page
---------------------------------------------*/
.low-tl-box {display: block; width: 100%; height: 70vw; padding-top: 28vw;}
.low-tl-box.company {background: url('../images/low-tl-comapny.jpg') 50% 50%/cover no-repeat;}
.low-tl-box p {font-size: 4vw; color: var(--cl-wh-01); text-align: center; font-family: "Noto Serif", serif;}
.low-tl-box h2 {font-size: 8vw; text-align: center; color: var(--cl-wh-01); font-family: "Petit Formal Script", cursive;}
@media screen and (min-width: 768px) {
  .low-tl-box {height: 60vw; padding-top: 22vw;}
  .low-tl-box p {font-size: 3vw;}
  .low-tl-box h2 {font-size: 6vw;}
}
@media screen and (min-width: 1024px) {
  .low-tl-box {height: 40vw; padding-top: 14vw;}
  .low-tl-box p {font-size: 2.6vw;}
  .low-tl-box h2 {font-size: 4vw;}
}
@media screen and (min-width: 1025px) {
  .low-tl-box {height: 30vw; padding-top: 10vw;}
  .low-tl-box p {font-size: 1.8vw;}
  .low-tl-box h2 {font-size: 3vw;}
}

/* Company */
.company-info { background-color: #fff; border-radius: 8px; overflow: hidden; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); margin-bottom: 50px; }
.info-row { display: flex; flex-direction: column; border-bottom: 1px solid #e0e0e0; }
.info-row:last-child { border-bottom: none; }
.info-label { font-weight: 600; background-color: #f5f5f5; padding: 20px; font-size: 4vw; color: #555; }
.info-content { padding: 20px; font-size: 4vw; color: #333; }
.company-low .inbox iframe {height: 400px;}

@media screen and (min-width: 768px) {
  .container { padding: 60px 40px; }
  .info-row { flex-direction: row; }
  .info-label { width: 200px; min-width: 200px; padding: 24px 30px; font-size: 2.8vw; }
  .info-content { flex: 1; padding: 24px 30px; font-size: 2.8vw; }
}

@media screen and (min-width: 1024px) {
  .container { padding: 80px 60px; }
  .info-label { width: 220px; min-width: 220px; padding: 28px 40px; font-size: 2vw;  }
  .info-content { padding: 28px 40px; font-size: 2vw; }
}

@media screen and (min-width: 1100px) {
  .info-label { width: 240px; min-width: 240px; font-size: 1.1vw; }
  .info-content { padding: 28px 40px; font-size: 1.1vw; }
}