@charset "utf-8";
/* CSS Document */

/* zen-maru-gothic-regular - japanese_latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Zen Maru Gothic';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/zen-maru-gothic-v16-japanese_latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* zen-maru-gothic-500 - japanese_latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Zen Maru Gothic';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/zen-maru-gothic-v16-japanese_latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* zen-maru-gothic-700 - japanese_latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Zen Maru Gothic';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/zen-maru-gothic-v16-japanese_latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


/* reset
--------------------------------------------------*/
*{
	margin: 0;
	padding: 0;
}
*, ::after, ::before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
a,img{
	border: 0;
	outline: 0;
}
caption{
	text-align: left;
	font-weight: bold;
}
p{
	padding: 0;
	margin: 0 0 1em;
}
p.mb0{
	margin: 0;
}
dt{
	font-weight: bold;
}
i{
	font-style: normal;
}

/* anchor
--------------------------------------------------*/
a{
	color: #111;
	text-decoration: none;
  	transition: all .2s;
}
a[href^="tel:"] {
	cursor: default;
}
a[href^="tel:"]:hover {
	color: currentColor;
}
a:hover{
	color: #666;
}
a:hover img{
	opacity: 0.8;
}

/* ul, ol, dl
--------------------------------------------------*/
ul{
	list-style-type: none;
	margin-bottom: 20px;
}
ul.listmark{
	list-style-type: disc;
	padding-left: 20px;
}
ol{
	padding-left: 20px;
}
ol li{
	margin: 20px 0;
}
dl {
	margin: 10px 0;
}

/* .big .small .bold
--------------------------------------------------*/
.big {
    font-size: 120%;
}
.bbig {
    font-size: 130%;
}
.small {
    font-size: 80%;
}
.ssmall {
    font-size: 70%;
}
.bold {
    font-weight: bold;
}
.nowrap {
    white-space: nowrap; 
}
.pccenter {
    text-align: center; 
}
@media screen and (max-width: 768px) {
.pccenter {
    text-align: left; 
}
}
br.sponly {
	display: none;
}
@media screen and (max-width: 768px) {
br.pconly {
	display: none;
}
	br.sponly {
	display: block;
}
}

/* .mb_0 .mt_0
--------------------------------------------------*/
.mb_0 {
	margin-bottom: 0 !important;
}
.mt_0 {
	margin-top: 0 !important;
}
.mb_1 {
	margin-bottom: 1em !important;
}
.mb_2 {
	margin-bottom: 2em !important;
}


/* .pb_0 .pt_0
--------------------------------------------------*/
.pb_0 {
	padding-bottom: 0 !important;
}
.pt_0 {
	padding-top: 0 !important;
}


/* .icon_middle .icon_bottom .icon_2down .icon_4down
--------------------------------------------------*/
.icon_middle {
    vertical-align: middle;
}
.icon_bottom {
    vertical-align: bottom;
}
.icon_2down {
    vertical-align: -2px;
}
.icon_4down {
    vertical-align: -4px;
}

/* flex
--------------------------------------------------*/
.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    /*margin-right: -15px;
    margin-left: -15px;*/
}
.justify-between {
	justify-content: space-between;
}
.justify-around {
	justify-content: space-around;
}
.justify-center {
	justify-content: center;
}
.ai-center {
	align-items: center;
}
.justify-end {/*右、下に寄せる*/
	justify-content: flex-end;
}
.flex-reverse {/*右から、下から*/
    flex-direction : row-reverse;
}
.flex-colum {/*縦並び*/
    flex-direction: column;
}
.box {
    width: 50%;
}
.box img {
    width: 100%;
    height: auto;
}



/* body
--------------------------------------------------*/
body {
	margin: 0 auto;
	font-size: 14px;
	font-family: 'Zen Maru Gothic', sans-serif;
	font-weight: 400;
	line-height: 1.8;
	letter-spacing: 0.1em;
	background-color: #222;
	/*background: url("../img/hero-area_centerBK.jpg") repeat;*/
	color: #fff;
}

/*メニューが開いたときbodyをスクロールさせない*/
/*body.is_menuOpen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
}*/

/*-------------------
loading
-------------------*/
#wrap {
    display: none;
}
#loading {
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 999;
  background: url(../img/pattern01.png);
  text-align: center;
  color: #fff;
}

#loading_logo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

#loading_logo img {
  width:260px;
}

.fadeDown{
animation-name: fadeDownAnime;
animation-duration: 2s;
animation-fill-mode:forwards;
opacity: 0;
}

