@charset "UTF-8";
/*
CSS Document
Theme Name: trippen AW25/26 theme 1.0
Description: trippen AW25/26
Author: KANETOMI
Date: 2025.08.01
Break Point: 767px, 1023px
Aspect Ratio: 16:9, 2:3
*/

/*--------------------------------------------------------------

 Reset

--------------------------------------------------------------*/

html, 
body, 
div, 
span, 
applet, 
object, 
iframe,
h1, 
h2, 
h3, 
h4, 
h5, 
h6, 
p, 
blockquote, 
pre,
a, 
abbr, 
acronym, 
address, 
big, 
cite, 
code,
del, 
dfn, 
em, 
font, 
ins, 
kbd, 
q, 
s, 
samp,
small, 
strike, 
strong, 
sub, 
sup, 
tt, 
var,
dl, 
dt, 
dd, 
ol, 
ul, 
li,
fieldset, 
form, 
label, 
legend,
table, 
caption, 
tbody, 
tfoot, 
thead, 
tr, 
th, 
td,
article, 
aside, 
canvas, 
details, 
figcaption, 
figure,
footer, 
header, 
hgroup, 
menu, 
nav, 
section, 
summary,
time, 
mark, 
audio, 
video,
input {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}

:focus {
	outline: 0;
}

body {
	background: #fff;
	line-height: 1;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
	content: "";
}

blockquote,
q {
	quotes: "" "";
}

input,
textarea {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -webkit-appearance: none;
	appearance: none;
    max-width: 100%;
}


/*--------------------------------------------------------------

 1.0 Initial settings

--------------------------------------------------------------*/

* {
	box-sizing: border-box;
}

html {
	font-size: 62.5%;
	-webkit-overflow-scrolling: touch;
}

body {
	height: 100%;
	background: #fff;
	color: #000;
	/* font-family: "Source Sans Pro", sans-serif, Arial, sans-serif, "Hiragino Kaku Gothic Pro"; */
	font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "Lucida Grande", Helvetica, Arial, Verdana, sans-serif;
	/* font-family: "Futura LT Book", sans-serif; */
	font-size: 1.4em;
	line-height: 1.8;
	font-synthesis: none;
	-webkit-font-smoothing: antialiased;
	-webkit-text-size-adjust: 100%;
	line-break: strict;
}


/* Sections ------------------------------------------------- */

h1,
h2,
h3,
h4,
h5,
h6 {
	text-align: center;
}


/* Text-level semantics ------------------------------------- */

a {
	cursor: pointer;
	color: #000;
	text-decoration: none;
}

a:hover {
	cursor: pointer;
	/* opacity: 0.6; */
	text-decoration: underline;
}


/* Embedded content ----------------------------------------- */

img {
	width: 100%;
	max-width: 100%;
	border: 0;
	vertical-align: bottom;
	-ms-interpolation-mode: bicubic;
}

iframe {
    vertical-align: bottom;
}


/* Table ---------------------------------------------------- */

table {
	width: 100%;
    border: solid 1px #000;
	border-collapse: collapse;
}

tr {
	border-bottom: solid 1px #000;
}

td,
th {
	padding: 10px;
	border: solid 1px #000;
	font-size: 1.2rem;
	text-align: center;
}



/*--------------------------------------------------------------

 2.0 Form

--------------------------------------------------------------*/


input, textarea, select {
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    margin: 0;
    padding: 0;
    border: none;
    border-radius: 0;
	background: none;
    font-size: 1.4rem;
    line-height: 1.8;
    box-sizing: border-box;
}

input[type="text"],
input[type="email"] {
    appearance: textfield;
    -moz-appearance: textfield;
    -webkit-appearance: textfield;
    width: 100%;
    padding: 9px 10px !important;
    border: solid 1px #000;
}

input[type="radio"] {
    appearance: radio;
    -moz-appearance: radio;
    -webkit-appearance: radio;
    cursor: pointer;
	
	border-radius: 50%;
}

input[type="checkbox"] {
    appearance: checkbox;
    -moz-appearance: checkbox;
    -webkit-appearance: checkbox;
    cursor: pointer;
	
	border-radius: 50%;
}

input[type="submit"] {
    width: 100%;
    padding: 9px 10px;
    border: solid 1px #000;
    cursor: pointer;
}

select {
    width: 100%;
    padding: 9px 10px;
    border: solid 1px #000;
    cursor: pointer;
}

select::-ms-expand {
    display: none;
}

textarea {
    display:block;
    width: 100%;
    padding: 9px 10px;
    border: solid 1px #000;
}

.form-radio,
.form-checkbox {
    width: 100%;
    padding: 9px 10px;
    border: solid 1px #000;
}

.form-radio label,
.form-checkbox label {
    cursor: pointer;
}

.form-select {
	position: relative;
}

.form-select::before {
	position: absolute;
	top: 18.5px;
	right: 10px;
	width: 0;
	height: 0;
	content: '';
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 6px solid #000;
	pointer-events: none;
}



/*--------------------------------------------------------------

 3.0 Common class

--------------------------------------------------------------*/


:root {
	--margin-top: 43px;
	--margin-bottom: 43px;
    --color-grey: #c8c8c8;
}


/* Wrap ----------------------------------------------------- */

#wrap {
	width: 100%;
	padding-top: 50px;
}

#main {
	width: 100%;
	margin-top: var(--margin-top);
}

#main * {
	/* transition: 0.3s ease-in-out;c*/	
}

#main a {
	display: block;
}


/* Font style ----------------------------------------------- */

.emphasize {
	font-weight: bolder;
}

.notice {
	color: #B10700;
}

.currently {
	text-decoration: underline;
}


/* Character ------------------------------------------------ */

.screen-reader-text {
	display: none !important;
}


/* Contents ------------------------------------------------- */

.contents .content {
	/*　border-right: solid 1px #000;　*/
	/*　border-bottom: solid 1px #000;　*/
	/*　border-left: solid 1px #000;　*/
}

.contents .content:first-child {
	/*　border-top: solid 1px #000;　*/
}

.contents .content h1 a {
	display: block;
    width: 100%;
    padding: 20px 15px;
	border-bottom: solid 1px #000;
}

@media all and (max-width:767px) {
	
	.contents {
		/* padding: 0 5%; */
	}
	
}

@media all and (min-width:768px) and (max-width:1365px) {
	
	.contents {
        width: 100%;
		padding: 0 10%;
	}
	
}

@media all and (min-width:1366px) {
	
	.contents {
		width: 1091px;
		margin-right: auto;
		margin-left: auto;
	}
	
}


/* Contents foot -------------------------------------------- */

#contents-foot {
	width: 100%;
	margin-top: var( --margin-top );
	text-align: center;
}

.contents-foot-inner {
	display: inline-block;
	border: solid 1px #000;
}

.contents-foot-inner a {
    display: block;
    width: 100%;
    padding: 8px 15px;	
}


/* Column --------------------------------------------------- */

.variable-two-columns {
	display: table;
	table-layout: fixed;
	width: 100%;
}

.variable-two-columns > div {
	display: table-cell;
	width: 50%;
	vertical-align: top;
}

/* .variable-two-columns {
	display: flex;
	flex-flow: row wrap;
	width: 100%;
}

.variable-two-columns > div {
	display: inline-block;
	width: calc( 100% / 2 );
	word-wrap: break-word;
} */

@media all and (max-width:767px) {
	
	.variable-two-columns {
		display: block;
	}
	
	.variable-two-columns > div {
        display: block;
        width: 100%;
    }
	
}

.variable-four-columns {
	display: flex;
	flex-flow: row wrap;
	width: 100%;
}

.variable-four-columns > div {
	display: inline-block;
	width: calc( 100% / 4 );
	word-wrap: break-word;
}

@media all and (max-width:767px) {
	
	.variable-four-columns > div {
        width: calc( 100% / 2 );
	}
	
}

@media all and (min-width:768px) and (max-width:1024px) {
	
	.variable-four-columns > div {
        width: calc( 100% / 3 );
	}
	
}


/* Iframe wrap ---------------------------------------------- */

.iframe-wrap {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
    overflow: auto; 
    -webkit-overflow-scrolling: touch;
    /* border: 2px solid #ccc; */
}

.iframe-wrap iframe {
    position:absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
    display: block;
}


/* List ----------------------------------------------------- */

ul {
	overflow: hidden;
}

ul {
	list-style-type: none;
}

ul.lists li a {
	padding: 20px 15px;
	border-top: solid 1px #000;
}

ul.lists li:first-child a {
	border-top: none;
}


/* List item ------------------------------------------------ */

.list-item {
	width: 100%;
	padding: 15%;
}

.list-item .list-item-inner {
    width: 100% ;
    padding-top: 100% ;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: bottom center;
}

.back-ordering {
	position: relative;
}

.back-ordering > div {
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate( -50%, -50% );
	display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
	width: 100%;
	height: 100%;
    margin: auto;
    text-align: center;
    background: rgba(255,255,255,0.8);
}


/* Submenu -------------------------------------------------- */

