/*
Theme Name: ごふく美馬2025
Author: BASARA
Author URI: 
Version: 1.0
*/

/* =Reset
-------------------------------------------------------------- */
@charset "utf-8";

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, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside,
canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
}


html {
	font-size: 62.5%;
}

body{
	line-height: 1.6;
	font-size: 1.6rem;
	font-family: -apple-system-body, BlinkMacSystemFont, 'Noto Serif JP', "Hiragino Mincho ProN", serif;
	font-weight: 300;
	color: #231815;
}
_:lang(x)::-ms-backdrop, .selector {
	font-family: "Segoe UI", Meiryo, sans-serif;
}
_:-ms-lang(x)::-ms-backdrop, body {
    overflow-x: hidden;
}
#top{
    position: relative;
    width: 100%;
    max-height: 800px;
    margin-bottom: 1px;
}
#top > img{
    width: 100%;
    height: 800px;
    object-fit: cover;
}
#top > p > img{
    position: absolute;
    transform: translateY(-50%);
    top: 50%;
    right: 10%;
    width: 80px;
}
#top nav{
    position: absolute;
    top: 60px;
    right: 80px;
    font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "メイリオ", sans-serif;
    color: #fff;
    letter-spacing: 0.25rem;
    justify-content: space-between;
    align-items: center;
}
#top nav p{
    font-size: 1.2rem;
    display: flex;
    align-items: center;
}
#top nav p:first-child{
    margin-right: 20px;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
}
#top nav p a{
    width: 28px;
    padding: 0 3px;
}

h1,h2,h3,h4,h5{
	font-family: 'Noto Serif JP', "Hiragino Mincho ProN", serif;
}
h1{
	font-size: 3.0rem;
	margin-bottom: 40px;
}
h2{
	font-size: 2.8rem;
	text-align: center;
	margin-bottom: 35px;
}
h3{
	font-size: 2.4rem;
	margin-bottom: 30px;
    border-bottom: #c0b188 solid 1px;
    padding-bottom: 18px;
    font-weight: 300;
}
h4{
	font-size: 2.2rem;
	margin-bottom: 40px;
    text-align: center;
    font-weight: 300;
}
h4 span{
    display: block;
	font-size: 1.2rem;
    letter-spacing: 0.25em;
}
h5{
	font-size: 1.8rem;
	margin-bottom: 20px;
}


a{
	color: #000;
	text-decoration: none;
	transition: opacity 0.5s,background-color 0.5s,color 0.5s;
}
a:visited{}
a:hover{
	opacity:0.7;
    transition: opacity 0.5s,background-color 1s,color 1s;
	filter:alpha(opacity=70); /* For IE8 and earlier */
	-ms-filter: "alpha(opacity=70)"; /* ie 8 */
	-moz-opacity:0.7; /* FF lt 1.5, Netscape */
	-khtml-opacity: 0.7; /* Safari 1.x */
	zoom:1;
}
a:hover img{
	opacity: 0.7;
	transition: opacity 0.5s;
	filter: alpha(opacity=70); /* For IE8 and earlier */
	-ms-filter: "alpha(opacity=70)"; /* ie 8 */
	-moz-opacity: 0.7; /* FF lt 1.5, Netscape */
	-khtml-opacity: 0.7; /* Safari 1.x */
	zoom: 1;
}


ol,
ul {
	list-style: none;
    overflow-wrap: inherit;
}

table {
	width: 100%;
	border-collapse: collapse;
	background-color: #FFFFFF;
}
th {
	background-color: #FAFAFA;
}
th, td {
	border: 1px solid #eee;
	padding: 10px;
}

p{
}

strong{
    font-weight: bold;
}

img{
	max-width:100%;
	vertical-align: bottom;
}

iframe{
	vertical-align: bottom;
}

.link:hover{
    cursor: pointer;
    opacity: 0.7;
	transition: opacity 0.5s;
}

.sp{
    display: none;
}

p.anchor {
	padding-top: 120px;
	margin-top: -120px;
	display: block;
	position: relative;
	z-index: -1
}


/* Header -------------------------*/
header{
	position:relative;
}
header#navi{
	padding: 25px 0;
	background-color: rgba(255,255,255,1.0);
	font-family: 'Klee One', 'Noto Serif JP', "Hiragino Mincho ProN", serif, cursive;
}
header#navi .wrap{
	max-width: inherit;
    display: flex;
    justify-content: center;
    align-items: center;
}
header#navi.m_fixed{
	position: fixed;
    top: 0;
	width: 100%;
	z-index: 9999;
	background-color: rgba(255,255,255,0.95);
    padding: 15px 0;
    min-height: auto;
}
header#navi.m_fixed #logo img{
	height: 40px;
}
header.m_fixed nav > ul > li {
	padding: 10px 0 10px 10px;
}
header.m_fixed nav#global > ul ul {
    padding-top: 15px;
}