@keyframes fadeDownAnime{
  from {
    opacity: 0;
    transform: translateY(-100px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}


/*-------------------
fadeIn
-------------------*/
.fadeIn {
    opacity: 0;
    transition: .5s;
}
.fadeIn.active {
    opacity: 1;
}
.fade_up {
    position: relative;
    top: 30px;
}
.fade_up.active {
    top: 0;
}
.fade_left {
    position: relative;
    left: -30px;
}
.fade_left.active {
    left: 0;
}
.fade_down {
    position: relative;
    top: -30px;
}
.fade_down.active {
    top: 0;
}


/*-------------------
header,content
-------------------*/
#header {
    display: flex;
    justify-content: space-between;
}

/*-------------------
section
-------------------*/
section {
    width: 100%;
    max-width: 1200px;
    margin: 100px auto;
    padding: 0 15px;
}

@media screen and (max-width: 700px) {
section {
    margin: 60px auto;
}
}


/*-------------------
a.btn_01
-------------------*/
a.btn_01 {
    position: relative;
    overflow: hidden;
    display: block;
    width: 50%;
    min-width: 260px;
    margin: 0 auto 20px;
    /*ボタンの形状*/
    text-decoration: none;
    border: 1px solid #555;/* ボーダーの色と太さ */
    padding: 10px 30px;
    text-align: center;
    outline: none;
    /*アニメーションの指定*/   
    transition: ease .2s;
}
a.btn_01 span {
    position: relative;
    z-index: 3;/*z-indexの数値をあげて文字を背景よりも手前に表示*/
    color:#333;
}
a.btn_01:hover span {
    color:#fff;
}
/*== 背景が流れる（上から下） */
a.btn_01::before {
  content: '';
    /*絶対配置で位置を指定*/
  position: absolute;
  top:0;
  left: 0;
  z-index: 2;
    /*色や形状*/
  background:  #333;/*背景色*/
  width: 100%;
  height: 0;
    /*アニメーション*/
  transition:.3s cubic-bezier(0.8, 0, 0.2, 1) 0s;
}

/*hoverした際の形状*/
a.btn_01:hover::before{
   height: 100%;  
   background-color: #333;
}




/*-------------------
a.btn_02
-------------------*/
a.btn_02 span {
    font-size: 9rem;
    line-height: 1;
  	transition: all .3s;
}
a.btn_02:hover span {
    color: #fff;
    text-shadow:
        2px 0 0 #111,
        2px 2px 0 #111,
        0 2px 0 #fff,
        -2px 2px 0 #111,
        -2px 0 0 #111,
        -2px -2px 0 #111,
        0 -2px 0 #fff,
        2px -2px 0 #111;
}

@media screen and (max-width: 830px) {
a.btn_02 span {
    font-size: 6rem;
}
}
@media screen and (max-width: 530px) {
a.btn_02 span {
    font-size: 3rem;
}
}

/*-------------------
header
-------------------*/
.header-inner {
    width: 100%;
    height: 100px;
    /*border-bottom: 1px solid #333;*/
}
.header-h1 {
  	transition: all .6s;
    width: 200px;
    position: fixed;
    top: 16px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 100;
}
.page header .header-h1 ,
header .header-h1.open ,
header.is-small .header-h1 {
    left: 5%;
    transform: translateX(0);
    width: 120px;
}
.header-h1 a {
    display: block;
}
.header-h1 img {
    display: block;
    width: 100%;
    height: auto;
}
header .header-h1 img.sp {
	display: none;
}

@media screen and (max-width: 1500px) {
header.is-small .header-h1 {
    width: 200px;
}
header.is-small .header-h1 img.pc {
	display: none;
}
header.is-small .header-h1 img.sp {
	display: block;
}
}
@media screen and (max-width: 1300px) {
.header-h1 {
    left: 5%;
    transform: translateX(0);
}
}
@media screen and (max-width: 480px) {
header .header-h1.open img.pc {
	display: none;
}
header .header-h1.open img.sp {
	display: block;
    width: 200px;
}
header .header-h1 {
    width: 160px;
}
.page header .header-h1 {
    width: 100px;
}
.page header.is-small .header-h1 {
    width: 150px;
}
}

/*メニューボタンのエフェクト*/
#nav-button-container {
    position: fixed;
    top: 22px;
    right: 18px;
    /*background-color: #222;*/
    background-color: #3f1f20;
    z-index: 100;
    padding: 15px 12px;
    border-radius: 50%;
}
#nav-button {
    width: 34px;
    height: 26px;
    position: relative;
}
#nav-button span {
    display: inline-block;
    transition: all 0.4s;
    box-sizing: border-box;
}
#nav-button span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #fff;
    border-radius: 4px;
}
#nav-button span:nth-of-type(1) {
    top: 0;
}
#nav-button span:nth-of-type(2) {
    top: 12px;
}
#nav-button span:nth-of-type(3) {
    bottom: 0;
	right: 0;
	left: auto;
    /*width: 70%;*/
}
#nav-button.active span:nth-of-type(1) {
    -webkit-transform: translateY(12px) rotate(-45deg);
    transform: translateY(12px) rotate(-45deg);
}
#nav-button.active span:nth-of-type(2) {
    opacity: 0;
}
#nav-button.active span:nth-of-type(3) {
    width: 100%;
    -webkit-transform: translateY(-12px) rotate(45deg);
    transform: translateY(-12px) rotate(45deg);
}
/*-----*/

