@charset "UTF-8";
/*
Version: 2.7.1
Creation Date: 2024.2.7
Last Updated: 2025.1.9
*/


/* import
------------------------------------------------------------ */
@import "https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css";
@import "https://use.typekit.net/rlw6stg.css";

@font-face {
font-family: "Kinto Sans Light;
src: url(https://w-shiya.com/release/font/KintoSans/KintoSans-Light.woff);
}
@font-face {
font-family: "Kinto Sans Regular";
src: url(https://w-shiya.com/release/font/KintoSans/KintoSans-Regular.woff);
}
@font-face {
font-family: "Kinto Sans Medium";
src: url(https://w-shiya.com/release/font/KintoSans/KintoSans-Medium.woff);
}
@font-face {
font-family: "Kinto Sans Bold";
src: url(https://w-shiya.com/release/font/KintoSans/KintoSans-Bold.woff);
}
@font-face {
font-family: "Kinto Sans Black";
src: url(https://w-shiya.com/release/font/KintoSans/KintoSans-Black.woff);
}


/* Overwrite
------------------------------------------------------------ */
.header {
position: fixed;
}
.spnav,
.spsubnav,
.gnav__subitem__table td a {
text-align: left;
}
.access {
padding: 0;
}
.access .accessSection {
width: 100%;
margin: 0 auto;
}
.access__table {
table-layout: auto;
}
.share__icon {
margin: 0;
}


/* set
------------------------------------------------------------ */
* {
margin: 0;
padding: 0;
font-style: normal;
box-sizing: border-box;
}
html {
overflow-y: scroll;
}
body {
-webkit-text-size-adjust: 100%;
font-family: ryo-gothic-plusn, sans-serif;
color: #000;
font-size: 18px;
font-weight: 500;
line-height: 1.5;
text-align: center;
}
ul {
list-style: none;
}
img {
vertical-align: middle;
max-width: 100%;
height: auto;
}
video,iframe {
vertical-align: bottom;
width: 100%;
max-width: 100%;
max-height: 100%;
border: none;
}
a {
color: inherit;
text-decoration: none;
}
.opa a:hover img {
opacity: .7;
}
:hover {
transition: .3s;
}
.smd,.smp {
display: none;
}
.pc {
display: block;
}


/* common
------------------------------------------------------------ */
/* font */
.EN {  /* Poster Gothic Cond ATF Bold */
font-family: poster-gothic-cond-atf, sans-serif;
font-weight: 600;
letter-spacing: .1em;
}
.KSL { /* Kinto Sans Light */
font-family: "Kinto Sans Light", sans-serif;
}
.KSR { /* Kinto Sans Regular */
font-family: "Kinto Sans Regular", sans-serif;
}
.KSM { /* Kinto Sans Medium */
font-family: "Kinto Sans Medium", sans-serif;
}
.KSB { /* Kinto Sans Bold */
font-family: "Kinto Sans Bold", sans-serif;
}
.KSBK { /* Kinto Sans Black */
font-family: "Kinto Sans Black", sans-serif;
}

/* layout */
main {
width: 100%;
margin-top: 120px;
display: block;
overflow: hidden;
}
article {
width: 100%;
position: relative;
}
section {
width: 1080px;
max-width: 90%;
margin: 0 auto;
padding: 100px 0;
}
section.wide {
width: 1100px;
}

/* background */
.bg_blu {
background: #004098;
color: #FFF;
}

/* style */
h2 {
margin-bottom: 60px;
}
h3 {
margin-top: 30px;
}
small {
font-size: 70%;
line-height: 1.3;
margin-top: 10px;
display: block;
}
.center {
text-align: center !important;
}
.left {
text-align: left;
}
.right {
text-align: right;
}
figcaption {
text-align: left;
padding-top: 10px;
}
.vwmax img {
width: 100vw;
}

/* .flex */
.flex {
display: flex;
}
.col-2,
.col-3,
.col-4 {
flex-wrap: wrap;
justify-content: space-between;
}
.item {
margin-bottom: 40px;
}
.col-2 .item {flex-basis: 48%;}
.col-3 .item {flex-basis: 31%;}
.col-4 .item {flex-basis: 21%;}
.col-3:after {
content: "";
width: 31%;
height: 0;
display: block;
}
.col-4:before,
.col-4:after {
content: "";
width: 23%;
height: 0;
display: block;
}
.col-4:before {
order: 1;
}

/* .link */
.link {
text-align: center;
margin: 40px auto 0;
}
.link a {
_background: #004098;
background: #00050f;
color: #FFF;
font-size: 26px;
font-weight: 700;
line-height: 68px;
width: 100%;
height: 68px;
display: inline-block;
position: relative;
z-index: 1;
padding-right: 1em;
}
.link a:after {
content: "";
border-top: solid 3px #FFF;
border-right: solid 3px #FFF;
border-bottom: transparent;
border-left: transparent;
position: absolute;
width: 16px;
height: 16px;
top: 50%;
right: 30px;
transform: translate(0,-50%) rotate(45deg);
}
.link a:hover {
opacity: .7;
}

/* .swiper*/
.swiper-button-prev,
.swiper-button-next {
top:calc( 50% - 25px);
color: #002b81;
}

div.swiper {
max-width: 1000px;
}
.container {
position: relative;
}
.container .swiper-button-prev {
left: 0;
}
.container .swiper-button-next {
right: 0;
}

#concept .swiper-wrapper{
transition-timing-function: linear;
}

/* main
------------------------------------------------------------ */
article#movie {
position: relative;
width: 100%;
padding-top: 56.25%;
height: 0;
}
#movie iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

/* #concept */
#concept {
background: #00050f;
}
#concept::before {
content: "";
background: url("img/concept_bg.png") no-repeat center bottom/cover;
width: 100%;
height: 105%;
position: absolute;
top: 0;
left: 0;
}
#concept section {
position: relative;
width: 100vw;
max-width: 1440px;
padding: 80px 0 100px;
}
#concept section .concept_txt {
width: 1080px;
margin: 0 auto 140px;
text-align: left;
}
#concept section .concept_txt h2 {
margin-bottom: 40px;
}
#concept section .concept_txt h3 {
margin-bottom: 20px;
}
#concept section .concept_txt p {
font-size: 24px;
line-height: 1.6em;
letter-spacing: 0.01em;
}
#concept section .concept_txt p.fadeInUp50 + .fadeInUp50 {
margin-top: .8em;
}
#concept section .swiper {
width: 100%;
max-width: 1080px;
}