/* Navigation -------------------------*/
header nav:after{
    content: '';
    display: block;
    clear: both;
}
header nav{
}

header nav > ul{
	margin:0;
	padding:0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

header nav > ul > li{
	margin:0;
	padding: 15px 0 15px 10px;
	position: relative;
}

header nav > ul > li > a{
	text-align:center;
	display:block;
	padding-left: 10px;
    font-size: 1.4rem;
    font-weight: 600;
}
header nav > ul > li a::before{
	content: "";
    display: inline-block;
    background-image: url("img/menu.png");
    background-repeat: no-repeat;
    background-position: left center;
    background-size: contain;
    width: 14px;
    height: 12px;
    margin-right: 5px;
}
header nav > ul >  li+li a{
	border-left: #000 solid 1px;
}

header nav a:hover {
	opacity: 1.0;
}
header nav > ul > li > a::after {
    width: 100%;
    height: 0;
    background: #c0a36c;
    content: '';
    position: absolute;
    top: 75%;
    left: 10px;
    opacity: 0;
    transition: all 0.3s ease-out;
    margin: auto;
  }
header nav > ul > li > a:hover::after,header nav > ul > li.current-menu-item > a::after {
    opacity: 1.0;
    top: 100%;
    height: 3px;
  }

header nav#global > ul ul {
    transition: opacity .2s ease-in;
    opacity: 0;
    width: 100%;
    min-width: 150px;
    left: calc(50% + 10px);
    top: 100%;
    transform: translate(-50%,0);
    padding-top: 25px;
    position: absolute;
    box-sizing: border-box;
    height: 0;
    overflow: hidden;
    z-index: 999;
}
header nav#global > ul > li:hover ul {
    opacity: 1;
    height: auto;
}
header nav#global > ul ul li {
    display: block;
    background-color: rgba(255, 255, 255, 0.9);
    padding: 0 10px;
}
header nav#global > ul ul li a {
    font-size: 1.4rem;
    display: block;
    padding: 5px 0;
}
header nav#global > ul ul li+li a {
    border-top: #ebebeb solid 1px;
}

header #logo{
    margin-right: 30px;
    width: 195px;
}
header #logo img{
	height: 50px;
    transition: height 0.7s; 
}


/* Footer -------------------------*/
footer{
	padding: 0 0 40px;
    background-color: #6f6371;
    text-align: center;
    color: #fff;
}
footer nav{
    background-color: #322a41;
    margin-bottom: 30px;
	font-family: 'Klee One', 'Noto Serif JP', "Hiragino Mincho ProN", serif, cursive;
    font-weight: 600;
}
footer nav ul{
    display: flex;
    justify-content: center;
    font-size: 1.4rem;
    padding: 10px 0;
}
footer nav ul.sub-menu{
    display: none;
}
footer nav ul li{
    padding: 0 20px;
}
footer nav ul li+li{
    border-left: #fff solid 1px;
}
footer nav a{
    color: #fff;
}
footer .wrap p:first-child a{
	width: 250px;
    display: inline-block;
}
footer .add a{
	color: #fff;
}
footer .add p{
	font-size: 1.4rem;
}
footer .add p+p{
	margin-top: 10px;
}
footer .copy{
    font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "メイリオ", sans-serif;
	margin-top: 30px;
	font-size: 1.2rem;
}
footer .sns a{
    display: inline-block;
    width: 28px;
    margin: 25px 5px;
}


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

.wrap{
	max-width:960px;
	padding:0px 15px;
	margin:0 auto;
}
.wrap::after{
    content: '';
    display: block;
    clear: both;
}
.single-product #main .wrap{
	max-width:1000px;
}

.wrapping01{
    background-color: #f1f1f1;
	padding: 100px 0;
}

#main{
	margin: 100px 0 180px;
    min-height: 500px;
}

/* Top -------------------------*/
#bana{
    justify-content: space-between;
    background: #000;
}
#bana div{
    width: 50%;
    position: relative;
    overflow: hidden;
}
#bana div::after{
    content: "";
    display: block;
    background-image: url("img/arrow.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    transform: translate(-50%,-50%);
    top: 70%;
    left: 50%;
    width: 50%;
    height: 10%;
    max-height: 25px;
    transition: 2s all;
}
#bana div:hover::after{
    top: 90%;
    transition: all 0.6s ease-out;
}
#bana div p+p{
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
    width: 90%;
    height: 10%;
    max-height: 30px;
    text-align: center;
}
#bana div p+p img{
    width: auto;
    height: 100%;
}
#bana div:hover p:first-child img {
    transform: scale(1.2, 1.2);
    transition: 2s all;
    opacity: 1.0;
}
#bana div p a:hover,#bana div.link:hover {
    opacity: 1.0;
}
#bana img {
    transition: 2s all;
}