.header-nav {
    position: absolute;
    top: 0;
    right: 0;
    padding-right: 80px;
    border-bottom: 1px solid #333;
    border-left: 1px solid #333;
}
.page .header-nav {
    border: none;
}
ul.g-menu {
    padding: 26px 40px;
    margin-bottom: 0;
}
ul.g-menu li {
    /*padding: 10px 18px;*/
    padding: 4px 18px;/*日本語あり*/
  	transition: all .2s;
}
ul.g-menu li a {
    display: block;
    position: relative;
    color: #fff;
}
ul.g-menu li a span {/*日本語あり*/
	display: block;
	text-align: center;
	font-size: 12px;
	line-height: 1;
}
ul.g-menu li a:hover {
    color: #fff;
}
ul.g-menu li a::after {
    content: '';
    position: absolute;
    left: 0;
    /*bottom: 0;*/
    bottom: -4px;/*日本語あり*/
    width: 100%;
    height: 1px;
    background: #fff;
    opacity: 0;
    transition: all 0.4s;
}
ul.g-menu li a:hover::after {
    opacity: 1;
}

@media screen and (max-width: 700px) {
.header-nav {
    display: none;
}
}

/*スマホメニュー*/
.sp-nav {
    background-color: #222;
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -100;
    opacity: 0;
    transition: all 0.5s cubic-bezier(0.33, 1, 0.68, 1);
}
.sp-nav.open {
    z-index: 90;
    opacity: 1;
}
.sp-nav-inner {
    width: 80%;
    margin: 0 auto;
    padding-top: 200px;
}
.sp-nav .sp-menu ,
.sp-nav .sp-sns {
    opacity: 0;
    transition: all 0.5s cubic-bezier(0.33, 1, 0.68, 1);
}
.sp-nav.open .sp-menu ,
.sp-nav.open .sp-sns {
    opacity: 1;
}
.sp-nav .sp-menu,
.sp-nav a {
    color: #fff;
}
.sp-nav .sp-menu {
    width: 70%;
    margin-bottom: 0;
}
.sp-nav .sp-menu li {
    margin-bottom: 1.5em;
    line-height: 1.5;
}
.sp-nav .sp-menu li span.l {
    font-size: 1.5em;
    font-weight: bold;
    display: block;
}
.sp-nav .sp-sns li {
    margin-bottom: 1.5em;
}
@media screen and (max-width: 480px) {
.sp-nav-inner {
    flex-wrap: wrap;
    padding-top: 160px;
}
.sp-nav .sp-menu ,
.sp-nav .sp-sns {
    width: 100%;
}
.sp-nav .sp-sns {
    display: flex;
}
.sp-nav .sp-sns li {
    margin-right: 1em;
    margin-bottom: 0;
}
}

/*-------------------
first-section
-------------------*/
section#first-section {
    padding: 0;
    max-width: 1600px;
    position: relative;
    margin: 60px auto;
}
@media screen and (max-width: 480px) {
section#first-section {
    margin: 30px 0 80px;
}
}

section#first-section .swiper {
  margin: 0 20%;
}
section#first-section .swiper-slide {
  overflow: hidden;
}
section#first-section .swiper-slide img {
  height: auto;
  width: 100%;
}
/*スライド上のテキスト*/
section#first-section .swiper-text {
  color: #fff;
  left: 5%;
  position: absolute;
  text-shadow: 1px 1px 2px #333;
  top: 50%;
  width: 60%;
}
section#first-section .swiper-title {
  font-size: clamp(16px, 3vw, 30px);
  font-weight: 700;
}
section#first-section .swiper-desc {
  font-size: clamp(12px, 2vw, 20px);
  line-height: 1.5;
  margin-top: 3%;
}
/*----*/
/*ページ番号*/
section#first-section .swiper-pagination {
    position: absolute;
    left: 0;
    bottom: 60px;
    width: 100px;
    font-weight: bold;
}
section#first-section .swiper-pagination-current {
    font-size: 2em;
}
section#first-section .swiper-pagination-total {
    opacity: 0.8;
}
/*----*/
/*スライド外のテキスト*/
section#first-section .swiper-content-wrapper {
    font-size: 1.6em;
}
section#first-section .slide-content {
    position: absolute;
    top: 40%;
    left: 20px;
    z-index: 30;
    opacity: 0;
}
section#first-section .anm-started {
    opacity: 0;
    animation: fadein 2s ease forwards;
    animation-delay: .6s;
}
@keyframes fadein {
    100% {  opacity: 1;}
}
section#first-section .anm-finished {
    opacity: 1;
    animation: fadeout .6s ease forwards;
}
@keyframes fadeout {
    100% {  opacity: 0;}
}
/*----*/
/*スライドと連動しない常時表示テキスト*/
.top_message {
    font-size: 1.6em;
    position: absolute;
    top: 40%;
    left: 20px;
    z-index: 30;
}
.top_message p {
	display: inline;
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
	padding: .4em 1em;
	line-height: 2.8;
	color: #111;
	background-color: rgba(255,255,255,0.80)
}