/* .design */
#design {
background:url("img/bg_emblem2.png") no-repeat,
url("img/line_lb.png") no-repeat,
url("img/bg_fog_ltw.png") no-repeat,
url("img/bg_fog_rbw.png") no-repeat,
#e9e7e6;
background-size:380px 490px,220px 880px,720px 400px,420px 300px;
background-position: right -40px, calc(100% - 60px ) bottom, left top, right bottom;
}
#design section {
padding: 0px 128px 100px;
width: 100vw;
max-width: 1336px;
background:url("img/line_b.png") no-repeat 0px top;
background-size: 88px 180px;
}
#design section h2 {
margin: 0px 20px 80px 0px;
padding-top: 66px;
text-align: left;
}

.design ul.col-2 {
max-width: 1080px;
margin: 0px auto 60px;
}
.design .item {
flex-basis: calc( 50% - 20px );
padding: 40px 0 0 0;
}
.design .item h3 {
display: block;
text-align: left;
margin: 0 0 50px 0px;
}
.design p {
display: block;
text-align: left;
margin: 0 0 30px 25px;
}
#design .item .uniform {
text-align: center;
}

#gk-design {
background:url("img/bg_emblem2.png") no-repeat,
url("img/line_lb.png") no-repeat,
url("img/bg_fog_ltb.png") no-repeat,
url("img/bg_fog_rbb.png") no-repeat,
#ffffff;
background-size:380px 490px,220px 880px,720px 360px,540px 270px;
background-position: right -40px, calc(100% - 60px ) bottom, left top, right bottom;
}
#gk-design section {
padding: 0px 128px 100px;
width: 100vw;
max-width: 1336px;
background:url("img/line_b.png") no-repeat 0px top;
background-size: 88px 180px;
}
#gk-design section h2 {
margin: 0px 20px 80px 0px;
padding-top: 88px;
text-align: left;
}