#movie .wrap {
    padding: 0;
}
#movie video {
    width: 100%;
    height: 100%;
}

#online p:first-child{
    background-color: #9790a4;
    padding: 10px 0;
    color: #fff;
    text-align: center;
    letter-spacing: 1.0rem;
}
#online p+p a:hover,#online p+p a:hover img{
    opacity: 1.0;
}
#online p+p a img{
  filter: brightness(1);
  transition: all 0.8s;
  width: 100%;
  max-height: 535px;
  object-fit: cover;
}
#online p+p a:hover img{
  filter: brightness(0.85);
  transition: all 0.4s;
}

#event > h3{
    text-align: center;
    border-bottom: none;
    margin-bottom: 40px;
}
#event > h3 img{
    width: auto;
    height: 60px;
}
#event > .flex{
    justify-content: center;
}
#event .eventbox{
    font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "メイリオ", sans-serif;
    font-size: 1.3rem;
    position: relative;
    height: 100%;
    padding: 20px 30px 20px 60px;
    box-sizing: border-box;
    background-color: #f0f0ee;
}
#event .mb-eventbox{
    font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "メイリオ", sans-serif;
    font-size: 1.3rem;
    position: relative;
    height: 100%;
    padding: 20px 60px 20px 30px;
    box-sizing: border-box;
    background-color: #f0f0ee;
    margin-bottom: 20px;
}
#event .swiper-wrapper .swiper-slide:nth-child(2n) .eventbox
#event .swiper-wrapper .swiper-slide:nth-child(2n) .mb-eventbox{
    background-color: #f0efe2;
}
#event .eventbox::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 30px;
    height: 100%;
    background-color: #594255;
    background-image: url("img/arrow.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 10px 30px;
}
#event .mb-eventbox::before{
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 30px;
    height: 100%;
    background-color: #594255;
    background-image: url("img/arrow.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 10px 30px;
}
#event .eventbox:nth-child(2n)::before,
#event .mb-eventbox:nth-child(2n)::before{
    background-color: #524748;
}
#event .eventbox p:first-child,
#event .mb-eventbox p:first-child{
	font-family: 'Klee One', 'Noto Serif JP', "Hiragino Mincho ProN", serif, cursive;
    font-size: 1.6rem;
    font-weight: 600;
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: #b8aa86 solid 1px;
}
#event .eventbox p:first-child span,
#event .mb-eventbox p:first-child span{
    background-color: #606060;
    color: #fff;
	font-family: 'Noto Serif JP', "Hiragino Mincho ProN", serif;
    font-size: 1.2rem;
    font-weight: 600;
    line-height: 1;
    margin-top: 3px;
    margin-left: 5px;
    padding: 5px 10px 7px;
    display: block;
    float: right;
}
#event .eventbox p:first-child span.open,
#event .mb-eventbox p:first-child span.open{
    background-color: #CB0000;
}
#event .eventbox p:first-child span.wait,
#event .mb-eventbox p:first-child span.wait{
    background-color: #2E2B7E;
}
#event .eventbox p:first-child span.nocheck,#event .eventbox p:first-child span time,
#event .mb-eventbox p:first-child span.nocheck,#event .mb-eventbox p:first-child span time{
    display: none;
}
#event .eventbox .flex,
#event .mb-eventbox .flex{
    flex-wrap: nowrap;
}
#event .eventbox .flex span:first-child,
#event .mb-eventbox .flex span:first-child{
    min-width: 60px;
}
#event .eventbox .flex span,
#event .mb-eventbox .flex span{
    width: auto;
}

#event p.link {
    text-align: center;
}
#event p.link a {
    width: 200px;
    display: inline-block;
    position: relative;
    padding: 10px 20px;
    font-size: 1.8rem;
    color: #fff;
    background-color: #c0b188;
}
#event p.link a::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 30px;
    height: 100%;
    background-image: url(img/next.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 10px 20px;
}

#info .wrap{
	max-width:500px;
    padding: 0px 40px;
}
#info > h3{
    position: relative;
    border-bottom: none;
    margin-bottom: 60px;
}
#info > h3 span{
    display: block;
}
#info > h3 span:first-child img{
    width: 100%;
    height: 150px;
    object-fit: cover;
}
#info > h3 span+span{
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
}
#info > h3 span+span img{
    width: auto;
    height: 60px;
}
#info ul{
    font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "メイリオ", sans-serif;
    font-size: 1.4rem;
    font-weight: 600;
    flex-wrap: nowrap;
}
#info ul+ul{
    border-top: #9E9E9F solid 1px;
    margin-top: 20px;
    padding-top: 20px;
}
#info ul li{
	width: 75px;
}
#info ul li+li{
	width: 100%;
    margin-left: 20px;
}
#info ul li a{
	font-weight: 300;
}
#info ul li+li span{
    background-color: #606060;
    color: #fff;
	font-family: 'Noto Serif JP', "Hiragino Mincho ProN", serif;
    font-size: 1.2rem;
    font-weight: 600;
    line-height: 1;
    margin-left: 10px;
    padding: 3px 8px 5px;
    display: block;
    float: right;
}
#info ul li+li span.open{
    background-color: #CB0000;
}
#info ul li+li span.wait{
    background-color: #2E2B7E;
}