/*オンラインショップボタン*/
.online_btn {
    position: absolute;
    bottom: 20%;
    right: 30px;
    width: 120px;
    height: 120px;
    border: none;
    background-color:  transparent;
    transition: all 0.4s;
    z-index: 80;
}
.online_btn a {
    display: block;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background-color: #111;
    color: #fff;
    line-height: 18px;
    padding-top: 15px;
}
.online_btn a:hover {
    background-color: #333;
}

/*SNSボタン*/
.right_sns {
    position: absolute;
    top: 0;
    right: 15px;
    z-index: 80;
}
.right_sns li {
    margin-bottom: 0.5em;
}
.right_sns li a {
    color: #fff;
    text-align: center;
    display: block;
}

@media screen and (max-width: 900px) {
section#first-section {
    padding: 30px 0 80px;
    margin-bottom: 30px;
}
section#first-section .swiper {
    margin: 0 8%;
}
/*ページ番号*/
section#first-section .swiper-pagination {
    position: absolute;
    left: 5%;
    bottom: 40px;
}
/*スライド外のテキスト*/
section#first-section .swiper-content-wrapper {
    font-size: 1em;
}
.top_message {
    font-size: 1em;
    top: 90%;
	left: 0;
}
.top_message p {
	line-height: 2.0;
}
section#first-section .slide-content {
    position: absolute;
    top: auto;
    bottom: -40px;
    left: 8%;
}
/*オンラインショップボタン*/
.online_btn {
    position: absolute;
    bottom: 10px;
    right: 10px;
}

}

/*-------------------
section_h2
-------------------*/
h2.section_h2 {
    font-size: 2em;
    margin-bottom: 15px;
    padding-left: 1.5em;
	position: relative;
}
h2.section_h2::before {
    content: '';
    background: #fff;
    width: 1em;
    height: 1px;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}
section.white h2.section_h2::before {
    background: #111;
}
section .h2_sub {
    font-size: 1.2em;
}

/*-------------------
center_h2
-------------------*/
h2.center_h2 {
	text-align: center;
    font-size: 1.8em;
    margin-bottom: 15px;
}
h2.center_h2 span {
    font-size: 0.8em;
}
h2.center_h2.small {
	font-size: 1.5em;
}

/*-------------------
news-section
-------------------*/
section#news-section {
    padding: 60px 0;
    max-width: none;
    position: relative;
}
section#news-section h2 {
    margin-bottom: 15px;
    font-size: 2em;
}
section#news-section::before {
    position: absolute;
    content: '';
    display: block;
    width: 100%;
    height: 30%;
    left: 0;
    bottom: 0;
    background: url(../img/pattern01.png);
}
section#news-section .news_inner {
    padding: 0 15% 20px;
    max-width: 1200px;
    margin: 0 auto;
    background-color: #fff;
    color: #111;
    position: relative;
}
section#news-section .news_inner::before {
    width: 100%;
    height: 0;
    display: block;
    position: absolute;
    left: 0;
    content: "";
    border-bottom: solid 60px #fff;
    border-left: solid 60px transparent;
    bottom: 100%;
}
section#news-section ul li {
    padding: 0.5em 0;
}
section#news-section ul li dt {
    margin-right: 2em;
    color: #666;
}
section#news-section ul li dt span {
    margin-left: 1em;
    padding: 0 0.8em;
    background-color: #ccc;
    color: #111;
    font-weight: normal;
}
@media screen and (max-width: 480px) {
section#news-section .news_inner {
    padding: 0 8% 20px;
}
}

/*-------------------
about-section
-------------------*/
.about-section.white {
    color: #111;
	max-width: none;
	margin: 0;
	padding: 0;
    background: url(../img/pattern01.png);
}
.page .about-section.white {
    background:  transparent;
}
.about-section.white .about-section-inner {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 15px;
}
.about-section h2 ,
.about-section p {
	text-align: center;
}

@media screen and (max-width: 768px) {
.about-section p {
	text-align: left;
}
}