.submenu {
	margin: 5px 0 0 0;
	padding: 9px 0;
	border-top: solid 1px #000;
	border-bottom: solid 1px #000;
	text-align: center;
}

.submenu .options {
    display: block;
}

.submenu li {
	display: inline-block;
	margin: 0 7.5px;
}

.submenu li.separator:before {
	content:"|";
	color: var( --color-grey );
}

.submenu > li:first-child {
    display: none;
}

@media all and (max-width:767px) {
	
	.submenu {
        margin: 5px 0;
        padding: 0;
	}
	
	.submenu li {
		display: block;
		margin: 0;
		text-align: left;
	}
	
	.submenu li.separator:before {
		content: "";
	}
	
	.submenu > li:first-child {
        display: block;
    }
	
	.submenu li a {
		padding: 12px 5%;
	}
	
	.submenu li a.has-options {
        position: relative;
    }
	
	.submenu li a.add-arrow:after {
        content: "\e900";
        font-family:'trippen-jp';
        position: absolute;
        top: 0;
        right: 0;
        display: block;
        padding: 8.5px 5%;
        font-size: 1.8rem;
        vertical-align: middle;
        background-size: contain;
        transition: transform 0.3s;
    }

    .submenu li a.rotate:after {
        transform: rotate(180deg);				
    }
	
	.submenu .options {
		display: none;
	}
	
	.submenu .options li a {
		border-top: solid 1px var( --color-grey );
	}
	
}


/* Horizontal-lists ----------------------------------------- */

.horizontal-lists {
	margin: 0 auto;
	padding: 9px 0;
	border-bottom: solid 1px #000;
    width: 100%; 
    overflow-x: auto;
    white-space: nowrap;
    overflow-scrolling: touch;
    -webkit-overflow-scrolling: touch;
}

.horizontal-lists::-webkit-scrollbar {
    height: 4px;
}

.horizontal-lists::-webkit-scrollbar-track {
    background: #eee;
}

.horizontal-lists::-webkit-scrollbar-thumb {
    background: #000;
    border: none;
}

.horizontal-lists li {
	display: inline-block;
	margin: 0 7.5px;
}


/* Navigation ----------------------------------------------- */

@media all and (max-width:767px) {

	.nav ul.toplevel > li:first-child a {
        border-top: solid 1px #000;
    }

    .nav ul.toplevel li a.has-children {
        position: relative;
    }

    .nav ul.toplevel li a.add-arrow:after {
        content: "\e900";
        font-family:'trippen-jp';
        position: absolute;
        top: 0;
        right: 0;
        display: block;
        padding: 8.5px 5%;
        font-size: 1.8rem;
        vertical-align: middle;
        background-size: contain;
        transition: transform 0.3s;
    }

    .nav ul.toplevel li a.rotate:after {
        transform: rotate(180deg);				
    }
	
    .nav ul.toplevel li ul.children {
        display: none;
    }

    .nav ul.toplevel li ul.children a {
        padding-left: 7.5% !important;
    }

    .nav ul.toplevel li ul.children ul.children a {
        padding-left: 10% !important;
    }
	
}


/* Simple pagenation ---------------------------------------- */

.pagenation {
	display: flex;
	margin-top: var(--margin-top);
	border-top: solid 1px #000;
	border-bottom: solid 1px #000;
	width: 100%;
	height: 45px;
}

.pagenation .pagenation-prev,
.pagenation .pagenation-prev-passive,
.pagenation .pagenation-next,
.pagenation .pagenation-next-passive {
	width: 47.5%;
	position: relative;
}

.pagenation .pagenation-prev,
.pagenation .pagenation-prev-passive {
	margin-right: 2.5%;
}

.pagenation .pagenation-next,
.pagenation .pagenation-next-passive {
	margin-left: 2.5%;
}

.pagenation .pagenation-prev a,
.pagenation .pagenation-next a {
	display: block;
	width : calc( 100% - 25px );
}

.pagenation .pagenation-prev a {
	padding-left: 25px;
}

.pagenation .pagenation-next a {
	text-align: right;
}

.pagenation .pagenation-prev a p,
.pagenation .pagenation-next a p {
	height: 100%;
	line-height: 43px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pagenation-prev p:before {
	content: "\e901";
    font-family:'trippen-jp';
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    font-size: 1.8rem;
    vertical-align: middle;
    background-size: contain;
}	

.pagenation-next p:after {
	content: "\e902";
    font-family:'trippen-jp';
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    font-size: 1.8rem;
    vertical-align: middle;
    background-size: contain;
}

@media all and (max-width:767px) {
	
	.pagenation {
		padding: 0 4.8%;
	}
	
}


/* Load more ---------------------------------------------- */

.load-more {
	display: none;
	max-width: 540px;
	margin-top: 30px;
	margin-right: auto;
	margin-left: auto;
}

.load-more-button {
	display: inline-block !important;
    padding: 8px 15px;
	border: solid 1px #000;
}

@media all and (max-width:767px) {
	
	.load-more-button {
		width: 100%;
	}
	
}


/* Fixed ratio ---------------------------------------------- */

.fixed-ratio-3-4 {
	width: 100%;
}

.fixed-ratio-3-4 .fixed-ratio-3-4-inner {
	width: 100% ;
    padding-top: 66.6666% ;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}


/* Hidden contents ------------------------------------------ */

.has-hidden-contents > a {
	position: relative;
	padding: 12px 5%;
}

.has-hidden-contents > a.add-arrow:after {
    content: "\e900";
    font-family:'trippen-jp';
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    padding: 8.5px 5%;
    font-size: 1.8rem;
    vertical-align: middle;
    background-size: contain;
    transition: transform 0.3s;
}

.has-hidden-contents > a.rotate:after {
    transform: rotate(180deg);				
}

.hidden-contents {
	display: none;
}


/* Layout --------------------------------------------------- */

.place-center {
	width: 100%;
	text-align: center;
}

.place-center > * {
	display: inline-block;
}


/* Enyry ---------------------------------------------------- */

.entry-content > * {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
}

.entry-content > *:last-child {
	margin-bottom: 0 !important;
}

.entry-content svg, 
.entry-content img, 
.entry-content embed, 
.entry-content object {
    display: block !important;
    height: auto !important;
	/* width: initial !important; */
    max-width: 100% !important;
}

.entry-content b, 
.entry-content strong{
    font-weight: 600 !important;
}

.entry-content a {
	display: inline-block !important;
	text-decoration: underline;
}



/*--------------------------------------------------------------

 4.0 Header

--------------------------------------------------------------*/


#header {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    height: 50px;
    background: #fff;
    z-index: 500;
}

#header a {
	display: block;
}

@media all and (max-width:767px) {
	
    #header {
        overflow: auto;
        width: 100%;
    }
	
	#header ul li a {
		padding: 12px 5%;
        border-bottom: solid 1px #000;
	}
	
}

@media all and (min-width:768px) and (max-width:1365px) {
	
	#header {
        width: 100%;
		padding: 0 10%;
		font-size: 0;
	}
	
}

@media all and (min-width:1366px) {
	
	#header {
        width: 100%;
		font-size: 0;
	}
	
	#header .header-inner {
		width: 1091px;
		margin-right: auto;
		margin-left: auto;
	}
	
}


/* Header - Head -------------------------------------------- */

#header-head h1.header-head-trippen {
    display: block;
    margin: 0 auto;
    width: 80px;
    height: 50px;
    font-size: 0;
    background: url(asset/images/header/header-head-trippen.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}

#header-head h1.header-head-trippen a {
    height: 50px;
}

@media all and (max-width:767px) {
	
    #header-head {
		position: relative;
        width: 100%;
        height: 50px;
    }
	
}

@media all and (min-width:768px) {
	
	#header-head {
        display: inline-block;
        width: 80px;
        height: 50px;
		vertical-align: top;
    }
	
}


/* Header - Menu -------------------------------------------- */

@media all and (max-width:767px) {
	
    #bars {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 35px;
        height: 50px;
        padding: 13px 5%;
        cursor: pointer;
    }

    #bars i {
        font-size: 25px;
    }

    #bars i.bars-close {
        display: none;
    }
	
	#header-menu {
        display: none;
    }
	
}

@media all and (min-width:768px) {

	#bars {
		display: none;
	}
	
	#header-menu {
		display: inline-block;
		vertical-align: top;
	}
	
	#header-menu .header-menu-lists {
		font-size: 0;
	}
	
	#header-menu .header-menu-lists li {
		display: inline-block;
		vertical-align: top;
	}
	
	#header-menu .header-menu-lists .header-menu-list {
		margin-left: 15px;
	}
	
	#header-menu .header-menu-lists .header-menu-list:first-child {
		margin-left: 30px;
	}
	
	#header-menu .header-menu-lists .header-menu-list > a {
        padding: 20px 0 16px 0;
        font-size: 1.4rem;
        line-height: 1;
	}
	
	#header-menu .header-submenu {
		display: none;
        position: absolute;
        top: 50px;
        left: 0;
        width: 100%;
		padding: 10px 10% 20px;
        background: #fff;
        text-align: center;
	}
	
	#header-menu .header-submenu li {
		margin: 0 7.5px;
	}
	
	#header-menu .header-submenu li a {
		font-size: 1.4rem;
        line-height: 1;
	}
	
	#header-menu .header-submenu > li > ul {
		display: none;
	}
	
}