#number {
background:url("img/bg_fog_ltb.png") no-repeat,
url("img/bg_fog_rbb.png") no-repeat,
#ffffff;
background-size:720px 360px,540px 270px;
background-position:left top, right bottom;
}
#number section {
padding: 0px 128px 100px;
width: 100vw;
max-width: 1336px;
background:url("img/line_b.png") no-repeat 0px top;
background-size: 88px 180px;
}
#number section h2 {
margin: 0px 20px 80px 0px;
padding-top: 126px;
text-align: left;
}
#number .fadeInUp100 {
margin-top: 30px;
}

/* #size */
#size {
background: url("img/bg_fog_ltk.jpg") no-repeat,url("img/bg_fog_rbk.jpg") no-repeat,#00050f;
background-size: 640px 320px,640px 240px;
background-position: left top, right bottom;
}
#size section {
padding: 0px 128px 100px;
width: 100vw;
max-width: 1336px;
background:url("img/line_w.png") no-repeat 0px top;
background-size: 88px 180px;
}
#size section h2 {
margin: 0px auto 100px;
padding-top: 128px;
}

#size .flex {
align-items: center;
}
#size .fadeInUp50 {
flex-basis: 42%;
margin-bottom: 4vw;
}
#size .fadeInUp100 {
flex-basis: 55%;
margin-bottom: 4vw;
}

/* #products */
#products {
background:url("img/bg_emblem2.png") no-repeat,
url("img/line_lb.png") no-repeat,
url("img/bg_fog_ltb.png") no-repeat,
url("img/bg_fog_rbb.png") no-repeat,
#ffffff;
background-size:380px 490px,220px 880px,720px 360px,540px 270px;
background-position: right -40px, calc(100% - 60px ) bottom, left top, right bottom;
}
#products section {
padding: 0px 128px 100px;
width: 100vw;
max-width: 1336px;
background:url("img/line_b.png") no-repeat 0px top;
background-size: 88px 180px;
}
#products section h2 {
margin: 0px 20px 120px 0px;
padding-top: 66px;
text-align: left;
}
#products section p.text {
width: 840px;
margin: 0 auto 140px;
text-align: left;
font-size: 24px;
line-height: 2em;
letter-spacing: 0.01em;
}

#products ul.products {
border-top: 1px solid #a69535;
}
#products .flex {
align-items: center;
text-align: left;
padding: 80px 0 40px 0;
border-bottom: 1px solid #a69535;
}
#products .flex:nth-last-of-type(1) {
border-bottom:none;
}
#products .item:first-child {
flex-basis: 46%;
}
#products .item:last-child {
flex-basis: 52%;
}
#products .flex h3 {
font-size: 40px;
font-size: 39px;
font-weight: 700;
margin-bottom: 20px;
}
#products .flex table {}
#products .flex table th {
font-size: 20px;
font-weight: 700;
padding-right: 4em;
}
#products .flex table th + td {
font-size: 36px;
font-weight: 700;
}
#products .flex table td {
font-size: 16px;
}
#products .flex p {
font-size: 14px;
font-weight: 400;
margin-top: 20px;
}
#products .ls_item {
margin: 0 auto;
}
#products .ls_item h3 {
text-align: center;
margin-bottom: 60px;
}
#products .ls_item ul {
display: flex;
width: 860px;
margin: 0 auto 40px;
}
#products .ls_item ul li {
margin: 0 0 40px 0;
}
#products .ls_item table {
margin: 0px auto;
}
#products .ls_item p {
max-width: 580px;
margin: 20px auto;
padding-left: 54px;
}
#products .ls_item .link {
max-width: 520px;
}