/*-------------------
panel-section
-------------------*/
#panel-section ul li {
    width: 49%;
    margin-bottom: 1%;
}
#panel-section ul li a {
    border-radius: 15px;
    overflow: hidden;
    display: block;
    position: relative;
}
#panel-section ul li img {
    width: 100%;
    height: auto;
    display: block;
    transform: scale(1.0);
	transition: all .4s ease-in-out;
}
#panel-section ul li a:hover img {
    transform: scale(1.1);
}
#panel-section ul li a .panel_onbox {
    position: absolute;
    top: 60%;
    left: 0;
    width: 100%;
    text-align: center;
    color: #fff;
    font-weight: bold;
    font-size: 1.4em;
    background-color: rgba(34,34,34,0.7);
    padding-top: 1.5em;
}
@media screen and (max-width: 900px) {
#panel-section ul li a .panel_onbox {
    top: 35%;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
}
#panel-section ul li a .panel_onbox p {
    font-size: 0.8em;
    margin-bottom: 1em;
}
}
@media screen and (max-width: 480px) {
#panel-section ul li a .panel_onbox p {
    margin-bottom: 0.2em;
}
}

/*-------------------
info-section
-------------------*/
.info-section.white {
    color: #111;
    max-width: none;
    margin: 0;
    padding: 0;
    background: url(../img/pattern01.png);
}
.info-section .info-section-inner {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 15px;
}
.info-section .info_box {
    margin-bottom: 100px;
}
.info-section .slider {
    position: relative;
}
.info-section .swiper-button-prev,
.info-section .swiper-button-next {
    color: #aaa;
}
.info-section .swiper-button-prev::after,
.info-section .swiper-button-next::after {
    font-size: 2em;
}
.info-section .mini_img img {
    width: 49.5%;
    height: auto;
}
.info-section .box.text {
    padding: 0 2em;
}
.info-section .info_h3_area {
    padding: 1.5em 0;
}
.info-section h3.info_h3 {
    font-size: 1.3em;
}
.info-section .info_h3_right {
    padding-top: 5px;
}

@media screen and (max-width: 480px) {
.info-section .info_box {
    margin-bottom: 60px;
}
.info-section .box {
    width: 100%;
}
.info-section .box.text {
    padding: 1em;
}
}

/*-------------------
panorama-area
-------------------*/
.panorama-area01 {
	height: 300px;
    background: url(../img/panorama_img01.jpg) no-repeat bottom center / cover;
}


/*-------------------
footer
-------------------*/
footer {
    max-width: none;
}
.footer_inner {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 10%;
}
.footer_inner a {
    color: #fff;
}
.footer_inner p {
    margin-bottom: 0;
	font-size: 13px;
}
.footer_logo {
    width: 120px;
}
.footer_logo img {
    width: 100%;
	height: auto;
}
.footer_content {
    margin-top: 20px;
}
.footer_content .access {
    width: 40%;
}
.footer_content .menu ,
.footer_content .etc {
    width: 30%;
}
.footer_inner p.access_btn {
    margin-top: 1em;
    margin-bottom: 1em;
}
.footer_inner p.access_btn a {
    display: block;
    background-color: #000;
    width: 40px;
    height: 40px;
    padding: 8px;
    border-radius: 50%;
    text-align: center;
    margin-right: 10px;
}
.footer_sns a {
    margin-right: 10px;
}
.copyright {
    margin-top: 1em;
}
@media screen and (max-width: 900px) {
.footer_inner {
    padding: 30px 10% 60px;
}
.footer_content .access {
    width: 100%;
    margin-bottom: 20px;
}
.footer_content .menu ,
.footer_content .etc {
    width: 50%;
}
}

/*-------------------
page-top
-------------------*/
#page-top {
    position: fixed;
    bottom: 0;
    right: 4vw;
    font-size: 16px;
    font-weight: bold;
    color: #000;
  	transition: all .4s;
}
#page-top a {
    display: block;
    padding-bottom: 80px;
    color: #000;
}
#page-top a::after {
    content: '';
    width: 2px;
    height: 60px;
    position: absolute;
    bottom: 0;
    right: 50%;
    margin: auto;
    background-color: #000;
  	transition: all .4s;
}
#page-top:hover {
    bottom: 20px;
}
#page-top:hover a::after {
    bottom: 20px;
    background-color: #3F1F20;
}

/*===下層ページ=======================*/
/* dl_01 （項目・説明） */
.dl_01 {
    overflow: hidden;
    border-bottom: 0.5px solid #666;
    display: flex;
    flex-wrap: wrap;
}
.dl_01 dt ,
.dl_01 dd {
    position: relative;
    padding: 2em 0;
    font-weight: normal;
}
.dl_01 dt::before ,
.dl_01 dd::before {
    position: absolute;
    top: 0;
    left: 0;
    content: '';
    width: 100%;
    height: 0.5px;
    background-color: #666;
}
.dl_01 dt {
    width: 25%;
    text-align: center;
}
.dl_01 dd {
    width: 75%;
}
@media screen and (max-width: 600px) {
.dl_01 dt ,
.dl_01 dd {
    width: 100%;
    text-align: left;
    padding: 1em;
}
.dl_01 dd::before {
    width: 0;
}
}