/* Header - Search field ------------------------------------- */

@media all and (max-width:767px) {

    #loupe {
        position: absolute;
        top: 0;
        /* left: 0; */
        right: 5%;
        bottom: 0;
        width: 25px;
        height: 50px;
        padding: 13px 0;
        cursor: pointer;
    }

    #loupe i {
        text-align: right;
        font-size: 24px;
    }

    #loupe i.loupe-close {
        display: none;
    }
	
	#header-searchfield {
        display: none;
        padding: 15px 5%;
        width: 100%;
        text-align: center;
    }

    #header-searchfield .header-searchfield-inner {
        display: inline-block;
        width: 100%;
        margin-top: var( --margin-top );
    }

    #product-search .product-search-search {
        display: inline-block;
        width: 60%;
		margin-right: 10px;
		vertical-align: top;
    }

    #product-search input[type="search"] {
        width: 100%;
		height: 24px;
        border-bottom: solid 1px #000;
        font-size: 1.4rem;
		line-height: 1;
    }

    #product-search .product-search-submit {
        display: inline-block;
        position: relative;
        width: 25px;
        height: 25px;
        z-index: 1;
        font-size: 25px;
        text-align: center;
        line-height: 25px;
    }

    #product-search .product-search-submit:before {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate( -50%, -50% );
        font-family: 'trippen-jp';
        content: '\e906';
        color: #000;
        font-size: 25px;
        z-index: -1;
    }

    #product-search input[type="submit"] {
        display: inline-block;
        width: 25px;
        height: 25px;
		padding: 0;
		border: none;
        background:rgba( 255, 255, 255, 0 );
        cursor: pointer;
    }
	
}

@media all and (min-width:768px) {

	#loupe {
		display: none;
	}
	
	#header-searchfield {
		display: inline-block;
		width: calc( 100% - 484px );
		height: 50px;
		margin-left: 30px;
		vertical-align: top;
		text-align: right;
		z-index: 600;
	}
	
	#header-searchfield .header-searchfield-inner {
		width: 100%;
		font-size: 0;
		line-height: 1;
	}
	
	#product-search .product-search-search {
        display: inline-block;
        width: calc( 100% - 35px );
		max-width: 250px;
		height: 50px;
		padding: 16px 0 20px 0;
		vertical-align: top;
    }
	
	#product-search input[type="search"] {
        width: 100%;
		height: 20px;
        border-bottom: solid 1px #000;
        font-size: 1.4rem;
		line-height: 1;
    }
	
	#product-search .product-search-submit {
        display: inline-block;
        position: relative;
        width: 25px;
        height: 50px;
		margin-left: 10px;
        z-index: 1;
        font-size: 25px;
        text-align: center;
		vertical-align: top;
        line-height: 25px;
    }

    #product-search .product-search-submit:before {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate( -50%, -50% );
        font-family: 'trippen-jp';
        content: '\e906';
        color: #000;
        font-size: 25px;
        z-index: -1;
    }

    #product-search input[type="submit"] {
        display: inline-block;
        width: 25px;
        height: 50px;
		padding: 0;
		border: none;
        background:rgba( 255, 255, 255, 0 );
        cursor: pointer;
    }
	
}


/* Header - Classes granted by jQuery functions ------------- */

@media all and (max-width:767px) {
	
    .wrap-hidden {
        overflow: hidden;
        /* height: 100vh; */
    }

    .body-hidden {
        overflow: hidden;
    }

    .header-shown {
        height: unset !important;
    }

    .header-menu-shown {
        display: block !important;
    }

    .header-searchfield-shown {
        display: block !important;
    }

    .bars-shown i.bars-open {
        display: none;
    }

    .bars-shown i.bars-close {
        display: inline-block !important;
    }

    .bars-hidden {
        display: none;
    }

    .loupe-shown i.loupe-open {
        display: none;
    }

    .loupe-shown i.loupe-close {
        display: inline-block !important;
    }

    .loupe-hidden {
        display: none;
    }

}



/*--------------------------------------------------------------

 5.0 Footer

--------------------------------------------------------------*/


#footer {
	margin-top: var( --margin-top );
	text-align: left;
}

#footer #copyright {
	margin-top: var( --margin-top );
	margin-bottom: var( --margin-bottom );
	font-size: 1.0rem;
	line-height: 1.0;
	text-align: center;
	clear: both;
}

@media all and (max-width:767px) {
	
    #footer {
        width: 100%;
    }
	
	#footer-menu {
		border-top: solid 1px #000;
	}
	
	.footer-menu-list a {
		display: block;
		padding: 12px 5%;
        border-bottom: solid 1px #000;
	}
	
}

@media all and (min-width:768px) {
	
	#footer {
        width: 100%;
		padding: 0 10%;
	}
	
	#footer #footer-menu {
		overflow: hidden;
		display: table;
		table-layout: fixed;
		width: 100%;
		border: solid 1px #000;
	}
	
	#footer #footer-menu ul.footer-menu-left,
	#footer #footer-menu ul.footer-menu-center,
	#footer #footer-menu ul.footer-menu-right {
		display: table-cell;
		width : calc(100% / 3);
	}
	
	#footer #footer-menu ul.footer-menu-center {
		height: 100%;
		border-right: solid 1px #000;
		border-left: solid 1px #000;
	}
	
	.list-abouttrippen > a,
	.list-customerservice > a,
	.list-followus > a {
		pointer-events: none;
		display: block;
		width: 100%;
		padding: 8px 15px;
		border-bottom: solid 1px #000;
	}
	
	.list-abouttrippen ul,
	.list-customerservice ul,
	.list-followus ul {
		padding: 8px 15px;
	}
	
	.list-company a {
		display: block;
		width: 100%;
		padding: 12px 15px 0 15px ;
		border-top: solid 1px #000;
	}
	
	.list-recruit a {
		display: block;
		width: 100%;
		padding: 0 15px 12px 15px ;
	}
	
}

@media all and (min-width:1366px) {
	
	#footer .footer-inner {
		width: 1091px;
		margin-right: auto;
		margin-left: auto;
	}
	
}



/*--------------------------------------------------------------

 6.0 Breadcrumbs

--------------------------------------------------------------*/


#breadcrumbs {
    width: 100%;
    font-size: 1.2rem;
    border-top: solid 1px #000;
    border-bottom: solid 1px #000;
}

#breadcrumbs span.angle-right:after {
    content: "\e902";
    font-family:'trippen-jp';
    display: inline-block;
    margin: 0 5px;
    font-size: 1.2rem;
	line-height: 1;
    vertical-align: middle;
    background-size: contain;
    transition: transform 0.3s;
}

@media all and ( max-width:767px ) {
	
    #breadcrumbs {
        padding: 11px 5%;
    }
	
}

@media all and ( min-width:768px ) and ( max-width:1365px ) {
	
	#breadcrumbs {
        padding: 11px 10%;
    }
	
}

@media all and ( min-width:1366px ) {
	
	#breadcrumbs .breadcrumbs-inner {
		width: 1091px;
		margin-right: auto;
		margin-left: auto;
		padding: 11px 0;
	}
	
}



/*--------------------------------------------------------------

 7.0 Home

--------------------------------------------------------------*/


#home .content {
	border-right: solid 1px #000;
	border-bottom: solid 1px #000;
	border-left: solid 1px #000;
}

#home .content:first-child {
	border-top: solid 1px #000;
}

.home-trend-image {
	width: 100%;
}

.home-trend-image > div {
	width: 100%;
    padding-top: 66.6666%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.home-collections > div {
	width: calc( ( 100% - 0.5px ) / 2 );
}

.home-collections-women {
	border-right: solid 1px #000;
}

.home-collections-women .list-item .list-item-inner,
.home-collections-men .list-item .list-item-inner {
    background-position: center center;
}

.home-news-only-text {
	padding: 20px 15px;
	border-right: solid 1px #000;
	border-bottom: solid 1px #000;
	border-left: solid 1px #000;
	text-align: center;
}

.home-thumb-post > div:first-child {
	border-right: solid 1px #000;
}

.home-thumb-post > div {
	vertical-align: middle;
}

.home-thumb-post h1 a {
	border-bottom: none !important;
}

.home-thumb-post p {
	padding: 0 30px;
	text-align: center;
}

.home-t-project h1 a p {
	display: block;
    margin: 0 auto;
	padding: 20px;
    width: 80%;
    height: 60px;
    font-size: 0;
    background: url("asset/images/home/home_t-project_logo.gif");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}

.home-vague-trippen h1 a p {
	display: block;
    margin: 0 auto;
	padding: 20px;
    width: 80%;
    height: 70px;
    font-size: 0;
    background: url("asset/images/home/home_vague_trippen_logo.gif");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}

@media all and (max-width:767px) {
	
	#home {
		padding: 0 5%;
	}
	
	#home .content {
		margin-top: var(--margin-top);
        border-top: solid 1px #000;
		border-right: solid 1px #000;
        border-bottom: solid 1px #000;
        border-left: solid 1px #000;
    }
	
    .home-trend-image > div {
        width: 100%;
        padding-top: 100%;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
    }
	
	.home-collections > div {
        width: 100%;
    }
	
	.home-collections-women {
        border-right: none !important;
    }
	
	.home-collections-men h1 a {
		border-top: solid 1px #000 !important;
	}
	
	.home-trend h1 a,
	.home-collections-women h1 a,
	.home-collections-men h1 a,
	.home-news-hasimage h1 a {
		border-bottom: none !important;
	}
	
	.home-thumb-post > div:first-child {
        width: 100%;
        border-right: none;
    }
	
	.home-thumb-post-title .has-lead a {
		padding-bottom: 5px !important;
	}
	
	.home-t-project .has-lead a {
		padding-bottom: 15px !important;
	}
	
	.home-vague-trippen .has-lead a {
		padding-bottom: 15px !important;
	}

	.home-thumb-post-title p {
		padding: 0 5% 20px 5%;
	}
	
}


