/* Fonts */

@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400..700&family=Noto+Sans+JP:wght@100..900&display=swap');



/* Global Styles */



html {

    box-sizing: border-box;

}



*,

*::before,

*::after {

    box-sizing: border-box;

}



.clearfix:before,

.clearfix:after {

    content: "";

    display: table;

    clear: both;

}



.clearfix {

    clear: both;

    overflow: hidden;

}



.comp {

    color: #000;

    font-weight: bold;

}



.comingsoon {

    color: red;

    font-style: italic;

    font-weight: bold;

}



.col2 {

    -webkit-column-count: 2;

    -moz-column-count: 2;

    column-count: 2;

    -webkit-column-gap: 10px;

    -moz-column-gap: 10px;

    column-gap: 10px;

}



.col3 {

    -webkit-column-count: 3;

    -moz-column-count: 3;

    column-count: 3;

    -webkit-column-gap: 10px;

    -moz-column-gap: 10px;

    column-gap: 10px;

}



.col2 li,

.col3 li {

    display: inline-block;

    width: 100%;

}



/*preset*/

body.active{overflow: hidden;width:100%;height:100%;position:fixed!important;}

a{ text-decoration:none; -webkit-transition: all .3s linear;transition: all .3s linear;}

img{max-width: 100%; vertical-align: top; image-rendering: -webkit-optimize-contrast;}

textarea { resize:vertical; }

iframe{ border: none; width: 100%;}

ul, h1, h2, h3, h4{ margin:0; padding:0; list-style:none; }

strong , b{ font-weight: bold;}

em, i{font-style: italic;}

input[type="submit"]{cursor: pointer;}

a[href^="tel:"]{color: inherit!important; text-decoration: none;}



body.menu-open { overflow: hidden; position: fixed; width: 100%; height: 100%; }

body.active .mobile-menu-btn { opacity: 0; pointer-events: none; }

body:not(.active) .mobile-menu-btn { opacity: 1; }



/* Body */



body {

    background: var(--primary-bg);

    color: var(--primary-color);

    font-family: var(--font-noto-sans);

    font-size: var(--font-size);

    margin: 0;

    padding: 0;

    line-height: 1.2;

    color: #333;

    position: relative;

    width: 1920px;

    max-width: 100%;

    overflow-x: hidden;

    margin: 0 auto;

}



/* Wrapper */



.wrapper {

    max-width: 1400px;

    margin: 0 auto;

}



/* Button hover */



button:hover {opacity: 0.8;}





/* Text hover */



a:hover {opacity: 0.8;}





/* Breadcrumbs */



.breadcrumbs {

    font-size: 14px;

    color: #aaa;

    padding:10px;

    border-bottom: 1px solid rgba(0, 0, 0, 0.1);

    border-top: 1px solid rgba(0, 0, 0, 0.1);

}



.breadcrumbs nav {

    display: flex;

    align-items: center;

}



.breadcrumbs ul {

    list-style: none;

    display: flex;

    padding: 0;

    margin: 0;

    gap:40px;

}



.breadcrumbs ul li {

    display: inline-block;

    position: relative;

}



.breadcrumbs ul li:first-child {

    text-transform: uppercase;

}



.breadcrumbs ul li a {

    text-decoration: none;

    color: #aaa;

    transition: color 0.3s ease;

    position: relative;

}



.breadcrumbs ul li::after {

    content: "\02C3";

    font-size: 20px;

    color: #aaa;

    position: absolute;

    right: -25px;

    line-height: 1;

}



.breadcrumbs ul li:last-child::after {

    content: "";

    /* Remove separator for the last item */

}





/* PC and SP */

.pc-only {

    display: block;

}



.sp-only {display: none!important;}



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

    .pc-only {

        display: none!important;

    }



    .sp-only {

        display: block!important;

    }

}