.archivebox{
    display: flex;
    width: 100%;
    padding: 50px;
    box-sizing: border-box;
    background-color: #ebebe9;
}
.archivebox.w-turning{
    flex-wrap: wrap;
}
.archivebox+.archivebox{
    margin-top: 10px;
}
.archivebox > div{
    width: 100%;
    font-size: 1.6rem;
}
.archivebox > div+div{
    width: 40%;
    max-width: 380px;
    margin-left: 10%;
}
.archivebox > div+div.w-turning{
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-bottom: 40px;
    text-align: center;
    order: -1;
}
.archivebox div > p:first-child{
    font-weight: 600;
}
.archivebox div > p:first-child span{
    background-color: #606060;
    color: #fff;
    font-size: 1.4rem;
    padding: 2px 10px;
    display: inline-block;
    margin-right: 5px;
    margin-bottom: 10px;
}
.archivebox div > p:first-child span.open{
    background-color: #CB0000;
}
.archivebox div > p:first-child span.wait{
    background-color: #2E2B7E;
}
.archivebox div > p:first-child span.nocheck,.archivebox div > p:first-child span time{
    display: none;
}
.archivebox h3{
    font-size: 2.2rem;
    font-weight: 600;
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: #b8aa86 solid 1px;
}
.archivebox div .flex,.archivebox div section{
    flex-wrap: nowrap;
    font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "メイリオ", sans-serif;
    font-size: 1.6rem;
}
.category-info .archivebox div section br+br{
    display: none;
}
.archivebox div .flex+.flex{
    margin-top: 10px;
}
.archivebox div .flex span:first-child{
    min-width: 80px;
}
.archivebox div .flex span{
    width: auto;
}
.archivebox div .flex+p,.archivebox div section+p{
    margin-top: 30px;
}
.archivebox div .flex+p a,.archivebox div section+p a{
    width: 200px;
    display: inline-block;
    position: relative;
    padding: 10px 20px;
    font-size: 1.8rem;
    color: #fff;
    background-color: #c0b188;
}
.archivebox div .flex+p a::after,.archivebox div section+p a::after{
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 30px;
    height: 100%;
    background-image: url("img/next.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 10px 20px;
}
.archivebox div .edit{
    margin-top: 10px;
}
.archivebox div .edit p{
    font-size: 1.6rem;
    line-height: 1.6;
}
.back a{
    display: block;
    background-color: #c0b188;
    color: #fff;
    font-size: 1.8rem;
    text-align: center;
    width: 300px;
    margin: 50px auto 0;
    padding: 10px;
    position: relative;
}
.back a::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 30px;
    height: 100%;
    background-image: url("img/back.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 10px 20px;
}
.state{
    margin-top: 100px;
}
.state h4{
    margin-bottom: 40px;
}
.state .flex{
    flex-wrap: nowrap;
    font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "メイリオ", sans-serif;
}
.state .flex+.flex{
    margin-top: 40px;
    flex-wrap: wrap;
}
.state .flex div{
    width: 100%;
}
.state .flex div+div{
    max-width: 460px;
    margin-left: 50px;
}
.state .flex+.flex div{
    width: 30%;
    margin-right: 5%;
    margin-bottom: 30px;
}
.state .flex+.flex div:nth-child(3n){
    margin-right: 0;
}
.state .flex+.flex div+div{
    max-width: inherit;
    margin-left: 0;
}
.state .flex+.flex div p+p{
    margin-top: 10px;
    text-align: center;
}
.cat-description{
    font-size: 2.2rem;
    text-align: center;
    line-height: 2;
    margin-bottom: 40px;
}
.categorybox div{
    width: 48%;
    background-color: #efefef;
    margin-right: 4%;
    padding: 20px;
    box-sizing: border-box;
    position: relative;
    margin-top: 40px;
}
.categorybox div:nth-child(2n){
    margin-right: 0;
}
.categorybox div h4{
    text-align: left;
    margin-bottom: 0;
}
.categorybox div::after{
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 50px;
    height: 100%;
    background-image: url("img/arrow-cat.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 15px 20px;
}

.archivelink{
    display: flex;
    justify-content: center;
    margin-bottom: 50px;
    flex-wrap: wrap;
}
.archivelink p{
    margin: 0 25px;
    font-size: 2.0rem;
}
.archivelink p a{
    padding-bottom: 10px;
    display: block;
}
.archivelink p a:hover,.archivelink p.current a{
    border-bottom: #c0a36c solid 2px;
}
.productcopy{
    position: relative;
}
.productcopy img{
    width: 100%;
    min-height: 550px;
    object-fit: cover;
}
.productcopy div+div{
    position: absolute;
    transform: translate(-50% , -50%);
    top: 60%;
    left: 50%;
    width: 85%;
    /*max-width: 960px;*/
    padding: 0 15px;
    color: #fff;
    text-shadow: 0 0 10px rgba(0,0,0,0.20),0 0 10px rgba(0,0,0,0.20),0 0 10px rgba(0,0,0,0.20),0 0 10px rgba(0,0,0,0.20),0px 0px 3px rgba(0,0,0,0.5);
}
.productcopy div+div h3{
    font-size: 3.4rem;
    margin-bottom: 45px;
    border-bottom: none;
    padding-bottom: 0;
	font-family: 'Klee One', 'Noto Serif JP', "Hiragino Mincho ProN", serif, cursive;
}
.productcopy div+div p{
    font-size: 1.8rem;
	font-family: 'Klee One', 'Noto Serif JP', "Hiragino Mincho ProN", serif, cursive;
}
.productcopy div+div h3+p{
    font-feature-settings: "palt";
}
.productcopy div+div p+p{
    font-size: 2.2rem;
    text-align: right;
    margin-top: 40px;
    max-width: 490px;
}
.productlist{
    display: flex;
    flex-wrap: wrap;
}
.productlist div{
    width: calc((100% - 10px) / 3);
    margin-right: 5px;
    position: relative;
}
.productlist div:nth-child(3n){
    margin-right: 0;
}
.productlist div:nth-child(n+4){
    margin-top: 5px;
}
.productlist div::after {
  content: "";
  display: block;
  background-image: url("img/arrow-p.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  transform: translate(-50%,-50%);
  top: 68%;
  left: 50%;
  width: 50%;
  height: 10%;
  max-height: 30px;
  transition: 2s all;
}
.productlist div:hover::after{
    top: 90%;
    transition: all 0.6s ease-out;
}
.productlist div h4{
    font-size: 2.2rem;
    letter-spacing: 0.5em;
    text-indent: 0.5em;
    margin-bottom: 0;
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
    text-shadow: 0 0 10px rgba(0,0,0,0.20),0 0 10px rgba(0,0,0,0.20),0 0 10px rgba(0,0,0,0.20),0 0 10px rgba(0,0,0,0.20),0px 0px 3px rgba(0,0,0,0.5);
}
.productlist div a{
    color: #fff;
}
.productlist div p{
    aspect-ratio: 6 / 4;
    overflow: hidden;
    background-color: #000;
}
.productlist div p img{
    height: 100%;
    width: 100%;
    object-fit: cover;
    transition: 2s all;
}
.productlist div:hover p:first-child img {
    transform: scale(1.2, 1.2);
    transition: 2s all;
}
.productlist div p a:hover,.productlist div.link:hover {
    opacity: 1.0;
}
.product-slide h3{
    font-size: 2.2rem;
    text-align: center;
    letter-spacing: 0.25em;
    text-indent: 0.25em;
    margin-bottom: 70px;
    border: none;
}
.product-slide h3 span{
    position: relative;
}
.product-slide h3 span::after{
    content: "";
    position: absolute;
    width: 116%;
    height: 2px;
    left: -8%;
    bottom: -15px;
    background-color: #b99c6c;
}
.product-slide .swiper-slide div:first-child{
    aspect-ratio: 6 / 4;
    overflow: hidden;
    /*add*/
    padding-bottom: 40px;
}
.product-slide .swiper-slide div:first-child img{
    height: 100%;
    width: 100%;
	-o-object-fit:contain;
    object-fit: contain;
}
.product-slide .swiper-slide div+div{
    margin-top: 50px;
}
.productbox .flex:first-child{
    justify-content: space-between;
}
.productbox .flex:first-child div{
    width: 54%;
}
.productbox .flex:first-child div+div{
    width: 42%;
}
.productbox .flex+.flex {
    margin-top: 80px;
}
.productbox .flex+.flex div{
    width: 32%;
    margin-right: 2%;
}
.productbox .flex+.flex div:nth-child(3n){
    margin-right: 0;
}
.productbox .flex+.flex div:nth-child(n+4){
    margin-top: 70px;
}
.productbox .flex+.flex div p:first-child{
    aspect-ratio: 1 / 1;
    background-color: #eee;
}
.productbox .flex+.flex div p:first-child img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.productbox .flex+.flex div p+p{
    margin-top: 30px;
    font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "メイリオ", sans-serif;
    text-align: center;
}


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

article+article{ margin-top: 65px!important; }
section+section{ margin-top: 100px; }
section::after{
    content: '';
    display: block;
    clear: both;
}

#topimg{
    position: relative;
    height: 120px;
    background-image: url("img/topimg01.jpg");
    background-size: cover;
    background-position: center;
}
.category-info #topimg{
    background-image: url("img/info.jpg");
}
.category-gonomi #topimg,.category-suigen #topimg{
    background-image: url("img/topimg00.jpg");
}
.term-information #topimg{
    background-image: url("img/saiji.jpg");
}
.term-culture #topimg{
    background-image: url("img/geino.jpg");
}
.store #topimg{
    background-image: url("img/topimg02.jpg");
}
.lesson #topimg{
    background-image: url("img/topimg03.jpg");
}
.contact #topimg{
    background-image: url("img/topimg04.jpg");
}
.post-type-archive-product #topimg,.tax-product_cat #topimg,.single-product #topimg{
    background-image: url("img/gonomi.jpg");
}
#topimg h2{
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
    color: #fff;
	font-family: 'Klee One', 'Noto Serif JP', "Hiragino Mincho ProN", serif, cursive;
    font-size: 2.6rem;
    font-weight: 600;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
	margin-bottom: 0;
}
.lesson .wrap section:first-child.flex{
    justify-content: space-between;
}
.lesson .wrap section:first-child.flex div{
    width: 46%;
}
.lesson .wrap section:first-child.flex div a{
    padding: 10px 20px;
    font-size: 2.2rem;
    background-color: #efefef;
    display: block;
    position: relative;
}
.lesson .wrap section:first-child.flex div a::after{
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 50px;
    height: 100%;
    background-image: url("img/link.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 20px 15px;
}
.lesson .wrap section > h4{
    font-size: 3.2rem;
}
.lesson .wrap section .flex{
    flex-wrap: nowrap;
}
.lesson .wrap section.kitsuke .flex{
    max-width: 830px;
    margin-left: auto;
    margin-right: auto;
}
.lesson .wrap section .flex div{
    width: auto;
}
.lesson .wrap section .flex > div:first-child{
    width: 250px;
    min-width: 250px;
    margin-right: 40px;
}
.lesson .wrap section.kyogen h4+.flex > div:first-child{
    width: 360px;
    min-width: 360px;
    margin-right: 20px;
}
.lesson .wrap section.kyogen .edit p{
    line-height: 2.0;
    font-feature-settings: "palt";
}
.lesson .wrap section.kyogen .yotei {
    margin-top: 40px;
}
.lesson .wrap section.kyogen .yotei h5{
    font-size: 2.2rem;
    font-weight: 300;
    position: relative;
    padding-left: 35px;
}
.lesson .wrap section.kyogen .yotei h5::before{
    content: "";
    display: inline-block;
    position: absolute;
    left: 0;
    background-image: url("img/yotei.svg");
    background-repeat: no-repeat;
    background-position: left center;
    background-size: contain;
    width: 25px;
    height: 35px;
}
.lesson .wrap section.kyogen .yotei div p{
    font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "メイリオ", sans-serif;
    font-size: 1.8rem;
    padding: 10px 20px;
    background-color: rgba(96,96,96,0.05);
}
.lesson .wrap section.kyogen .yotei div p+p{
    margin-top: 2px;
}
.lesson .wrap section.kyogen .inst {
    display: flex;
    font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "メイリオ", sans-serif;
    font-size: 1.8rem;
    margin-top: 60px;
    padding: 30px;
    border: #daa766 solid 1px;
}
.lesson .wrap section.kyogen .inst h5 {
    font-size: 2.6rem;
    font-weight: 300;
}
.lesson .wrap section.kyogen .inst div+div {
    min-width: 180px;
    margin-left: 40px;
    text-align: center;
}
.lesson .wrap section .flex.lessonlist{
    max-width: 100%;
    margin-top: 80px;
    justify-content: space-between;
}
.lesson .wrap section .flex.lessonlist div{
    width: 31%;
    margin-right: 0;
}
.lesson .wrap section .flex.lessonlist div p+p{
    margin-top: 10px;
    text-align: center;
}
.lesson .wrap section.kitsuke .edit p{
    font-feature-settings: "palt";
}
.store .wrap .flex > div{
    width: 48%;
    margin-right: 4%;
    margin-bottom: 50px;
}
.store .wrap .flex > div:nth-child(2n){
    margin-right: 0;
}
.store .wrap .flex+div img{
    width: 100%;
}
.store .wrap .flex+div div p+p{
    margin: 10px 0 50px;
    text-align: center;
}
.store .wrapping01 .maparea{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.store .wrapping01 .maparea > div{
    width: 48%;
}
.store .wrapping01 .maparea > div > div{
    aspect-ratio: 7 / 5;
}
.store .wrapping01 .maparea > div > div iframe {
    width: 100%;
    height: 100%;
}
.store .wrapping01 .maparea+p{
    margin-top: 30px;
    font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "メイリオ", sans-serif;
    font-size: 1.8rem;
    line-height: 2.0;
}


/* Pagetop -------------------------*/
#pagetop {
	position: fixed;
	z-index: 1;
	bottom: 80px;
	right: 20px;
	z-index: 9999;
	font-size: 6.0rem;
}
#pagetop a {
	color: #000;
    text-shadow: 0 0 10px rgba(255,255,255,0.20),0 0 10px rgba(255,255,255,0.20),0 0 10px rgba(255,255,255,0.20),0 0 10px rgba(255,255,255,0.20),0px 0px 3px rgba(255,255,255,0.5);
}