/* Unknown style -------------------------------------------- */

.collections-items > div {
	display: none;
}



/*--------------------------------------------------------------

 8.0 Post

--------------------------------------------------------------*/


.post h1 {
	font-size: 1.8rem;
    font-weight: bolder;
}

.post-content {
	width: 100%;
	max-width: 540px;
	margin-top: var( --margin-top );
	margin-right: auto;
	margin-left: auto;
}

.post-content a {
	display: inline !important;
	text-decoration: underline;
}

.post-content a.button {
    padding: 10px 0;
    font-weight: bolder;
    text-align: center;
    text-decoration: none;
    color: #fff;
    background: #000;
}

.post-content h1 {
	font-size: 1.4rem;
}

.post-content img {
    padding-bottom: 5px;	
}

.post-content .post-title {
	margin-bottom: 30px;
}

#news-archives .post-content .post-content-wrap {
	padding-top: 43px;
	padding-bottom: 43px;
	border-top: solid 1px #000;
}

#news-archives .post-content .post-content-wrap:first-child {
	padding-top: 0;
	border-top: none;
}

@media all and (max-width:767px) {
	
	.post-content {
        padding: 0 5%;
    }
	
	.post-content a.button {
		width: 100%;
	}
	
}

.set-bg {
	background: #f2f2f2;
    padding: 5%;
}



/*--------------------------------------------------------------

 9.0 Page

--------------------------------------------------------------*/


.page h1 {
	padding-top: 9px;
	font-size: 1.8rem;
	font-weight: bolder;
}

.page h2 {
	margin-bottom: 30px;
	font-weight: bolder;
}

.page h3 {
	margin-bottom: 30px;
	font-weight: bolder;
}

.page-title {
    margin-bottom: 30px;
}

.page-content {
	width: 100%;
	/* max-width: 768px; */
	margin-top: var( --margin-top );
	margin-right: auto;
	margin-left: auto;
}

.page-content-wide {
	width: 100%;
	/* max-width: 768px; */
	margin-top: var( --margin-top );
	margin-right: auto;
	margin-left: auto;
}

.page-content-narrow {
	width: 100%;
	/*　Rewritten for 2022　*/
	max-width: 640px;
	
	margin-top: var( --margin-top );
	margin-right: auto;
	margin-left: auto;
}

.page-lists {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	width: 100%;
    text-align: center;
}

.page-lists > div:last-child {
    margin-right: 0;
}

.page-lists > div a img {
	margin-bottom: 15px;
}

.page-lists > div a p {
    max-width: 100%;
    overflow: hidden;
}

@media all and (max-width:767px) {
	
	.page-content,
	.page-content-narrow {
        padding: 0 5%;
    }
	
	.page-lists > div {
        display: inline-block;
        width: calc( ( 100% - 30px ) / 2 );
        margin-right: 30px;
        word-wrap: break-word;
    }

    .page-lists > div:nth-child(n+3) {
        margin-top: 30px;
    }

    .page-lists > div:nth-child(2n) {
        margin-right: 0;
    }
	
}

@media all and (min-width:768px) and (max-width:1024px) {
	
	.page-lists > div {
        display: inline-block;
        width: calc( ( 100% - 60px ) / 3 );
        margin-right: 30px;
        word-wrap: break-word;
    }

    .page-lists > div:nth-child(n+4) {
        margin-top: 30px;
    }

    .page-lists > div:nth-child(3n) {
        margin-right: 0;
    }
	
}

@media all and (min-width:1024px) {

    .page-lists > div {
        display: inline-block;
        width: calc( ( 100% - 90px ) / 4 );
        margin-right: 30px;
        word-wrap: break-word;
    }

    .page-lists > div:nth-child(n+5) {
        margin-top: 30px;
    }

    .page-lists > div:nth-child(4n) {
        margin-right: 0;
    }

}



/*--------------------------------------------------------------

 9.1 Page : Trend

--------------------------------------------------------------*/


#trend .variable-two-columns > div:first-child {
	padding-right: 45px !important;
}

#trend .trend-image {
	margin-bottom: 20px;
}

#trend .trend-image-add {
    display: block;
    margin-top: 20px;
}

@media all and ( min-width:768px ) {
	
	#trend .trend-theme > * {
        display: block;
        margin-left: auto;
        margin-right: auto;
        width: 50%;
    }
	
}

@media all and ( max-width:767px ) {
	
	#trend .variable-two-columns > div:first-child {
        padding-right: 0 !important;
    }
	
	#trend .trend-news img {
		margin-bottom: 16px;
	}
	
}



/*--------------------------------------------------------------

 9.2 Page : Collections

--------------------------------------------------------------*/


.collections .variable-four-columns {
	/* border-top: solid 1px #000; */
	border-left: solid 1px #000;
}

.collections .variable-four-columns > div {
	border-right: solid 1px #000;
	border-bottom: solid 1px #000;
}

.collections .variable-four-columns > div p {
	padding: 10px 5%;
	text-align: center;
}

@media all and (max-width:767px) {
	
	.collections .variable-four-columns > div:nth-child(-n+2) {
        border-top: solid 1px #000;
    }
	
}

@media all and (min-width:768px) and (max-width:1023px) {
	
	.collections .variable-four-columns > div:nth-child(-n+3) {
        border-top: solid 1px #000;
    }
	
}

@media all and (min-width:1024px) {
	
	.collections .variable-four-columns > div:nth-child(-n+4) {
        border-top: solid 1px #000;
    }
	
}



/*--------------------------------------------------------------

 9.2.1 Page : Collections - Product

--------------------------------------------------------------*/


.product-photo, 
.product-information-inner {
	padding: 5%;
}

.product-photo {
	border: solid 1px #000;
	vertical-align: middle !important;
}

.product-photo img {
    max-height: 500px;
    object-fit: contain;
}

.product-information-inner {
	border-top: solid 1px #000;
	border-right: solid 1px #000;
	border-bottom: solid 1px #000;
}

.product-information-inner > div {
	margin-top: 10px;
}

.product-information-inner > div:first-child {
	margin-top: 0;
}

.product-information-trend ul {
	display: flex;
	flex-wrap: wrap;
	/* margin-bottom: 10px; */
}

.product-information-trend ul li {
	margin: 0 5px 5px 0;
	padding: 0 5px;
	border: solid 1px #000;
	font-size: 1.2rem;
}

.product-information-basic {
	margin-top: 0 !important;
}

.product-information-basic h1 {
	text-align: left;
}

.product-information-basic .price {
	font-size: 2rem;
}

.product-information-bto {
	padding: 10px 20px;
	background: #f2f2f2;
}

.product-information-back-ordering p,
.product-information-release-date p  {
	display: inline-block !important;
	width: 100%;
	padding: 10px 0;
	border: solid 1px #000;
	font-size: 1.6rem;
	font-weight: bolder;
	text-align: center;
	text-decoration: none;
}

.product-information-link {
	margin: 15px 0 !important;
}

.product-information-link a {
	display: inline-block !important;
	width: 100%;
	padding: 10px 0;
	border: solid 1px #000;
	font-size: 1.6rem;
	font-weight: bolder;
	text-align: center;
	text-decoration: none;
	color: #fff;
	background: #000;
}

.product-information-option a {
	display: inline-block !important;
	text-decoration: underline !important;
}

.product-information-sustainable-skills a {
	text-decoration: underline !important;
}

.product-information-sustainable-skills ul li {
	display: inline-block;
}

.product-information-sustainable-skills ul li img {
	max-width: 40px;
}

.product-information-stocks {
	border-right: solid 1px #000;
	border-bottom: solid 1px #000;
}

.product-information-stocks .not-sold {
	padding: 12px 5%;
}

.product-information-stocks-inner {
	padding: 0 5% 5% 5%;
}

.product-information-stocks table {
	margin: 5px 0 18px 0;
}

.product-information-stocks table tr th {
	padding: 5px 10px;
	vertical-align: middle;
}