/* #sponsor */
#sponsor {
background:
url("img/bg_fog_ltw.png") no-repeat,
url("img/bg_fog_rbw.png") no-repeat,
#e9e7e6;
background-size:720px 400px,420px 300px;
background-position: left top, right bottom;
}
#sponsor section {
padding: 0px 128px 100px;
width: 100vw;
max-width: 1336px;
background:url("img/line_b.png") no-repeat 0px top;
background-size: 88px 180px;
}
#sponsor section h2 {
margin: 0px 20px 80px 0px;
padding-top: 126px;
text-align: left;
}

#sponsor ul li img {
transition: 1s;
}
#sponsor ul li:hover img {
transition: 1s;
transform: scale(1.2);
}
#sponsor .col-3 {
justify-content: center;
}
#sponsor .col-3 .item {
justify-content: center;
flex-basis: 21%;
margin: 0 3%;
}
#sponsor .col-3:after {
display: none;
}


/* footer
------------------------------------------------------------ */
footer {
background: #000;
}
footer section {
padding: 3rem 0;
}
footer h1 {
width: 188px;
margin: 0 auto 3rem;
}
footer p {
color: #FFF;
font-size: 1.2rem;
line-height: 1.3;
}
footer p + p {
font-size: 1.1rem;
margin-top: 1rem;
}

/* #sns */
#sns {
background: #FFF;
}

/* #pagetop */
#pagetop {
display: none;
position: fixed;
right: 1rem;
bottom: 1rem;
z-index: 4;
}
#pagetop a {
background: #004098;
color: #FFF;
width: 60px;
height: 60px;
border-radius: 50%;
display: block;
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
position: relative;
}
#pagetop a::before {
content: "";
width: 20px;
height: 20px;
margin: 0 auto;
display: block;
border-top: 2px solid #FFF;
border-right: 2px solid #FFF;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
position: absolute;
top: 25px;
right: 20px;
}


@media screen and (max-width: 768px) {

/* set
------------------------------------------------------------ */
body {
font-size: 14px;
line-height: 1.4;
}
.pc {
display: none;
}
.smd {
display: block;
}

/* common
------------------------------------------------------------ */
/* layout */
main {
margin-top: 60px;
}
section {
padding: 50px 0;
}

/* .link */
.link a {
font-size: 18px;
line-height: 50px;
width: 260px;
height: 50px;
}
.link a:after {
content: "";
border-top: solid 2px #FFF;
border-right: solid 2px #FFF;
border-bottom: transparent;
border-left: transparent;
position: absolute;
width: 12px;
height: 12px;
top: 50%;
right: 20px;
transform: translate(0,-50%) rotate(45deg);
}

/* main
------------------------------------------------------------ */
#concept section {
padding: 8vw 0;
}
#concept section .concept_txt {
width: 90%;
}
#concept section .concept_txt h2 {
width: 80%;
}
#concept section .concept_txt h2 img {
width: 100%;
height: auto;
}
#concept section .concept_txt p {
font-size: 14px;
}
#concept section .swiper {
width: 90%;
}

/* .design */
#design {
background:url("img/bg_emblem2.png") no-repeat,
url("img/line_lb.png") no-repeat,
url("img/bg_fog_ltw.png") no-repeat,
url("img/bg_fog_rbw.png") no-repeat,
#e9e7e6;
background-size: 32% auto, 16% auto, 60% auto,40% auto;
background-position: right -4vw, calc(100% - 4% ) bottom, left top, right bottom;
}
#design section {
padding: 0 0 5vw 0;
background:url("img/line_b.png") no-repeat 2% top;
background-size: 8% auto;
}
#design section h2 {
margin: 0px 0px 0vw 12vw;
padding-top: 4.5vw;
text-align: left;
}
#design section h2 img {
width: auto;
height: 12vw;
}
.design ul.col-2 {
width: 90vw;
margin: 0px auto 0vw;
}
.design .item {
flex-basis: calc( 50% - 2vw );
padding: 40px 0 0 0;
}
.design .item h3 {
display: block;
text-align: left;
margin: 0 1vw 4vw 0;
}
.design .item h3 img {
width: auto;
height: 8vw;
}
.design p {
display: block;
text-align: left;
margin: 0 0 2vw 0px;
}
.design .swiper {
width: 90vw;
}
.design .swiper-button-prev,
.design .swiper-button-next {
display: none;
}
.design .swiper p {
font-size: 14px;
text-align: center;
margin: 3px auto;
}