/* Clearfix -------------------------*/
.clearfix:after{
	content: '';
	display: block;
	clear: both;
}
.clearfix{
	zoom: 1; /* for IE6/7 */
}
.flex{
    display: flex;
    flex-wrap: wrap;
}


/* Other -------------------------*/
.link:hover{
    cursor: pointer;
}

nav.page-navi{
	margin-top: 30px;
}
nav.page-navi li.prev{
	float:left;
}
nav.page-navi li.next{
	float:right;
}

img.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
	}

img.alignright {
	margin: 0 0 10px 20px;
	display: inline-block;
	}

img.alignleft {
	margin: 0 20px 10px 0;
	display: inline-block;
	}

.aligncenter {
    display: block;
    margin: 0 auto;
    max-width: max-content;
	}

.alignright {
	float: right;
	}

.alignleft {
	float: left
	}

.size-auto,.size-full,.size-large,.size-medium,.size-thumbnail {
	max-width: 100%;
	height: auto;
}

.wp-pagenavi{
    margin: 60px 0;
    text-align: center;
}

.wp-caption-text {
    font-size: 1.4rem;
    margin-top: 5px;
}

img[class*="wp-image-"],
img[class*="attachment-"] {
    max-width: 100%;
    height: auto;
}

.edit ul,#tinymce ul{
	margin: 0 0 1.8em;
    padding-left: 1.8em;
    list-style-type: disc;
}
.edit ol,#tinymce ol{
	margin: 0 0 1.8em;
    padding-left: 2.6em;
    list-style-type: decimal;
}
.edit a,#tinymce a{
	color: #0000ff;
    text-decoration: underline;
}
.edit{
    position: relative;
	text-align: justify;
    text-justify: inter-character;
	font-family: 'Klee One', 'Noto Serif JP', "Hiragino Mincho ProN", serif, cursive;
    font-size: 1.8rem;
}
.edit p{
    line-height: 2.5;
}
.edit blockquote,#tinymce blockquote{
	background-color: #eee;
    padding: 10px;
    margin: 5px 10px;
    border-radius: 10px;
}
.edit a[target="_blank"]::after{
    display: inline-block;
    content: "\f08e";
    font-family: FontAwesome;
    margin-left: 5px;
    color: #ccc;
}
.edit a[href$=".pdf"]::after{
    display: inline-block;
    content: "\f1c1";
    font-family: FontAwesome;
    margin-left: 5px;
    color: #ccc;
}
.edit a[href$=".doc"]::after,.edit a[href$=".docx"]::after,.edit a[href$=".xls"]::after,.edit a[href$=".xlsx"]::after,.edit a[href$=".txt"]::after{
    display: inline-block;
    content: "\f0f6";
    font-family: FontAwesome;
    margin-left: 5px;
    color: #ccc;
}
.edit a[href^="mailto:"]::after{
    display: inline-block;
    content: "\f003";
    font-family: FontAwesome;
    margin-left: 5px;
    color: #ccc;
}
.edit a i{
    color: #ccc;
}
.youtube{
    position: relative;
    width: 100%;
    padding-top: 56.25%;
}
.youtube iframe{
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
}