.product-information-stocks table tr td {
	padding: 5px 10px;
	text-align: left;
}

.product-information-stocks table tr td span {
	display: inline-block;
	padding-right: 10px;
}

.product-information-stocks table tr td span:last-child {
	padding-right: 0;
}

.product-information-stocks-inner a {
	text-decoration: underline !important;
}

@media all and (max-width:767px) {
	
	.product-photo {
        padding: 0 5% 43px 5%;
        border: none;
        vertical-align: top !important;
    }

    .product-information-inner {
        border-top: solid 1px #000;
        border-right: none;
        border-bottom: none;
    }
	
	.product-information-stocks {
        border-top: solid 1px #000;
		border-right: none;
        border-bottom: solid 1px #000;
    }

}



/*--------------------------------------------------------------

 9.3 Page : Stores

--------------------------------------------------------------*/


#stores .shop-address {
    font-size: 1.2rem;	
}

#stores .stores-caption {
	margin-bottom: 30px;
}

.stores-shop-infomation {
	margin-top: 20px;
	text-align: center;
}

.stores-shop-infomation a {
	display: inline !important;
	text-decoration: underline;
}

.stores-shop-infomation .add-information {
	color: #B10700;
}



/*--------------------------------------------------------------

 9.4 Page : About trippen

--------------------------------------------------------------*/


@media all and (max-width:767px) {
	
	.about-trippen-pagenation {
		/* padding: 0 5%; */
	}
	
}

@media all and (min-width:768px) and (max-width:1365px) {
	
	.about-trippen-pagenation {
        width: 100%;
		padding: 0 10%;
	}
	
}

@media all and (min-width:1366px) {
	
	.about-trippen-pagenation {
		width: 1091px;
		margin-right: auto;
		margin-left: auto;
	}
	
}



/*--------------------------------------------------------------

 9.4.1 Page : About trippen - Values

--------------------------------------------------------------*/



/*--------------------------------------------------------------

 9.4.2 Page : About trippen - Statement

--------------------------------------------------------------*/


#statement .statement-signs {
	margin-top: var( --margin-top );
	text-align: center;
}

#statement .statement-signs ul li {
	display: inline-block;
	margin: 0 7.5px;
}

#statement .statement-signs ul li img {
	width: 120px;
	margin-bottom: 7.5px;
}

#statement .statement-signs ul li p {
	font-size: 0.6rem !important;
	line-height: 1;
}

#statement .statement-link {
	margin-top: 15px;
	text-align: center;
}



/*--------------------------------------------------------------

 9.4.3 Page : About trippen - History

--------------------------------------------------------------*/



/*--------------------------------------------------------------

 9.4.4 Page : About trippen - Trippen lines

--------------------------------------------------------------*/


#trippen-lines .page-content > div {
	padding: 45px 0;
	border-top: solid 1px #000;
}

#trippen-lines .page-content > div:last-child {
	padding: 45px 0 0 0;
}

#trippen-lines .variable-two-columns > div {
	vertical-align: middle;
}

#trippen-lines .variable-two-columns > div:first-child {
	width: 30%;
	padding-right: 40px;
}

@media all and (max-width:767px) {
	
	#trippen-lines .variable-two-columns > div:first-child {
		width: 100%;
		max-width: 540px;
		margin-right: auto;
		margin-left: auto;
		margin-bottom: 30px;
		padding: 0 5%;
    }
	
}



/*--------------------------------------------------------------

 9.4.5 Page : About trippen - Works

--------------------------------------------------------------*/


.other-pages .page-lists {
    justify-content: left;
}

.other-pages .page-lists > div a p {
	margin-top: 15px;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#works .button a {
    padding: 10px 5%;
    font-weight: bolder;
    text-align: center;
    text-decoration: none;
    color: #fff;
    background: #000;
}

@media all and (max-width:767px) {
	
	#works .button a {
		width: 100%;
	}

}



/*--------------------------------------------------------------

 9.4.6 Page : About trippen - Sustainable skills

--------------------------------------------------------------*/


#sustainable-skills .variable-two-columns {
	margin-top: 30px;
}

#sustainable-skills .variable-two-columns:first-child {
	margin-top: 0;
}

#sustainable-skills .variable-two-columns > div {
	vertical-align: middle;
}

#sustainable-skills .variable-two-columns > div:first-child {
	width: 80px;
	padding-right: 40px;
}

@media all and (max-width:767px) {
	
	#sustainable-skills .variable-two-columns > div {
        width: 100%
    }
	
	#sustainable-skills .variable-two-columns > div:first-child img {
        width: 90px;
    }
	
}



/*--------------------------------------------------------------

 9.4.7 Page : About trippen - Materials

--------------------------------------------------------------*/


.swatch-lists {
	display: flex;
	flex-flow: row wrap;
	width: 100%;
}

.swatch-lists li {
	width: calc( ( 100% - 60px ) / 5 );
	margin-right: 15px;
}

.swatch-lists li:nth-child(n+6) {
	margin-top: 15px;
}

.swatch-lists li:nth-child(5n) {
	margin-right: 0;
}

.swatch-lists li p {
	padding-top: 5px;
	text-align: center;
}

#leathers h2,
#leathers h3 {
	margin-bottom: 20px;
	padding-bottom: 7px;
	border-bottom: solid 1px;
	font-weight: normal;
	text-align: left;
}

#leathers h3 {
	margin-top: 40px;
}

.leather-photo {
	margin-top: 40px;
}

#soles h2,
#soles h3 {
	margin-bottom: 20px;
	padding-bottom: 7px;
	border-bottom: solid 1px;
	font-weight: normal;
	text-align: left;
}

#soles h3 {
	margin-top: 40px;
	/* margin-bottom: 20px; */
}

.sole-photo {
	margin-top: 40px;
}



/*--------------------------------------------------------------

 9.5 Page : Customer service

--------------------------------------------------------------*/



/*--------------------------------------------------------------

 9.5.1 Page : Customer service - Size

--------------------------------------------------------------*/


#size .size-table {
	margin-bottom: var( --margin-bottom );
}

#size .size-table > div {
	display: flex;
    flex-flow: row wrap;
    width: 100%;
	text-align: center;
	border-top: solid 1px var(--color-grey);
	border-left: solid 1px var(--color-grey);
}

#size .size-table > div .size-table-td {
	display: inline-block;
    width: calc( 100% / 6 );
    word-wrap: break-word;
	padding: 5%;
	border-right: solid 1px var(--color-grey);
	border-bottom: solid 1px var(--color-grey);
	vertical-align: middle;
}

#size .size-table > div.size-ladys .size-table-td {
	border-bottom: none;
}

#size .size-de {
	font-size: 2.5rem;
	font-weight: bolder;
}

#size .size-note {
	text-align: center;
}

@media all and (max-width:767px) {
	
	#size .size-table > div.size-mens {
        margin-top: var(--margin-top);
    }
	
	#size .size-table > div .size-table-td {
        width: 50%;
        padding: 5%;
        border-right: solid 1px var(--color-grey);
        border-bottom: solid 1px var(--color-grey);
        vertical-align: middle;
    }
	
	#size .size-table > div.size-ladys .size-table-td {
        border-bottom: solid 1px var(--color-grey);
    }
	
}



/*--------------------------------------------------------------

 9.5.2 Page : Customer service - Care

--------------------------------------------------------------*/


#care h3 {
	margin-top: 40px;
    margin-bottom: 20px;
	padding-bottom: 7px;
    border-bottom: solid 1px;
    font-weight: normal;
    text-align: left;
}

#care .care-table-title {
	margin-top: var( --margin-top );
}

#care .care-table > div {
	display: flex;
    flex-flow: row wrap;
    width: 100%;
	text-align: center;
}

#care .care-table > div .care-table-td {
	display: inline-block;
    width: calc( ( 100% - 90px ) / 4 );
    margin-right: 30px;
    word-wrap: break-word;
	vertical-align: middle;
}

#care .care-table > div .care-table-td:nth-child(n+5) {
    margin-top: 30px;
}

#care .care-table > div .care-table-td:nth-child(4n) {
    margin-right: 0;
}

#care .care-table > div p {
	padding-top: 5px;
	font-size: 1.2rem;
	line-height: 1.4;
}

@media all and (max-width:767px) {
	
	#care .care-table > div .care-table-td {
        display: inline-block;
        width: calc( ( 100% - 30px ) / 2 );
        margin-right: 30px;
        word-wrap: break-word;
        vertical-align: middle;
    }
	
	#care .care-table > div .care-table-td:nth-child(n+3) {
        margin-top: 30px;
    }

    #care .care-table > div .care-table-td:nth-child(2n) {
        margin-right: 0;
    }
	
}



/*--------------------------------------------------------------

 9.5.3 Page : Customer service - Repair

--------------------------------------------------------------*/


#repair h3 {
	margin-top: 40px;
    margin-bottom: 30px;
	padding-bottom: 7px;
    border-bottom: solid 1px;
    font-weight: normal;
    text-align: left;
	margin-bottom: 0px;
}

#repair .repair-table {
	/* margin-bottom: 30px; */
}