#gk-design {
background:url("img/bg_emblem2.png") no-repeat,
url("img/line_lb.png") no-repeat,
url("img/bg_fog_ltb.png") no-repeat,
url("img/bg_fog_rbb.png") no-repeat,
#ffffff;
background-size: 32% auto, 16% auto, 60% auto,40% auto;
background-position: right -4vw, calc(100% - 4% ) bottom, left top, right bottom;
}
#gk-design section {
padding: 0 0 5vw 0;
background:url("img/line_b.png") no-repeat 2% top;
background-size: 8% auto;
}
#gk-design section h2 {
margin: 0px 0px 0vw 12vw;
padding-top: 4.5vw;
text-align: left;
}
#gk-design section h2 img {
width: auto;
height: 12vw;
}

#number {
background:url("img/bg_fog_ltb.png") no-repeat,
url("img/bg_fog_rbb.png") no-repeat,
#ffffff;
background-size: 60% auto,40% auto;
background-position: left top, right bottom;
}
#number section {
padding: 0 0 5vw 0;
background:url("img/line_b.png") no-repeat 2% top;
background-size: 8% auto;
}
#number section h2 {
margin: 0px 0px 8vw 12vw;
padding-top: 11vw;
text-align: left;
}
#number section h2 img {
width: auto;
height: 5vw;
}
#number section div {
width: 84vw;
margin: 0 auto 4vw;
}

/* #size */
#size {
background: url("img/bg_fog_ltk.jpg") no-repeat,url("img/bg_fog_rbk.jpg") no-repeat,#00050f;
background-size: 50% auto,50% auto;
background-position: left top, right bottom;
}
#size section {
padding: 0 0 5vw 0;
background:url("img/line_w.png") no-repeat 2% top;
background-size: 8% auto;
}
#size section h2 {
margin: 0px 0px 8vw 0vw;
padding-top: 11vw;
}
#size section h2 img {
width: auto;
height: 5vw;
}
#size .flex {
width: 90vw;
margin: 0 auto 4vw;
}

/* #products */
#products {
background:url("img/bg_emblem2.png") no-repeat,
url("img/line_lb.png") no-repeat,
url("img/bg_fog_ltb.png") no-repeat,
url("img/bg_fog_rbb.png") no-repeat,
#ffffff;
background-size: 32% auto, 16% auto, 60% auto,40% auto;
background-position: right -4vw, calc(100% - 4% ) bottom, left top, right bottom;
}
#products section {
padding: 0 0 5vw 0;
background:url("img/line_b.png") no-repeat 2% top;
background-size: 8% auto;
}
#products section h2 {
margin: 0 0 6vw 12vw;
padding-top: 4.5vw;
text-align: left;
}
#products section h2 img {
width: auto;
height: 12vw;
}
#products section p.text {
width: 90%;
margin: 0 auto 4vw;
font-size: 14px;
}

#products .flex {
padding: 4vw 0 2vw 0;
width: 94%;
margin: 0 auto;
}
#products .item:first-child {
flex-basis: 46%;
}
#products .item:last-child {
flex-basis: 52%;
}
#products .flex h3 {
font-size: 20px;
padding-right: 0em;
}
#products .flex table th {
font-size: 12px;
padding-right: 0em;
}
#products .flex table th + td {
font-size: 20px;
}
#products .flex table td {
font-size: 12px;
}
#products .flex p {
font-size: 12px;
}

