/*
Theme Name: kokocin2025
Theme URI: 
Author: 
Author URI: 
Description: 
Requires at least: 6.8
Tested up to: 6.8
Requires PHP: 5.7
Version: 0.0.5

Template: twentytwentyfive
Text Domain: kokocin2025
Tags: 
*/

:root{
--button-color: #00b900;
}


html{scroll-behavior: smooth;}

@font-face {
font-family:"Noto Sans JP";
font-style:normal;
font-weight:400;
src:local("Noto Sans JP"),url(./assets/fonts/NotoSansJP-Regular.woff2);

}
@font-face {
font-family:"Noto Sans JP";
font-style:normal;
font-weight:700;
src:local("Noto Sans JP"),url(./assets/fonts/NotoSansJP-Bold.woff2);
}


:where(.wp-site-blocks) > main{
line-height:1.65;}

:where(.wp-block-heading) {
font-feature-settings: "palt" 1;
}

/*--- global navigation -----------------*/ 

.pc-globalnavi .wp-block-navigation__submenu-container{
font-size:var(--wp--preset--font-size--small);
	min-width:240px !important;
}
 nav.pc-globalnavi > ul > li{
font-weight:bold;
letter-spacing: -.5px;
font-size:calc(var(--wp--preset--font-size--medium) * 0.95);
}
 nav.pc-globalnavi > ul > li ul >li{
font-weight:normal;
letter-spacing: 0;
}

.pc-globalnavi .wp-block-navigation .wp-block-navigation-item{
min-height:2.5rem;}

.pc-globalnavi .wp-block-navigation-item a{text-decoration:none;}

.pc-globalnavi .wp-block-navigation-item:hover > a{color:var(--wp--preset--color--accent-3);
}

.pc-globalnavi .wp-block-navigation-item a span:after {
    position: absolute;
    bottom: 3%;
    left: 0;
right:0;
    width: 0;
margin: 0 auto;
    height: 3px;
    background-color: #ff4f17;
    content: "";
    opacity: 1;
    -webkit-transition: all .25s ease-out;
    -moz-transition: all .25s ease-out;
    -ms-transition: all .25s ease-out;
    -o-transition: all .25s ease-out;
    transition: all .25s ease-out;
    }


.pc-globalnavi .wp-block-navigation-item:hover a > span:after {
    opacity: 1;
    width:100%;
}
.wp-block-navigation-submenu 
.wp-block-navigation-item a span:after {display:none;}

.wp-block-navigation-item:hover .wp-block-navigation__submenu-icon {color:var(--wp--preset--color--accent-3);}

.position-sticky{
position:sticky;
top: 0;
z-index: 10;}
.backdrop{
position: relative;}
.backdrop::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    backdrop-filter: blur(3px);
    z-index: -1;
}

.wp-block-navigation__responsive-container-close, .wp-block-navigation__responsive-container-open {
    background: #ff4f17;
    border: none;
    color: #eee;}



/*--- breadcrumbs -----------------*/ 

.breadcrumbs{
font-size: .75em;
}
.breadcrumbs a{
color:inherit;
text-decoration:none;}
.breadcrumbs a:hover {
text-decoration:underline;
}




/*--- main block -----------------*/ 

.wp-site-blocks main{
    border-top: 2px solid var(--wp--preset--color--accent-3);
    margin-top: 0;
}
.home main,.wp-site-blocks main.noheader{
border:none;
}
.relative{
position:relative !important;
}



/*--- element stylings -----------------*/ 

.heading-style--1::after{
	content: '';
	display: block;
	color: var(--wp--preset--color--accent-3);
    width: 5rem;
    max-width: 100%;
    height: 4px;
    margin-bottom: var(--wp--preset--spacing--40);margin-top: .8em;
    background: linear-gradient(90deg, currentcolor 4px, transparent 0) !important;
    background-size: 8px 1px !important;
}


main u,.highlight--yel {
    text-decoration: underline;
    text-decoration-thickness: 0.3em;
    text-decoration-color: rgb(255 238 0 / 70%);
    text-underline-offset: -0.12em;
    text-decoration-skip-ink: none;
}


a.button-xlarge {
    display: flex;
    container-type: inline-size;
    gap: 10px;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: var(--button-color);
    border: none;
    border-radius: min(2.3vw, 18px);
    height: auto;
    min-height: min(140px, 20vw);
    text-decoration: none;
    font-feature-settings: "palt";
    line-height: 1.1;
    padding: .5rem;
    margin-bottom: min(1.5vw, 10px);
    box-shadow: 0 min(1.5vw, 10px) 0
 color-mix(in srgb, var(--button-color) 70%, #000 30%);
    transition: .3s;
}
.button--linelogo img{width: min(10vw, 100px);}
.button--text {
    font-size: clamp(1.2rem, 6.65cqw, 42px);
    text-shadow: 1px 1px 0px 
 color-mix(in srgb, var(--button-color) 70%, #000 30%);
}
.button--arrow {
    display: block;
    content: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 -960 960 960" fill="%23ffffff"><path d="m380-300 280-180-280-180v360ZM480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Z"/></svg>');
width: min(7vw, 60px);
}


/*--- List ---*/

ul.list-good,ul.list-ban {
    list-style: none;
}

.list-good li,.list-ban li {
    padding-left: .5em;
    margin-bottom: .5em;
	position: relative;
}

.list-good li::before,.list-ban li::before{
	 position: absolute;
    width: 1.2em;
    left: -1.1em;
    top: .2em;
    display: block;
	
}

.list-good li::before {
    content: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 -960 960 960" fill="%2300b900"><path d="m380-300 280-180-280-180v360ZM480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Z"/></svg>');
}
.list-ban li::before {
    content: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 -960 960 960" fill="%23dc3545"><path d="M480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-80q54 0 104-17.5t92-50.5L228-676q-33 42-50.5 92T160-480q0 134 93 227t227 93Zm252-124q33-42 50.5-92T800-480q0-134-93-227t-227-93q-54 0-104 17.5T284-732l448 448Z"/></svg>');
}




.larger125{
    font-size:125%;
}

.larger150{
    font-size:150%;
}
.smaller{
    font-size: 75%;
}

.wb-keep {
    word-break: keep-all;
    overflow-wrap: break-word;
    overflow-wrap: anywhere;
    line-break: strict;
}


.icn-amz {
    display: inline-block;
    padding: 5px;
    padding-left: 30px;
    background: transparent url(./assets/images/icn-amazon.png) left center no-repeat;
	font-size:var(--wp--preset--font-size--small);
}
.icn-rkt {
    display: inline-block;
    padding: 5px;
    padding-left: 30px;
    background: transparent url(./assets/images/icn-rakuten.png) left center no-repeat;
	font-size:var(--wp--preset--font-size--small);
}

@media screen and (min-width: 769px) {
.mobile{display:none;}
}