/* flame_01 （siro） */
.flame_01 {
	background-color: #fff;
	padding: 20px 15px 10px;
}
.flame_01 a {
	padding-bottom: 0.4em;
    border-bottom: 1px solid;
    color: #400608; 
}



/*-------------------
content
-------------------*/
.page #content {
    background: url(../img/pattern01.png);
}


/*-------------------
pageheader-section
-------------------*/
#pageheader-section {
	background-color: #222;
	max-width: none;
    margin: 0;
	padding: 0;
}
.pageheader-section-inner {
    text-align: center;
	width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 15px;
}
.page-title {
    font-size: 3em;
    margin-bottom: 0;
}

@media screen and (max-width: 480px) {
.pageheader-section-inner {
    padding: 30px 15px;
}
.page-title {
    font-size: 2em;
}
}

/*-------------------
pagelink-section
-------------------*/
#pagelink-section {
    text-align: center;
    margin: 60px auto 0;
}
#pagelink-section.white {
    color: #111;
    max-width: none;
    margin: 0;
    padding: 0;
}
#pagelink-section.white .pagelink-section-inner {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 15px 0;
}
ul.pagelink_list {
    margin-bottom: 0;
    padding-bottom: 40px;
}
ul.pagelink_list li {
    width: 33%;
    border: 1px solid #222;
}
ul.pagelink_list li:not(:first-child):not(:nth-child(4)):not(:nth-child(7)) {
    border-left-width: 0;
}
ul.pagelink_list li:nth-child(4),
ul.pagelink_list li:nth-child(5),
ul.pagelink_list li:nth-child(6) {
    border-top-width: 0;
	border-bottom-width: 0;
}
ul.pagelink_list li a {
    display: block;
    padding: 0.5em 0;
    background: url(../img/pattern01.png);
}
ul.pagelink_list li a:hover,
ul.pagelink_list li.active a {
    background: #000;
    color: #fff;
}

/*-------------------
history-section
-------------------*/
.history-section.white {
    color: #111;
	max-width: none;
	margin: 0;
	padding: 0;
}
.history-section.white .history-section-inner {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 15px;
}
.history_table_box {
	flex-basis: 70%;
}
.history_img_box {
	flex-basis: 30%;
}
.history_img_box img {
	max-width: 100%;
	height: auto;
	margin: 15px;
}

/*history_table*/
.history_table th ,
.history_table td {
	vertical-align: top;
	text-align: left;
}
.history_table th {
	width: 135px;
	font-size: 24px;
	color: #400608;
}
.history_table td {
	padding-bottom: 30px;
}

.history_table th {
	position: relative;
	line-height: 1;
}
.history_table th::before {
	content: "";
	display: block;
	width: 1px;
	background: #400608;
	height: 100%;
	position: absolute;
	top: 4px;
	right: 44px;
}
.history_table th::after {
	content: "";
	display: block;
	width: 9px;
	height: 9px;
	background: #400608;
	border-radius: 4.5px;
	position: absolute;
	top: 4px;
	right: 40px;
 }

@media screen and (max-width: 980px) {
.history_table_box {
	flex-basis: 100%;
}
.history_img_box {
	flex-basis: 100%;
}
}
@media screen and (max-width: 480px) {
.history_table th {
	width: 90px;
	font-size: 20px;
}
.history_table th::before {
	right: 24px;
}
.history_table th::after {
	right: 20px;
}
}

/*-------------------
links-section
-------------------*/
.links-section.white {
    color: #111;
	max-width: none;
	margin: 0;
	padding: 0;
}
.links-section.white .links-section-inner {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 15px;
}

/*links_table*/
.links_table {
	width: 100%;
    margin: 0 auto;
	background-color: #fff;
    border: 1px solid #666;
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
}
.links_table th ,
.links_table td {
	padding: 10px;
    vertical-align: text-top;
    border-bottom: 1px solid #666;
}
.links_table th {
	color: #fff;
    font-weight: normal;
    background-color: #666;
    border-bottom: 1px solid #ccc;
}
.links_table td {
	border-left: 1px solid #666;
}
.links_table tr:last-child th ,
.links_table tr:last-child td {
	border-bottom-width: 0;
}




/* ABOUT・SHOP */
/*-------------------
info-section
-------------------*/
.info-section .shop_map {
    margin-bottom: 0.5em;
}
.info-section .shop_map iframe {
    width: 100%;
}

@media screen and (max-width: 680px) {
.info-section .box {
    width: 100%;
}
}

/*-------------------
profile-section
-------------------*/
.profile-section.white {
    background-color: #fff;
    color: #111;
    max-width: none;
    margin: 0;
    padding: 0;
}
.profile-section.white .profile-section-inner {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 15px;
}