/* Forms
--------------------------------------------- */
.mw_wp_form {
    max-width: 800px;
    margin: 0 auto;
}
.mw_wp_form .required::after{
	content: "（*必須）";
    color: #B70000;
    font-size: 1.4rem;
	margin-left: 5px;
    font-weight: normal;
}
.mw_wp_form .error::before{
	content: "\f071";
	font-family: FontAwesome;
	margin-right: 5px;
    font-weight: normal;
}
.mw_wp_form.mw_wp_form_preview h5+p{
    background-color: #eee;
    border: 1px solid #ccc;
    padding: 10px;
    width: 100%;
    min-height: 45px;
    box-sizing: border-box;
    font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "メイリオ", sans-serif;
}
input,
select,
textarea,
button {
	background-color: #fff;
	border: 1px solid #ccc;
	padding: 10px;
	width: 100%;
    font-size: 1.6rem;
    font-weight: 300;
    font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "メイリオ", sans-serif;
    box-sizing: border-box;
}
input:focus,
textarea:focus {
	border: 1px solid #999;
	outline: none;
}
input[type="checkbox"],
input[type="image"],
input[type="radio"] {
	width: auto;
}
::-moz-placeholder {
	color: #777;
	opacity: 1;
}
::-webkit-input-placeholder {
	color: #777;
}
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
    display: inline-block;
    padding: 15px 40px;
    background-color: #666;
    color: #FFFFFF;
    border: none;
    width: 200px;
    margin: 10px 10px 0;
    font-size: 1.8rem;
    box-sizing: border-box;
    text-align: center;
}
button[type="submit"] {
    background-color: #999;
}
button:hover,
input:hover[type="button"],
input:hover[type="reset"],
input:hover[type="submit"],
.button:hover,
button:focus,
input:focus[type="button"],
input:focus[type="reset"],
input:focus[type="submit"],
.button:focus  {
	background-color: #bbb;
    cursor: pointer;
}