#repair .repair-table > div {
	display: table;
	table-layout: fixed;
	width: 100%;
	border-bottom: solid 1px var( --color-grey );
}

#repair .repair-table > div:first-child {
	border-top: solid 1px var( --color-grey );
}

#repair .repair-table > div .repair-table-td {
	display: table-cell;
	padding: 10px 0;
}

#repair .repair-table > div .repair-table-td:last-child {
	width: 130px;
	text-align: right;
}

#repair .repair-table .note {
	/* margin-top: 30px; */
	padding: 15px 20px;
	border: none;
	font-size: 1.2rem;
	background: #f2f2f2;
}



/*--------------------------------------------------------------

 9.5.4 Page : Customer service - Stocks

--------------------------------------------------------------*/


#stocks .form-wrap {
	width: 100%;
	max-width: 540px;
	margin-top: 30px;
	margin-right: auto;
	margin-left: auto;
}

#stocks .form-wrap form > div {
    margin-top: 30px;
}

#stocks .form-wrap form > div:first-child {
    margin-top: 0;
}

#stocks .form-wrap .form-radio > div,
#stocks .form-wrap .form-checkbox > div {
    display: inline-block;
    padding-right: 20px;
}

#stocks .form-wrap .form-radio > div,
#stocks .form-wrap .form-checkbox > div {
    display: inline-block;
    padding-right: 20px;
}

#stocks .form-wrap .form-radio > div label,
#stocks .form-wrap .form-radio > div:last-child label,
#stocks .form-wrap .form-checkbox > div label,
#stocks .form-wrap .form-checkbox > div:last-child label {
    padding: 0 0 0 5px;
}

#stocks .form-wrap .form-radio,
#stocks .form-wrap .form-checkbox {
    display: inline-block;
    width: 100%;
    padding: 0 10px;
    border: none;
    line-height: 1;
    text-align: center;
}

#stocks .form-wrap .form-submit input[type="submit"] {
    font-weight: bolder;
    color: #fff;
    background: #000;
}

#stocks .form-wrap .size-women,
#stocks .form-wrap .size-men {
	display: none;
}

@media all and (max-width:767px) {
    
    #stocks .form-wrap .form-radio,
    #stocks .form-wrap .form-checkbox {
        display: inline-block;
        width: 100%;
        padding: 0;
        border-top: solid 1px #000;
        border-left: solid 1px #000;
        font-size: 0;
        line-height: 1;
        text-align: left;
    }
    
    #stocks .form-wrap .form-radio > div,
    #stocks .form-wrap .form-checkbox > div {
        width: calc( 100% / 3 );
        padding: 9px 10px;
        border-right: solid 1px #000;
        border-bottom: solid 1px #000;
        font-size: 1.2rem;
    }
    
	#stocks .form-wrap .size-women,
    #stocks .form-wrap .size-men {
        display: none;
    }
	
}

#stocks .stocks-result-note {
	margin: 13px auto 0 auto;
}

#stocks .stocks-re-search-form {
	width: 100%;
	max-width: 540px;
	margin: 0 auto 0 auto;
	text-align: center;
}

#stocks .stocks-re-search-form .form-wrap {
	display: none;
}

#stocks .stocks-re-search-button {
	display: inline-block;
	margin: 15px auto 0 auto;
    padding: 8px 15px;
    border: solid 1px #000;
    cursor: pointer;
}

#stocks .result-wrap {
	width: 100%;
	max-width: 540px;
	margin-top: 30px;
	margin-right: auto;
	margin-left: auto;
}

#stocks .result-wrap > div {
	display: table;
	width: 100%;
	border-right: solid 1px #000;
	border-bottom: solid 1px #000;
	border-left: solid 1px #000;
}

#stocks .result-wrap > div:first-child {
	border-top: solid 1px #000;
}

#stocks .result-wrap > div > div {
	display: table-cell;
	padding: 15px;
	vertical-align: middle;
}

#stocks .result-wrap > div .result-image {
	width: 30%;
	border-right: solid 1px #000;
}

#stocks .result-wrap > div .result-infomation table {
	margin-top: 8px;
}

#stocks .result-wrap > div .result-infomation table tr th {
	vertical-align: middle;
	text-align: center;
}

#stocks .result-wrap > div .result-infomation table tr td {
	text-align: left;
}

#stocks .result-wrap > div .result-infomation table tr td span {
    display: inline-block;
    padding-right: 10px;
}

#stocks .in-stock {
	
}

#stocks .out-of-stock {
	text-align: center;
	padding: 7px 10px;
}

/*
#stocks .load-more {
	width: 100%;
	max-width: 540px;
	margin-top: 30px;
	margin-right: auto;
	margin-left: auto;
}

#stocks .load-more-button {
	display: inline-block;
    padding: 8px 15px;
	border: solid 1px #000;
}
*/

@media all and (max-width:767px) {
	
	#stocks .stocks-re-search-button {
        width: 100%;
	}
	
	/*
	#stocks .load-more-button {
		width: 100%;
	}
	*/
	
}


/*--------------------------------------------------------------

 9.5.5 Page : Customer service - FAQ

--------------------------------------------------------------*/


#faq h3 {
    margin-bottom: 15px;
	padding-bottom: 10px;
	border-bottom: solid 1px #dcdcdc;
    font-weight: normal;
    text-align: left !important;
	font-weight: bolder;
}

#faq .faq-inner {
	margin-top: 40px;
}

#faq .contact {
	padding: 40px;
	border: solid 1px #fff;
	text-align: center;
	background: #f2f2f2;
}

#faq a {
	display: inline;
	padding: 0 5px;
	/* font-weight: bolder; */
	text-decoration: underline;
}

#faq .contact a {
	display: inline-block;
	margin-top: 15px;
    padding: 30px 15px;
	border: solid 1px #dcdcdc;
	border-radius: 10px;
    width: 50%;
	background: #000;
	color: #fff;
	font-size: 1.6rem;
	font-weight: bolder;
	text-decoration: none;
}

@media all and (max-width:767px) {
	
	#faq .contact a {
		width: 100%;
	}
	
}



/*--------------------------------------------------------------

 9.6 Page : Mail Magazine ( MailPoet )

--------------------------------------------------------------*/


#mailmagazine a {
	display: inline;
	text-decoration: underline;
}


/* Override MailPoet style ---------------------------------- */

#mailmagazine .mailpoet_paragraph {
	margin-top: 19.6px;
}

#mailmagazine .mailpoet_submit {
	width: 100%;
    padding: 9px 10px !important;
    border: solid 1px #000;
	font-weight: bolder;
    color: #fff;
    background: #000;
    cursor: pointer;
}

#mailmagazine .mailpoet_unsubscribe {
	display: block;
	width: 100%;
    padding: 9px 10px !important;
    border: solid 1px #000;
	font-weight: bolder;
    color: #fff;
    background: #000;
    cursor: pointer;
	text-decoration: none;
}

#mailmagazine .mailpoet-submit-success {
	margin-top: 19.6px;
    text-align: center;
    font-weight: bolder;
}

#mailmagazine .mailpoet-submit-success:first-child {
	margin-top: 0;
}

#mailmagazine .unsubscribe-completed a {
	display: block;
	width: 100%;
    padding: 9px 10px !important;
    border: solid 1px #000;
	font-weight: bolder;
    color: #fff;
    background: #000;
    cursor: pointer;
	text-align: center;
	text-decoration: none;
}

/* 登録解除画面にて登録情報ページへのリンクを非表示にする。 */
.unsubscribe-completed div a {
	display: none !important;
}



/*--------------------------------------------------------------

 9.7 Page : t-project 

--------------------------------------------------------------*/

#t-project h1 {
	display: block;
    margin: 0 auto;
    width: 400px;
    height: 111px;
    font-size: 0;
    background: url("asset/images/page/t-project/t-project_logo.gif");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}

#t-project h2 {
	text-align: left;
}

#t-project h3 {
	margin-top: 20px;
	margin-bottom: 20px;
}

#t-project h4 {
	display: inline-block;
	width: 100%;
	margin-top: 20px;
	margin-bottom: 20px;
	border-bottom: solid 1px #000;
	text-align: left;
}

#t-project figcaption {
	margin-top: .5em;
	font-size: 1.2rem;
	line-height: 1.2;
}

#t-project .content > div {
	margin-top: var( --margin-top );
}

#t-project .product-image {
	text-align: center;
}

#t-project .jeans-image,
#t-project .mpc-image,
#t-project .reason-image {
	display: flex;
	margin-bottom: 20px;
	width: 100%;
}

#t-project .reason-image_03 {
	margin-bottom: 20px;
}

#t-project .jeans-image img,
#t-project .mpc-image img,
#t-project .reason-image img {
	flex-flow: row wrap;
    width: 50%;
}

#t-project .rec-grey {
	margin-bottom: 20px;
}

#t-project .bglto {
	margin: 20px auto;
    width: 50%;
	text-align: center;
}

#t-project .revive,
#t-project .camp {
	margin: 20px auto;
    width: 50%;
	text-align: center;
}