/*-------------------
gallery-section
-------------------*/
.gallery-section.white {
    background-color: #fff;
    color: #111;
    max-width: none;
    margin: 0;
    padding: 0;
    background: url(../img/pattern01.png);
}
.page .gallery-section.white {
	background: transparent;
}
.gallery-section .gallery-section-inner {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 15px;
}
.gallery-section .gallery-section-inner figcaption {
	font-size: 13px;
	line-height: 1.2;
	padding-top: 5px;
}
.gallery-section .gallery-section-inner figure {
    margin-bottom: 15px;
}
.gallery-section .gallery-section-inner .divi3 figure {
    width: 30%;
}
.gallery-section .gallery-section-inner .divi2 figure {
    width: 45%;
}
.gallery-section .gallery-section-inner figure img {
    width: 100%;
    max-width: 100%;
    height: auto;
    display: block;
}
@media screen and (max-width: 600px) {
.gallery-section .gallery-section-inner .divi3 figure {
    width: 45%;
}
.gallery-section .gallery-section-inner .divi2 figure {
    width: 100%;
}
}
@media screen and (max-width: 480px) {
.gallery-section .gallery-section-inner .divi3 figure {
    width: 100%;
}
}

/*-------------------
product-section
-------------------*/
.product-section.white {
    background-color: #fff;
    color: #111;
    max-width: none;
    margin: 0;
    padding: 0;
    background: url(../img/pattern01.png);
}
.page .product-section.white {
	background: transparent;
}
.product-section .product-section-inner {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 15px;
}

/* product_list_a （商品リスト：行） */
.product_list_a li {
    border-bottom: 1px solid #aaa;
    padding: 1.5em;
}
.product_list_a li:first-child {
    border-top: 1px solid #aaa;
}
.product_list_a .pd_img_area {
    width: 20%;
}
.product_list_a .pd_info_area {
    width: 70%;
}
.product_list_a .pd_info_area .pd_info_area {
    width: 70%;
}
.product_list_a .pd_info_area .pd_price_area {
    width: 30%;
}
.product_list_a .pd_img_area img {
    max-width: 100%;
    height: auto;
}
.product_list_a li p {
    margin-bottom: 0.3em;
}
.product_list_a .pd_info_title {
    font-size: 1.5em;
    font-weight: bold;
}
.product_list_a .pd_price_price {
    font-size: 1.3em;
    font-weight: bold;
}
@media screen and (max-width: 660px) {
.product_list_a .pd_img_area {
    width: 60%;
}
.product_list_a .pd_info_area {
    width: 100%;
}
.product_list_a .pd_info_area .pd_info_area {
    width: 100%;
}
.product_list_a .pd_info_area .pd_price_area {
    width: 100%;
}
}

/* product_list_b （商品リスト：カード） */
.product_list_b li {
    width: 25%;
    padding: 0.5em;
}
.product_list_b li p {
    margin-bottom: 0;
}
.product_list_b li .pd_img_area {
    border-radius: 15px;
    overflow: hidden;
    margin-bottom: 0.5em;
}
.product_list_b li .pd_img_area img {
    max-width: 100%;
    height: auto;
    display: block;
}
.product_list_b .pd_info_title {
    font-size: 1.3em;
    font-weight: bold;
}
.product_list_b .pd_price_price {
    font-size: 1.1em;
    font-weight: bold;
}
@media screen and (max-width: 660px) {
.product_list_b li {
    width: 33%;
}
}
@media screen and (max-width: 480px) {
.product_list_b li {
    width: 50%;
}
}

/*-------------------
newslist-section
-------------------*/
.newslist-section.white {
    background-color: #fff;
    color: #111;
    max-width: none;
    margin: 0;
    padding: 0;
    background: url(../img/pattern01.png);
}
.page .newslist-section.white {
	background: transparent;
}
.newslist-section .newslist-section-inner {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px 60px;
}

/* newslist （お知らせ一覧ページ） */
ul.newslist li {
    border-bottom: 1px solid #ddd;
}
ul.newslist li a {
    padding: 40px;
    align-items: center;
}
ul.newslist li a:hover {
    background-color: #e7e7eb;
}
ul.newslist li a p {
    margin-bottom: 0;
}
ul.newslist li a p.news_date {
   width: 130px;
}
ul.newslist li a p.news_category {
   width: 100px;
   background-color: #111;
   color: #fff;
   text-align: center;
   margin-right: 50px;
}