/* 1120px -------------------------*/
@media screen and (max-width: 1120px) {
header#navi,header #logo,header #cart,header #maypage{
	display: none!important;
}
#top,#topimg{
    margin-top: 80px;
}
#main {
    margin: 70px 0;
}
#event .eventbox{
    width: 100%;
}
p.anchor {
    padding-top: 100px;
    margin-top: -100px
}

}


/* 640px -------------------------*/
@media screen and (max-width: 640px) {
.pc{
    display: none;
}
.sp{
    display: inherit;
}
#spmenu{
    width: 80%;
    max-width: 300px;
    margin-left: auto;
    margin-right: auto;
}
#spmenu p{
    float: left;
    margin: 40px 0;
    font-size: 1.2rem;
    font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "メイリオ", sans-serif;
}
#spmenu p+p{
    float: right;
    margin: 50px 0;
}
#spmenu p+p a{
    display: inline-block;
    width: 35px;
    margin-left: 10px;
}
#top{
    max-height: inherit;
}
#top > img{
    width: 100%;
    height: auto;
}
#top > p,#top nav{
    display: none;
}
footer {
    padding: 30px 0 40px;
}
footer nav{
    display: none;
}
#online p:first-child{
    letter-spacing: 0.75rem;
}
.archivebox {
    flex-wrap: wrap;
    padding: 20px;
}