#t-project .t-project-products {
	display: flex;
	gap: 0 15px;
	margin-top: 20px;
	margin-bottom: 20px;
}

#t-project .video-thumbnail {
	position: relative;
	margin-bottom: 40px;
}

#t-project .video-thumbnail a {
	background-color: rgba( 0, 0, 0, 0.5 );
}

#t-project .video-thumbnail .overlay-text {
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate( -50%, -50% );
    text-align: center;
	color: #ffffff;
	text-decoration: underline;
}

#t-project .aware-materials {
	margin-top: 25px;
	margin-bottom: 25px;
}

#t-project .aware-video {
	background: url("asset/images/page/t-project/aware_video_thumbnail.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}

#t-project .kismet-materials {
	margin-top: 15px;
	margin-bottom: 40px;
}

#t-project .kismet-video {
	background: url("asset/images/page/t-project/kismet_video_thumbnail.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}

#t-project .kismet-materials-leather,
#t-project .kismet-materials-sole {
	display: flex;
}

#t-project .kismet-materials-leather .sign {
	align-self: center;
	width: 17%;
	text-align: center;
	font-size: 1.2rem;
}

#t-project .kismet-materials-sole .sign {
	align-self: center;
	width: 6%;
	text-align: center;
	font-size: 1.2rem;
}

#t-project .camp-image img {
	display: block;
	margin-bottom: 20px;
}

#t-project .detail-image {
	width: 22%;
}

#t-project .greater-than:before {
	content: '>';
}

#t-project .equal:before {
	content: '=';
}

#t-project .plus:before {
	content: '+';
}


@media all and ( min-width:768px ) {
	
	#t-project .camp-image img {
        width: 80%;
        margin-left: auto;
		margin-right: auto;
    }
	
}

@media all and (max-width:767px) {

	#t-project h1 {
        display: block;
        margin: 0 auto;
        width: 100%;
        height: 60px;
        font-size: 0;
        background: url("asset/images/page/t-project/t-project_logo.gif");
        background-repeat: no-repeat;
        background-position: center center;
        background-size: contain;
    }
	
	#t-project .jeans-image,
	#t-project .mpc-image,
	#t-project .reason-image {
        display: block;
        margin-bottom: 20px;
        width: 100%;
    }
	
	#t-project .jeans-image img,
	#t-project .mpc-image img,
	#t-project .reason-image img {
        flex-flow: row wrap;
        width: 100%;
    }
	
	#t-project .bglto {
        margin: 20px auto;
        width: 100%;
        text-align: center;
    }
	
	#t-project .camp {
		width: 100%;
	}
	
}
	


/*--------------------------------------------------------------

 10.0 Search

--------------------------------------------------------------*/


#serach-result .variable-four-columns {
	/* border-top: solid 1px #000; */
	border-left: solid 1px #000;
}

#serach-result .variable-four-columns > div {
	display: block;
	border-right: solid 1px #000;
	border-bottom: solid 1px #000;
}

#serach-result .variable-four-columns > div p {
	padding: 10px 5%;
	text-align: center;
}

@media all and (max-width:767px) {
	
	#serach-result .variable-four-columns > div:nth-child(-n+2) {
        border-top: solid 1px #000;
    }
	
}

@media all and (min-width:768px) and (max-width:1023px) {
	
	#serach-result .variable-four-columns > div:nth-child(-n+3) {
        border-top: solid 1px #000;
    }
	
}

@media all and (min-width:1024px) {
	
	#serach-result .variable-four-columns > div:nth-child(-n+4) {
        border-top: solid 1px #000;
    }
	
}


/*--------------------------------------------------------------

 11.0 404

--------------------------------------------------------------*/


#notfound-icon {
	padding: 60px 0 0 0;
}

#notfound-icon img {
	width: 40%;
}

#notfound {
	text-align: center;
}

#notfound h1 {
	font-size: 5rem;
}

#notfound .to-homepage {
	display: inline-block;
	margin-top: var( --margin-top );
}

#notfound .to-homepage a {
	display: block;
    width: 100%;
    padding: 8px 85.5px;
	color: #fff;
	background: #000;
}

@media all and (max-width:767px) {
	
	#notfound h1 {
        font-size: 3.5rem;
    }
	
}


/*--------------------------------------------------------------

 12.0 Site Map

--------------------------------------------------------------*/





/*--------------------------------------------------------------

 13.0 Web fonts

--------------------------------------------------------------*/


@font-face {
  font-family: 'trippen-jp';
  src: url('asset/fonts/trippen-jp.eot?j4zm5q');
  src: url('asset/fonts/trippen-jp.eot?j4zm5q#iefix') format('embedded-opentype'),
       url('asset/fonts/trippen-jp.ttf?j4zm5q') format('truetype'),
       url('asset/fonts/trippen-jp.woff?j4zm5q') format('woff'),
       url('asset/fonts/trippen-jp.svg?j4zm5q#trippen-jp') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'trippen-jp' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-wf-bars:before {
  content: "\e904";
}

.icon-wf-cross:before {
  content: "\e905";
}

.icon-wf-loupe:before {
  content: "\e906";
}

.icon-wf-angle-up:before {
  content: "\e903";
}

.icon-wf-angle-down:before {
  content: "\e900";
}

.icon-wf-angle-left:before {
  content: "\e901";
}

.icon-wf-angle-right:before {
  content: "\e902";
}


/* Font Awsome ---------------------------------------------- */

.has-external-link:hover {
	cursor: pointer;
	opacity: 0.6;
	text-decoration: none;
}

.has-external-link:after {
    font-family: "Font Awesome 5 Free";
    content: "\f35d";
	padding-left: 10px;
}

.notice:before {
	font-family: "Font Awesome 5 Free";
    content: "\f05a";
	padding-right: 5px;
}

.in-stock:before {
	font-family: "Font Awesome 5 Free";
    content: "\f111";
	padding-right: 5px;
}



/*--------------------------------------------------------------

 14.0 Patch

--------------------------------------------------------------*/


/* Overwrite wp-block style --------------------------------- */

.entry-content .wp-block-columns {
    flex-wrap: nowrap !important;
}

.entry-content .wp-block-column:not(:first-child) {
    /* margin-left: 15px !important;  2024.02.20 Modify */
}

.entry-content  .wp-block-column .wp-block-image {
    margin-bottom: 0 !important;
}

.entry-content .wp-block-image figcaption {
	margin-bottom: 0 !important;
	font-size: 1.2rem !important;
	text-align: center;
}

.entry-content .wp-block-image {
    margin-bottom: 20px !important;
}

.entry-content .fill-the-gap { /* Added in 18,Mar. */
    gap: 0.5em !important;
}


/* Password style ------------------------------------------- */

.post-password-form label {
	width: 100%;
	margin: 15px 0;
    padding: 9px 20px;
    border: solid 1px #000;
    cursor: pointer;
    box-sizing: border-box;
    display: block;
}

.post-password-form input[type="submit"] {
	background: #333333;
	color: #ffffff;
}


/*--------------------------------------------------------------
trippen japan 25th anniversary 
--------------------------------------------------------------*/

.entry-content ul {
	list-style-type: inherit;
}

.entry-content ul li {
	list-style-type: inherit;
	margin-left: 1.8rem;
}

.entry-content .vertical {
	width: 60%;
}

.entry-content .company {
	
}

.entry-content .profile {
	overflow: hidden;
    padding: 20px;
    border: 1px solid rgba(160, 166, 169, 0.3);
    border-radius: 5px;
	font-size: 1.2rem;
}

.entry-content .profile h3 {
	margin-bottom: 2rem;
    padding: 0 0 0.2em 0;
    background: transparent;
    border-bottom: 1px solid #333333;
    color: #333333;
    font-weight: normal;
    font-size: 1.5rem;
    line-height: 1.5;
	text-align: left;
}

.entry-content .profile h4 {
	margin-bottom: 1rem;
}

.entry-content .profile .wp-block-columns {
	margin-bottom: 0 !important;
}

.entry-content .profile .wp-block-columns .wp-block-column:first-child {
	flex-basis: 33.33% !important;
}

.entry-content .profile .wp-block-columns .wp-block-column:nth-child(2) {
	flex-basis: 66.66% !important;
}

.entry-content .profile_inner {
    justify-content: center;
    align-items: center;
	margin-bottom: 0 !important;
}

@media (min-width: 600px) and (max-width: 781px) {
	
	.entry-content .profile_inner .wp-block-column:first-child {
        flex-basis: 30% !important;
        flex-grow: 0;
	}
	
	.entry-content .profile_inner .wp-block-column:last-child {
        flex-basis: calc(70% - 1em) !important;
        flex-grow: 0;
	}
	
}

@media (max-width:599px) {
	.entry-content .profile_inner .wp-block-column:first-child {
		flex-basis : 150px !important;
    }
}
	
.entry-content .onlinestore {
	overflow: hidden;
	align-items: center;
    padding: 20px;
    border: 1px solid rgba(160, 166, 169, 0.3);
    border-radius: 5px;
}

.entry-content .onlinestore h1 {
	padding-top: 9px;
    font-size: 1.8rem;
    font-weight: bolder;
}

.entry-content .onlinestore a {
	display: inline-block !important;
    width: 100%;
	margin-top: 15px;
    padding: 10px 0;
    border: solid 1px #000;
    font-size: 1.6rem;
    font-weight: bolder;
    text-align: center;
    text-decoration: none;
    color: #fff;
    background: #000;
}

.wrap-h1 {
	text-align: center;
}

@media all and (max-width:767px) {
	
	.entry-content .vertical {
        width: 100%;
    }
	
}

/* Home ------------------------------------------------------*/

.home-trippen-jap-25th-anniv h1 {
	background: #9c814d;
}

.home-trippen-jap-25th-anniv h1 a {
	font-weight: bolder;
	color:#ffffff;
}

.home-trippen-jap-25th-anniv-image {
	width: 100%;
}

.home-trippen-jap-25th-anniv-image > div {
	width: 100%;
    padding-top: 66.6666%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}



.home-trippen-jap-25th-anniv-sub > div:first-child {
	border-right: solid 1px #000;
}

@media all and (max-width:767px) {
	
	.home-trippen-jap-25th-anniv-image > div {
        width: 100%;
        padding-top: 100%;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
    }
	
	.home-trippen-jap-25th-anniv-sub > div:first-child {
        border-right: none !important;
		border-bottom: solid 1px #000 !important;
    }
	
	.home-trippen-jap-25th-anniv-sub > div h1 a {
		border-bottom: none !important;
	}
	
}

/* Page ------------------------------------------------------*/

#trippen-jap-25th-anniv .page-lists {
	justify-content: left !important;
}