#products .ls_item h3 {
margin-bottom: 4vw;
}
#products .ls_item ul {
width: 94%;
margin: 0 auto;
}
#products .ls_item ul li {
margin: 0 0 4vw 0;
width: calc( 50% );
}
#products .ls_item ul li img {
width: 100%;
height: auto;
}
#products .ls_item table {
margin: 0px auto;
}
#products .ls_item p {
margin: 2vw auto;
padding-left: 0px;
text-align: center;
}

/* #sponsor */
#sponsor {
background:url("img/bg_fog_ltw.png") no-repeat,
url("img/bg_fog_rbw.png") no-repeat,
#e9e7e6;
background-size: 60% auto,40% auto;
background-position: left top, right bottom;
}
#sponsor section {
padding: 0 0 5vw 0;
background:url("img/line_b.png") no-repeat 2% top;
background-size: 8% auto;
}
#sponsor section h2 {
margin: 0px 0px 8vw 12vw;
padding-top: 11vw;
text-align: left;
}
#sponsor section h2 img {
width: auto;
height: 5vw;
}
#sponsor section ul {
width: 90%;
margin: 0 auto;
}
.item {
margin-bottom: 4vw;
}
#sponsor .col-4 .item {
flex-basis: 48%;
}

}

@media screen and (max-width: 430px) {

/* set
------------------------------------------------------------ */
.smd {
display: none;
}
.smp {
display: block;
}
br.smp {
font-size: 0;
}

/* common
------------------------------------------------------------ */
/* .flex */
.col-2 {display: block;}
.col-3 .item {flex-basis: 48%;}
.col-3:after,
.col-4:before,
.col-4:after {
display: none;
}

/* .swiper*/
.container .swiper-button-prev {
left: -15px;
}
.container .swiper-button-next {
right: -15px;
}

/* main
------------------------------------------------------------ */
#concept::before {
width: 130%;
height: 110%;
left: auto;
right: -30%;
}
#concept section .concept_txt h2 {
margin-bottom: 20px;
}
#concept section .concept_txt h3 {
margin: 10px 0;
}
#concept section .concept_txt h3 img {
width: auto;
height: 20px;
}
#concept section .concept_txt p {
font-size: 11px;
line-height: 1.4;
}
/* .design */
#design section h2,
#gk-design section h2 {
margin: 0px 0px 8vw 12vw;
}
.design .smp {
width: calc( 90% );
margin: 0 auto;
padding: 0px;
}
.design .smp h3 {
display: block;
text-align: left;
margin: 3vw 1vw 4vw 0;
}
.design .smp h3 img {
width: auto;
height: 12vw;
}
.design .smp p {
display: block;
text-align: left;
padding: 1vw;
margin: 0 0 2vw 0px;
}
.design ul.col-2,
.design ul.col-2 + .container {
display: none;
}
.design .container {
margin-top: 30px;
}
.design .swiper {
margin-bottom: 8vw
}
.design .swiper p {
font-size: 10px;
text-align: center;
}

#products .flex {
padding: 4vw 0 2vw 0;
width: 90%;
margin: 0 auto;
}
#products .flex h3 {
font-size: 26px;
font-size: 25px;
text-align: center;
}
#products .flex table th {
font-size: 16px;
}
#products .flex table th + td {
font-size: 24px;
}
#products .flex table td {
font-size: 14px;
}
#products .flex p {
font-size: 11px;
}
/* #size */
#size .fadeInUp50 {
max-width: 70%;
margin: 0 auto 20px;
}
#size .fadeInUp100 {
max-width: 90%;
margin: 0 auto 20px;
}

/* #sponsor */
#sponsor .col-3 {
justify-content: space-between;
}
#sponsor .col-3 .item {
flex-basis: 48%;
margin: 0 0 40px;
}

/* footer
------------------------------------------------------------ */
/* #pagetop */
#pagetop a {
width: 40px;
height: 40px;
}
#pagetop a::before {
width: 15px;
height: 15px;
top: 15px;
right: 12px;
}

}