.archivebox div.h-turning {
    width: 100%;
    max-width: 220px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 40px;
    order: -1;
}
.archivebox div.h-turning img {
    max-height: 220px;
}
.archivebox .edit img {
    width: 100%;
}
.state .flex {
    flex-wrap: wrap;
}
.state .flex div.stateimg {
    max-width: 100%;
    margin-left: 0;
    margin-bottom: 40px;
    order: -1;
}
.state .flex + .flex div {
  width: 100%;
  margin-right: 0;
}
.categorybox div{
    width: 100%;
    margin-right: 0;
}
.categorybox div+div{
    margin-top: 25px;
}
.lesson .wrap section:first-child.flex div{
    width: 100%;
}
.lesson .wrap section:first-child.flex div+div{
    margin-top: 3px;
}
.lesson .wrap section .flex{
    flex-wrap: wrap;
}
.lesson .wrap section .flex div{
    width: 100%;
    margin-bottom: 50px;
}
.lesson .wrap section .flex div:first-child{
    width: 100%;
    margin-right: 0;
}
.lesson .wrap section .flex.lessonlist div{
    width: 100%;
}
.lesson .wrap section.kyogen .inst {
    flex-wrap: wrap;
}
.lesson .wrap section.kyogen .inst div+div {
    width: 100%;
    margin-left: 0;
    margin-bottom: 30px;
    order: -1;
}
.store .wrap .flex > div{
    width: 100%;
    margin-right: 0;
}
.store .wrapping01 .maparea > div{
    width: 100%;
}
.store .wrapping01 .maparea > div+div{
    margin-top: 20px;
}
.cat-description {
    font-size: 2.0rem;
}
.archivelink p {
    width: 100%;
    margin-bottom: 25px;
}
.productcopy div + div {
  top: 50%;
}
.productlist div {
    width: 100%;
    margin-right: 0;
}
.productlist div+div {
    margin-top: 5px;
}
.productbox .flex:first-child div {
    width: 100%!important;
}
.productbox .flex:first-child div + div {
    margin-top: 30px;
}
.productbox .flex + .flex div {
    width: 100%;
    margin-right: 0;
}
.productbox .flex + .flex div+div {
    margin-top: 70px;
}

}


/* 480px -------------------------*/
@media screen and (max-width: 480px) {
.product-slide .swiper-slide div:first-child{
    aspect-ratio: 6 / 5;
    padding-bottom: 30px;
}
.lesson .wrap section > h4{
    font-size: 2.2rem;
}

}


/* 投稿・ページ等の個別cssは『add.css』に追加して下さい。*/