#trippen-jap-25th-anniv .trippen-jap-25th-anniv-top h2 {
	margin-bottom: 20px;
}

#trippen-jap-25th-anniv .trippen-jap-25th-anniv-top h3 {
	margin-top: var( --margin-top );
	margin-bottom: 30px;
	padding: 11px 10%;
	border-top: solid 1px #000;
	border-bottom: solid 1px #000;
	font-size: 1.8rem;
    font-weight: bolder;
}

#trippen-jap-25th-anniv .trippen-jap-25th-anniv-image {
	margin-bottom: var( --margin-bottom );
}

#trippen-jap-25th-anniv .page-lists > div {
    display: inline-block;
    width: calc( ( 100% - 30px ) / 2 );
    margin-right: 30px;
    word-wrap: break-word;
}

#trippen-jap-25th-anniv .page-lists > div:nth-child(n+3) {
    margin-top: 30px;
}

#trippen-jap-25th-anniv .page-lists > div:nth-child(2n) {
    margin-right: 0;
}

#recognize-trippen-jap-25th-anniv h3.lead {
	border-bottom: solid 2px #000000;
    padding-bottom: 0.5rem;
    font-size: 1.8rem;
}

#trippen-jap-25th-anniv-comments h1 {
	display: inline-block;
	font-size: 1.4rem;
	padding-bottom: 0.6rem;
	border-bottom: solid 1px #333333;
}

#trippen-jap-25th-anniv-comments h2 {
	margin-bottom: 0 !important;
	font-size: 1.8rem;
}

#trippen-jap-25th-anniv-comments h2.comments-title {
    margin-bottom: 3.0rem !important;
	font-size: 1.4rem !important;
	font-weight: normal !important;
}

#trippen-jap-25th-anniv-comments .post-date {
	font-size: 1.2rem;
	text-align: center;
	margin-bottom: 30px;
}

.trippen-jap-25th-anniv-content {
	margin: 0 auto;
    max-width: 768px;
}

.michaelandclaudia-en {
	/* font-family: Times, serif; */
    /* font-style: italic; */
    /* font-weight: bolder; */
    padding: 5%;
    background: #f7f7f7;
}

@media all and (max-width:767px) {
	
	#trippen-jap-25th-anniv .page-lists > div {
        display: inline-block;
        width: 100%;
        margin-right: 0;
        word-wrap: break-word;
    }

    #trippen-jap-25th-anniv .page-lists > div:nth-child(n+2) {
        margin-top: 30px;
    }

    #trippen-jap-25th-anniv .page-lists > div:nth-child(2n) {
        margin-right: 0;
    }
	
    .trippen-jap-25th-anniv-content {
        max-width: 100%;
    }
}



/*--------------------------------------------------------------

 15.0 Next generation Add:2024.05

--------------------------------------------------------------*/

.home-next-generation h1 {
	/* font-size: 2.2rem; */
	/* font-weight: bolder; */
}

.home-next-generation h1 a p {
    padding-bottom: 5px !important;
}

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

.next-generation-content {
	margin: 0 auto;
    max-width: 768px;
}

.next-generation-content .ng-innerblock {
	margin-top: 30px;
}

.next-generation-content .ng-innerblock .page-lists {
	display: grid;
    grid-template-columns: repeat(2, 1fr);
    justify-content: center;
	column-gap: 4%;
    width: 100%;
    box-sizing: border-box;
}

.next-generation-content .ng-innerblock .page-lists > div {
	display: block;
	width: 100%;
	box-sizing: border-box;
    text-align: center;
    word-wrap: break-word;
}

.next-generation-content .ng-innerblock .page-lists > div:nth-child(2n+1) {
	/* padding-right: 2.5%; */
}

.next-generation-content .ng-innerblock .page-lists > div:nth-child(2n) {
	/* padding-left: 2.5%; */
}

.next-generation-content .ng-innerblock .page-lists > div:nth-child(n+3) {
	margin-top: 30px;
}

.next-generation-content .ng-innerblock .page-lists > div p {
	margin-top: 15px;
}

.ng-lists {
	margin-top: var( --margin-top );
}

.ng-lists .page-lists {
	display: grid;
    grid-template-columns: repeat(4, 1fr);
    justify-content: center;
	column-gap: 4%;
    width: 100%;
    box-sizing: border-box;
}

.ng-lists .page-lists > div {
	display: block;
	width: 100%;
	box-sizing: border-box;
    text-align: center;
    word-wrap: break-word;
}

.ng-lists .page-lists > div:nth-child(n+5) {
	margin-top: var( --margin-top );
}

.ng-lists .page-lists > div p {
	margin-top: 15px;
}

#next-generation .entry-content h2 {
	font-size: 2.0rem;
}

#next-generation .caption-small {
	position: relative;
}

#next-generation .caption-small figcaption {
	position: absolute;
    bottom: 10px;
    right: 10px;
    color: #ffffff;
	font-size: 1.0rem !important;
    text-align: right;
}

#next-generation .profile {
	margin-top: var( --margin-top );
	padding: 5%;
	border: solid 1px #000;
	box-sizing: border-box;
	font-size: 1.4rem !important;
}

#next-generation .profile a {
	text-decoration: underline;
}

#next-generation .profile .instagram::before {
	content: '';
	display: inline-block;
	margin-right: 8px;
    width: 13px;
    height: 13px;
    background-image: url('asset/images/common/icon_instagram.png');
    background-size: contain;
	background-repeat: no-repeat;
    vertical-align: middle;
}

#next-generation .profile .mail::before {
	content: '';
	display: inline-block;
	margin-right: 8px;
    width: 13px;
    height: 13px;
    background-image: url('asset/images/common/icon_mail.png');
    background-size: contain;
	background-repeat: no-repeat;
    vertical-align: middle;
}

#next-generation .profile .note::before {
	content: '';
	display: inline-block;
	margin-right: 8px;
    width: 13px;
    height: 13px;
    background-image: url('asset/images/common/icon_note.png');
    background-size: contain;
	background-repeat: no-repeat;
    vertical-align: middle;
}

#next-generation .profile .website::before {
	content: '';
	display: inline-block;
	margin-right: 8px;
    width: 13px;
    height: 13px;
    background-image: url('asset/images/common/icon_website.png');
    background-size: contain;
	background-repeat: no-repeat;
    vertical-align: middle;
}

@media all and (max-width:767px) {
	
	.next-generation-content {
		max-width: 100%;
	}
	
	.next-generation-content .ng-innerblock .page-lists {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        justify-content: center;
        column-gap: 4%;
        width: 100%;
        box-sizing: border-box;
    }
	
	.next-generation-content .ng-innerblock .page-lists > div:nth-child(n+2) {
        margin-top: var( --margin-top );
    }
	
	.next-generation-content .ng-innerblock .page-lists > div p {
        margin-top: 10px;
    }
	
	.ng-lists {
        width: 100%;
        max-width: 540px;
        margin-top: var( --margin-top );
        margin-right: auto;
        margin-left: auto;
        /* padding: 0 5%; */
        }
	
	.ng-lists .page-lists {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        justify-content: center;
        column-gap: 4%;
        padding: 0 5%;
        width: 100%;
        box-sizing: border-box;
		width: 100%;
        max-width: 540px;
        margin-top: var( --margin-top );
        margin-right: auto;
        margin-left: auto;
    }
	
}



/*--------------------------------------------------------------

 16.0 Season

--------------------------------------------------------------*/


/* CSS custom properties for cascading variables ------------ */

:root {
  --season-color: #feecdd;
}