/* ページネーション
---------------------*/
.pagination{
  	/*border-radius: 7px;*/
  	overflow: hidden;
    margin: 0 auto;
    padding: 30px 0;
}
.pagination ul{
  	display: flex;
  	justify-content: center;
  	list-style-type: none;
  	color: #fff;
    margin-bottom: 0;
}
.pagination ul li.active{
  	background-color: #000;
  	font-size: 12px;
  	padding: 8px 12px;
  	border-right: 1px solid #fff;
}
.pagination li a{
  	font-size: 12px;
  	display: block;
  	padding: 8px 12px;
  	text-decoration: none;
  	color: #fff;
  	background-color: rgba(17,17,17,0.4);
  	border-right: 1px solid #fff;
}
.pagination li a:hover{
  	background-color: rgba(17,17,17,0.4);
}
@media screen and (max-width: 480px) {
.pagination ul li.active{
  	padding: 5px 8px;
}
.pagination li a{
  	padding: 5px 8px;
}
.pagination li.first a,
.pagination li.prev a,
.pagination li.next a,
.pagination li.last a {
  	font-size: 11px;
    letter-spacing: 0;
    height: 31px;
}
}



/*-------------------
article-section
-------------------*/
.article-section.white {
    color: #111;
    max-width: none;
    margin: 0;
    padding: 0;
    /*background: url(../img/pattern01.png);*/
}
.article-section .article-section-inner {
    width: 100%;
    max-width: 960px;
    margin: 0 auto;
    padding: 60px 15px;
}

.article {
    margin-bottom: 80px;
}
.article .article_title {
    font-size: 1.5em;
    padding-bottom: 0.8em;
    border-bottom: 1px solid #111;
    margin-bottom: 2em;
}
.article .article_category {
   width: 100px;
   background-color: #111;
   color: #fff;
   text-align: center;
   margin-left: 50px;
}
.article .article_content a {
    padding-bottom: 0.4em;
    border-bottom: 1px solid;
	color: #400608;
}
.article .article_content ul {
    list-style-type: disc;
	padding-left: 1.5em;
}
.article .article_content ul li {
    
}

/*カスタム投稿　商品ページスライダー*/
.product_img.slider {
    width: 50%;
}
.product_info {
    width: 45%;
}
.product_img.slider .swiper-slide,
.product_img.slider .swiper-slide img {
    width: 100%;
    height: auto;
}
.product_img.slider {
    position: relative;
}
.product_img.slider .swiper-button-prev ,
.product_img.slider .swiper-button-next {
    color: #666;
}
@media screen and (max-width: 680px) {
.product_img.slider {
    width: 100%;
}
.product_info {
    width: 100%;
}
}


/*-------------------
contact-section
-------------------*/
.contact-section.white {
    color: #111;
    max-width: none;
    margin: 0;
    padding: 0;
    /*background: url(../img/pattern01.png);*/
}
.contact-section .contact-section-inner {
    width: 100%;
    max-width: 960px;
    margin: 0 auto;
    padding: 60px 15px;
}
.contact-section .contact-section-inner .map {
	margin-bottom: 20px;
}
.contact-section .contact-section-inner img {
	max-width: 100%;
	height: auto;
}

/*
con_in_table
-------------------*/
table.con_in_table {
    width: 100%;
    border-spacing: 10px;
}
.con_in_table th, .con_in_table td {
    padding: 1.5em 0.5em;
    border-bottom: 1px solid #ccc;
}
.con_in_table th {
    width: 20%;
    text-align: left;
    font-size: 0.9em;
}
.con_in_table td {
    padding-left: 2.5em;
}
.con_in_table tr:first-child th ,
.con_in_table tr:first-child td {
    border-top: 1px solid #ccc;
}
.con_in_table td ul {
    margin-bottom: 0;
    list-style-type: disc;
    margin-left: 1.5em;
}
@media screen and (max-width: 600px) {
table.con_in_table {
    border-spacing: inherit;
}
.con_in_table th, .con_in_table td {
    display: block;
    width: 100%;
}
.con_in_table tr:first-child td {
    border-top: none;
}
.con_in_table th {
    padding: 0.5em;
    border-bottom: none;
}
.con_in_table td {
    padding: 1em 0.5em;
}
}

.form_table th span {
    margin-left: 5px;
    font-size: 0.7em;
    font-weight: bold;
    display: inline-block;
    color: #a73836;
}
td.radio_area label {
    display: block;
}
td.radio_area label input {
    margin-right: 0.5em;
}
.form_table .item_text ,
.privacy_box {
    width: 100%;
    height: 40px;
    padding: 0 10px;
    border: 1px solid #aaa;
    border-radius: 5px;
}
.form_table textarea.item_text {
    height: 200px;
}
.privacy_box {
    height: 300px;
    overflow-y: scroll;
    color: #333;
    font-size: 12px;
    margin-bottom: 15px;
    background-color: #fafafa;
}
.privacy_box p {
    padding: 0 2em;
}

.form_footer {
    margin: 15px;
}
.item_check {
    margin-right: 1em;
}
.form_btn {
    width: 160px;
    height: 50px;
    display: block;
    font-weight: bold;
    border-radius: 5px;
    border: 1px solid #111;
    background-color: #111;
    color: #fff;
    cursor: pointer;
    transition: all .2s;
}
.form_btn:hover {
    background-color: #fff;
    color: #111;
}