﻿@import url('https://fonts.googleapis.com/css2?family=Gilda+Display&family=Noto+Serif+JP:wght@400;500&display=swap');

.font_serif, .cate_title, .sub_cate_title, #intro .intro_txt h2, .box_title1, .box_title, .cms_5-c .box_txt1::before, #cms_5-c .box_txt1::before, #top_contents2 h3 span, .top_cms_title h4, #page_title h2, #page10 ul li a span, #footer_links  {
    font-family: 'Noto Serif JP', "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif";
}
.shop_link, #main_nav li a, .sc_nav li a, .intro_title h3, .top_cms_title p, #top_cms .top_cms_box .more a, #page_title p, #page10 ul li a span.font_14{
	font-family: 'Gilda Display', 'Noto Serif JP', "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif"!important;
}


/* color ---------------------------------------------------------------------------------------------*/
.linkStyle{color: #160a0a;transition: opacity .3s;}
.linkStyle:hover{opacity: 0.7}
body,.txt_color_nomal{color: #333333;}


/* all ---------------------------------------------------------------------------------------------*/
#loader::after{background: url( "../dup/img/bg01.jpg" ) center / cover no-repeat;}
body{
	background: url( "../dup/img/bg01.jpg" ) center / cover no-repeat;
	background-attachment: fixed;
	overflow: hidden;
}
h1 img {max-width: 350px;}
header #header .shop_link a{color: #828282;}
.fa, .far, .fas{color: #afafaf;}
.sc_nav .far{color: #fff!important;}



/* top ---------------------------------------------------------------------------------------------*/
#main_img{position: relative}
#main_img .main_txt {
    width: 47%;
    right: 4%;
    top: 30%;
    z-index: 10;
    pointer-events: none;
}
#intro{margin-bottom: 150px;}
#intro .intro_img {margin-bottom: 125px;}
.intro_txt{background-color: transparent;}
#intro .intro_txt h2 {
    transform: none;
    margin-bottom: 70px;
    font-size: 30px;
    letter-spacing: 3px;
    line-height: 1.5;
    position: relative;
    box-shadow: rgba(0,0,0,0.07) -4px 9px 59px -6px;
}
#top_contents1{background-color: transparent}

.contents1_txt h3 {
    letter-spacing: 3px;
    line-height: 1.5;
    transform: none!important;
}
#top_contents2 h3{padding-left: 0;padding-right: 0;margin-bottom: 55px}
#top_contents2 h3::after{
	
}
#top_contents2 h3 span{
	letter-spacing: 3px;
    font-size: 23px;
    padding: 20px;
	position: relative
}
#top_contents2 h3 span::before {
    content: '';
    display: inline-block;
    width: 49px;
    height: 49px;
    background-image: url(../dup/img/item01.png);
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    left: 50%;
    top: -40px;
    transform: translateX(-50%);
    opacity: 0.7;
}
#top_contents1 .contents1_txt h3{text-shadow: none}


/* under ---------------------------------------------------------------------------------------------*/
#page_title h2, #page_title p {
    color: #fff;
    letter-spacing: 5px;
    text-shadow: 0 0 10px rgb(0 0 0 / 50%);
}
#page_title h2{font-size: 27px;}
#page_title p{opacity: 1;font-size: 19px;}



/* cms ---------------------------------------------------------------------------------------------*/
.cms_6-c .cate_box{
	box-shadow: rgb(0 0 0 / 7%) -4px 9px 59px -6px;
    margin-bottom: 80px;
    border: none;
}
#cms_6-c .circle, #cms_6-c .arrow {display: none}



/* アニメーション ---------------------------------------------------------------------------------------------*/
#main_img img{opacity: 0;transition: opacity 2s;}
#main_img img.no2{transition-delay: .7s}
#main_img img.no3{transition-delay: 1.4s}
#main_img.animStart img{opacity: 1;}

.fadein{
transform: translateY(50px);
transition: transform 1.5s ease, opacity 2s;
transition-property: opacity,transform;
opacity: 0;
}
.fadein.start{transform: translateY(0);opacity: 1;}




/* IE */
@media all and (-ms-high-contrast: none){
#top_cms .top_cms_box .more a{padding-bottom: 18px!important}
#cms_2-b .cate_title, #cms_6-a .cate_title{padding-top: 8px!important}
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
body {background-image: none;}
body::before {
    content: "";
    display: block;
    min-width: 100vw;
    min-height: 100vh;
    background-image: url(../dup/img/bg01.jpg);
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
}
header #header{padding: 25px 30px 30px;}
h1 img{width: 40%!important;}
#intro .intro_img {margin-bottom: 80px;}
.intro_txt{width: 100%!important}
#top_contents1{background-color: #f4f4f4;}
#top_contents1 .contents1_txt {
    margin-left: 0;
    margin: auto;
}
#top_contents1 .contents1_txt h3 {
    margin-bottom: 20px;
    letter-spacing: 3px;
    font-size: 23px;
}
#page10 ul li a span{font-size: 15px;}
}

/* ---------- スマホ ---------- */
@media screen and (max-width: 667px){
#menu_bt{width: 33px;}
#menu_bt > div span {height: 2px;margin-bottom: 8px;}
#menu_bt.active > div span:nth-of-type(3) {transform: translateY(-15px) rotate(-45deg);}
#menu_bt{top: 18px;}
header #header {padding: 16px 30px 29px;}
h1 img{width: 60%!important}
#main_img{margin-bottom: 35px;}
#main_img .main_txt {
    width: 54%;
    right: 2%;
    top: 27%;
}
.shop_link.pc_hide i{transform: translateY(2px);}
#intro {margin-bottom: 49px;}
.intro_txt {width: 90%!important;}
#intro .intro_title{transform: translateY(-2px);text-align: center}
#intro .intro_txt h2{margin-bottom: 41px;font-size: 18px;}
#top_contents1 .contents1_txt h3, #top_contents2 h3 span{font-size: 18px;}
#top_contents2 h3{margin-top: 34px;margin-bottom: 27px;}
#top_contents2 h3 span::before{width: 36px;height: 36px;top: -32px;}
#page_title {padding: 35px 30px 129px 20px;min-height: 274px;}
#page_title h2 {font-size: 22px}
#page_title p{font-size: 17px;}
}






